从堆叠面板的中心开始的元素

本文关键字:开始 元素 | 更新日期: 2023-09-27 18:04:52

如何将元素插入到stackpanel中,并且它们开始由中心定位?像这样:

|_ _ _ _ _ _ |

|_ x _ x _ |

|_ x x x _ |

"x"是元素,"_"是空格。

是否已经实现了某些内容?

从堆叠面板的中心开始的元素

你可以用Grid:

来包装你的元素
<Grid Width="720">
  <StackPanel HorizontalAlignment="Center" Orientation="Horizontal" Width="Auto" >
    <!-- elements go here -->
  </StackPanel>
</Grid>

我认为这是最简单的方法。你还需要确保StackPanel的Width="Auto"和Grid的Width="720"(根据需要设置一些固定值)。

HorizontalAlignment设置为Stretch的元素中的元素换行,例如:

<StackPanel>
  <Border HorizontalAlignment="Stretch">
    <TextBlock Text="something short" HorizontalAlignment="Center"/>
  </Border>
  <Border HorizontalAlignment="Stretch">
    <TextBlock Text="something a bit longer" HorizontalAlignment="Center"/>
  </Border>
  <Border HorizontalAlignment="Stretch">
    <TextBlock Text="something more than a bit longer" HorizontalAlignment="Center"/>
  </Border>
</StackPanel>
<StackPanel>
  <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
    <!-- element x -->
  </StackPanel>
  <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
    <!-- element x -->
    <!-- element x -->
  </StackPanel>
  <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
    <!-- element x -->
    <!-- element x -->
    <!-- element x -->
  </StackPanel>
<StackPanel>

生成您所给出的示例。

这取决于你添加到StackPanel的元素,但一般来说要注意以下几点:确保每个元素的HorizontalAlignment设置为Stretch(这样它们就跨越了整个宽度),然后将HorizontalContentAlignment设置为Center