无法拉伸内部 StackPanel

Question

使用下面的设置，我可以将 window 的整个宽度着色为紫色。内部堆栈面板是黄绿色的，并向左移动。

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

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

根据帖子，我发现是实现它的方法（而且它肯定适用于外部控件）。我可以缺少什么？我已经删除了在外部面板中声明的其他控件（即 chartreusily 颜色控件的所有兄弟控件），没有任何区别。

Answer 1

过去我花了很多时间与堆栈面板作斗争。

事情是这样的：您的外部堆叠面板 (#1) 具有水平方向，这意味着它可以根据需要填充尽可能多的 child，水平堆叠它们。每当呈现 child 时，child 和 parent 之间就会出现一个对话框：

--(Child) 我要渲染，我有这个尺寸。你能提供足够的给我吗space?

--(Parent) 我会计算一下，看看结果如何。

在嵌套堆栈面板的情况下，您的外部堆栈面板会尝试拉伸并要求无限宽度，而它的 parent 网格恰好为他提供了他拥有的所有宽度。但是 stackpanel 的目的是在一个方向上是无限的，如果它 child 要求无限宽度（内部 stackpanel 做什么，当你将水平对齐设置为拉伸时）那么我们只给他最小宽度，否则它们会失去控制并耗尽您 PC 上的所有内存。

所以这只是对发生的事情的艺术看法，可能不准确。

更新：

简单地说：您不能将水平对齐设置为水平方向的堆叠面板的 child 拉伸，也不能将垂直对齐设置为堆叠面板的 child 拉伸垂直方向。好吧，你可以，但它不会伸展，因为如果它可以，那么它就会无限伸展

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

Answer 2

A StackPanel 将根据需要为其内容提供尽可能多的 space，但也只提供必要的内容。

如果你想完全填充 window 的宽度，只需将外部 StackPanel 替换为 Grid

如果你想让 StackPanel 至少填满整个，你可以将 MinWidth 绑定到它的父级 ActualWidth:

<StackPanel HorizontalAlignment="Stretch"
    Name="parent"
    Orientation="Horizontal"
    Background="BlueViolet"
    Height="70">

    <StackPanel HorizontalAlignment="Stretch"
        MinWidth="{Binding Path=ActualWidth, ElementName=parent}"
        Orientation="Horizontal"
        Background="Chartreuse" >
    </StackPanel>
</StackPanel>

Answer 3

我也为此苦苦挣扎并提供了这个解决方案，以防其他人正在寻找类似的解决方案。

我的特殊问题是我需要将汉堡包菜单置于顶部并从 SplitView 中移出。然后我试图让堆栈面板填满下面的整个区域。这很好用，下面的屏幕截图显示了它的样子。

希望这对您有所帮助，如果这不是最佳做法，我们很高兴得到纠正。

<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

Not able to stretch an inner StackPanel

c#

xaml

panel

alignment