Question

使用下面的设置，我可以为窗口紫色的整个宽度着色。内部堆栈面板是图表画面并向左移动。

<StackPanel HorizontalAlignment="Stretch"
            Orientation="Horizontal"
            Background="BlueViolet"
            Height="70">
  <StackPanel HorizontalAlignment="Left"
              Orientation="Horizontal"
              Background="Chartreuse" >

我期待如果我将内部堆叠面板的水平对齐方式更改为拉伸，它也会填满所有宽度，但这不会发生。我已经尝试了正确和拉伸对齐，似乎它不会影响内部控件的宽度。

根据帖子我发现是实现它的方式（它确实适用于外部控件）。我能错过什么？我已经删除了外部面板中声明的其他控件（即所有兄弟姐妹到了图表中的颜色）并没有区别。

Answer 1

我过去花了很多时间与stackpanels斗争。

以下是发生的事情：您的外部堆栈面板（＃1）具有水平方向，这意味着它可以根据需要填充尽可能多的子项，并将它们水平堆叠。每当孩子被渲染时，孩子和父母之间都会有一个对话：

- （孩子）我想渲染，我有这个尺寸。你能为我提供空间吗？

- （家长）我会做计算，我们会看看它是怎么回事。

如果是嵌套的stackpanels，你的外部stackpanel会尝试拉伸并要求无限宽度，而它的父网格只给出了他所拥有的所有宽度。但是stackpanel的目的是在一个方向上是无限的，如果它的孩子要求无限宽度（内部stackpanel做什么，当你设置水平对齐拉伸时），那么我们只给他最小宽度，因为否则它们会长出来控制和消耗PC上的所有内存。

所以这只是对发生的事情的一种艺术观点，它可能是不准确的。

<强>更新

简单地说：您不能为具有水平方向的堆叠面板的子项设置水平对齐以进行拉伸，并且无法为具有垂直方向的堆叠面板的子项设置垂直对齐。嗯，你可以，但它不会伸展，因为如果它可以，那么它将无限伸展

回答：用网格替换内部或外部堆栈面板。事实上，您使用2个具有相同方向的嵌套堆栈面板表示您做错了什么。说实话，在我看来，stackpanel的唯一应用是在scrollviewer中。在其他情况下，最好使用WrapPanel。

Answer 2

List<countryObject>将根据需要为其内容提供尽可能多的空间，但也只需要尽可能少的空间。

如果您想要精确填充窗口的宽度，只需将外部StackPanel替换为StackPanel

如果您希望Grid至少填写整个内容，可以将StackPanel绑定到其父MinWidth：

ActualWidth

Answer 3

我也很挣扎，并提供此解决方案，因为其他人正在寻找类似的解决方案。

我的特殊问题是我需要将汉堡菜单放到SplitView的顶部。然后我试图让stackpanel填满下面的整个区域。这很有效，下面的屏幕截图显示了它的样子。

希望如果这不是最佳做法，这会有所帮助并乐于纠正。

<Grid Background="{ThemeResource AppBarToggleButtonCheckedPointerOverBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <StackPanel Height="50" Grid.Row="0">
        <StackPanel Background="Gray" Height="50" HorizontalAlignment="Stretch">
            <Button x:Name="HamburgerButton" FontFamily="Segoe MDL2 Assets" Content="&#xE700;"
                Width="50" Height="50" Background="Transparent" Click="HamburgerButton_Click"/>
        </StackPanel>
    </StackPanel>
    <SplitView Grid.Row="1" x:Name="MySplitView" DisplayMode="Overlay"  IsPaneOpen="False" 
            CompactPaneLength="1" OpenPaneLength="150" VerticalAlignment="Stretch">
        <SplitView.Pane >
            <StackPanel >

            <StackPanel Orientation="Horizontal">
                    <Button x:Name="LogIn" FontFamily="Segoe MDL2 Assets" Content="&#xE825;" Width="50" Height="50" Background="Transparent"/>
                    <TextBlock Text="Log In" FontSize="18" VerticalAlignment="Center" />
             </StackPanel>

                <StackPanel Orientation="Horizontal">
                    <Button x:Name="SignUp" FontFamily="Segoe MDL2 Assets" Content="&#xE10F;" Width="50" Height="50" Background="Transparent"/>
                    <TextBlock Text="Sign Up" FontSize="18" VerticalAlignment="Center" />
                </StackPanel>
            </StackPanel>
        </SplitView.Pane>
        <SplitView.Content>
            <Grid VerticalAlignment="Stretch">
            </Grid>
        </SplitView.Content>
    </SplitView>    
</Grid>

菜单关闭：

菜单打开：

无法拉伸内部StackPanel

3 个答案: