WPF StackPanel 内容垂直对齐答案

【问题标题】：WPF StackPanel content vertical alignmentWPF StackPanel 内容垂直对齐
【发布时间】：2023-04-29 11:44:02
【问题描述】：

XAML 中是否有办法说我想将水平方向的StackPanel 内的所有组件垂直居中对齐？

我通过以下XAML 达到了预期的结果：

<StackPanel Orientation="Horizontal">
     <TextBlock VerticalAlignment="Center"/>
     <Button VerticalAlignment="Center"/>
     <TextBox VerticalAlignment="Center"/>
     <Button VerticalAlignment="Center"/>
     <TextBlock VerticalAlignment="Center"/>
</StackPanel>

但我需要为每个控件分别重复VerticalAlignment="Center"。

有没有办法在StackPanel 级别上声明如下？

<StackPanel Orientation="Horizontal" VERTICALCONTENTALIGNMENT="Center">
     <TextBlock/>
     <Button/>
     <TextBox/>
     <Button/>
     <TextBlock/>
</StackPanel>

【问题讨论】：

标签： wpf xaml alignment stackpanel

【解决方案1】：

将StackPanel 放入Grid 并在StackPanel 上设置VerticalAlignment="Center"

<Grid>
    <StackPanel VerticalAlignment="Center">
        ...
    </StackPanel
</Grid>

【讨论】：

【解决方案2】：

您可以使用 Trigger 为 StackPanel 定义样式，该样式设置为所有子级的 VerticalAlignment：

<Style x:Key="HorizontalStackPanel" TargetType="{x:Type StackPanel}">
    <Setter Property="Orientation" Value="Horizontal" />
    <Style.Triggers>
        <Trigger Property="Orientation" Value="Horizontal">
            <Setter Property="FrameworkElement.VerticalAlignment"  Value="Center" />
        </Trigger>
    </Style.Triggers>
</Style>

并应用这种风格：

<StackPanel Style="{StaticResource HorizontalStackPanel}">
    <TextBlock />
    <Button />
    <TextBox />
    <Button />
    <TextBlock />
</StackPanel>

它对我有用。整个代码：

<Window x:Class="WpfApplication11.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style x:Key="HorizontalStackPanel" TargetType="{x:Type StackPanel}">
            <Setter Property="Orientation" Value="Horizontal" />
            <Style.Triggers>
                <Trigger Property="Orientation" Value="Horizontal">
                    <Setter Property="FrameworkElement.VerticalAlignment"  Value="Center" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <StackPanel Style="{StaticResource HorizontalStackPanel}">
            <TextBlock Text="One"/>
            <Button Content="Two"/>
            <TextBox Text="Three"/>
            <Button Content="Four"/>
            <TextBlock Text="Five"/>
        </StackPanel>
    </Grid>
</Window>

【讨论】：

@Muds 你在哪里定义了 HorizontalStackPanel 样式？
在资源中，与其他答案似乎完全相同的问题
@Muds Resources 哪个元素？我包含了整个代码。
窗口，而不是任何单个元素
让我们continue this discussion in chat。

【解决方案3】：

定义这样的样式；

<Style x:Key="StackHorizontal" TargetType="StackPanel">
    <Style.Resources>
        <Style TargetType="TextBlock" BasedOn="{StaticResource {x:Type TextBlock}}">
            <Setter Property="VerticalAlignment"  Value="Center" />
        </Style>
        <Style TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
            <Setter Property="VerticalAlignment"  Value="Center" />
        </Style>
    </Style.Resources>
</Style>

【讨论】：

【解决方案4】：

就用这个吧：

<StackPanel Orientation="Horizontal" VerticalAlignment="Center">
     <TextBlock/>
     <Button/>
     <TextBox/>
     <Button/>
     <TextBlock/>
</StackPanel>

【讨论】：