WPF容器:元素的宽度相等，但它们之间有间距

本文关键字：之间 元素 容器 WPF | 更新日期: 2023-09-27 18:00:45

我想要一个只有四个按钮的容器。按钮应该水平对齐，宽度相同，不填充所有可用空间，并且它们之间的空间相等。

我不想为按钮设置边距。是否有任何容器和/或其属性的组合，可以帮助我实现这一目标？

我尝试过使用StackPanel、UniformGrid和简单Grid，但都没有成功——要么我得到了巨大的按钮（尽管宽度相等），要么我最终得到了按钮之间的间距，但它们的宽度不同。

WPF容器:元素的宽度相等，但它们之间有间距

对我来说，将ItemsControl与某种面板结合使用似乎是最干净的解决方案。（如前所述，UniformGrid可能是一个不错的选择），例如：

<ItemsControl>
    <ItemsControl.ItemContainerStyle>
        <Style>
            <Setter Property="FrameworkElement.Margin" Value="5"/>
        </Style>
    </ItemsControl.ItemContainerStyle>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Rows="1"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.Items>
        <Button Content="Button"/>
        <Button Content="Button"/>
        <Button Content="Button"/>
        <Button Content="Button"/>
    </ItemsControl.Items>
</ItemsControl>

这样做的优点是，间距布局由项控件处理，而不是手动施加在内容上。此外，内容可以是任何FrameworkElement，并且间距仍然适用。

为UniformGrid:中的所有Button设置边距更容易

<UniformGrid Columns="4" Rows="1">
   <UniformGrid.Resources>
      <Style TargetType="{x:Type Button}">
         <Setter Property="Margin" Value="2"/>
      </Style>
   </UniformGrid.Resources>
   <Button/>
   <Button/>
   <Button/>
   <Button/>
</UniformGrid>

使用UniformGrid，将按钮的"宽度"设置为任意值，并将其"水平对齐/垂直对齐"设置为"中心"。

这将使按钮保持固定大小，并在调整容器大小时更改间距，同时保持按钮之间的间距不变。

相关文章：