如何使StackPanel根据所放置控件的大小自动调整大小？

Question

我正在制作一个工具栏，希望窗口的宽度等于所有按钮的总宽度。 StackPanel 似乎非常适合这项工作，因为它可以将所有内容对齐，但是它不能自动拉伸。

  <Window Width="auto">
     <StackPanel Orientation="Horizontal" Width="auto">
        <Button />
        <Button />
     </StackPanel>
  </Window>

我该如何让这个工作起来？

- Alan Baljeu

Answer 1

我找到了一个非常简单的解决方案！几乎所有人（我已经搜索了很多页面）都建议切换控件类型或其他更复杂的操作，但实际上，它要简单得多：

<Window         SizeToContent="Width"

这是唯一需要的更改。

此段代码来源：https://dev59.com/cnI-5IYBdhLWcg3wpqIK#2317914，是该问题排名第二的答案，我认为这个答案更好。

- Alan Baljeu

---

然而，这个回复并没有触及到你的痛处 :) - StepUp

谁说要拉伸按钮了？我希望容器能够自动调整大小。 - Alan Baljeu

Answer 2

你可以使用UniformGrid代替StackPanel，使窗口的宽度等于按钮的总宽度。

<UniformGrid Margin="10" Rows="1" HorizontalAlignment="Right"
            VerticalAlignment="Bottom">
    <Button Grid.Column="0" Content="No" FontSize="18" Margin="5" Padding="6,3"/>
    <Button Grid.Column="1" Content="Yes, Absolutely" Margin="5" Padding="6,3"/>
    <Button Grid.Column="2" Content="Maybe" Margin="5" Padding="6,3"/>
</UniformGrid>

UniformGrid提供了相同高度和宽度的每个单元格。这正是您想要的，因为您可以避免手动设置按钮大小。

更新：

我建议不要使用Stackpanel。即使您使Stackpanel填充其父级，其子级仍然会"stacks"，而不会填充Stackpanel。

- StepUp

---

重新编辑：我不是想让StackPanel填充父级容器。我是想让父级容器随着StackPanel的大小而自动调整大小。 - Alan Baljeu

@AlanBaljeu，你找到它了吗？ - StepUp

Answer 3

根据您的设置，您可以使用StackPanel的对齐方式轻松实现。例如，此XAML：

<Window Width="350" Height="350" ...> 
    <Grid>
        <StackPanel
            Background="Green">
            <Border
                Width="100"
                Height="100"
                Background="Blue" />
            <Border
                Width="100"
                Height="100"
                Background="Red" />
        </StackPanel>
    </Grid>
</Window>

将创建这个（面板会拉伸到父级的大小）：

而且这个面板：

<Window Width="350" Height="350" ...> 
    <Grid>
        <StackPanel
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            Background="Green">
            <Border
                Width="100"
                Height="100"
                Background="Blue" />
            <Border
                Width="100"
                Height="100"
                Background="Red" />
        </StackPanel>
    </Grid>
</Window>

将创建此内容（尺寸调整为两个包含的边框）：

- Simon Mourier

Answer 4

请使用带有列的网格。

<Grid HorizontalAlignment="Stretch">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Button />
    <Button Grid.Column="1" />
    <Button Grid.Column="2" />
    <Button Grid.Column="3" />
</Grid>

- Jonathan LEI

---

我不喜欢表格，因为我必须输入所有这些列定义。如果我添加更多的控件，我需要更新所有的列数。在我看来，当你有一个带有多行控件的矩形时，表格是有用的。单行似乎没有意义。 - Alan Baljeu