76

我有以下代码：

<DockPanel>
    <StackPanel DockPanel.Dock="Top" Orientation="Horizontal">
        <RadioButton Content="_Programs" 
                    IsChecked="{Binding Path=ProgramBanksSelected}" IsEnabled="{Binding Path=ProgramsEnabled}" Margin="8" />
        <StackPanel>
            <Label Content="Master" Height="28" Name="MasterFileStatus" VerticalContentAlignment="Center"/>
        </StackPanel>
    </StackPanel>
    ...

单选按钮应放在堆栈面板的左侧（我删除了一些按钮以免使示例混乱），标签（我暂时放在嵌套的 StackPanel 中）应位于右侧。

我已经尝试了很多对齐组合，但我无法在右侧获得标签。我应该添加什么来实现这一点？

4

5 回答 5

104

只是不要使用StackPanel, StackPanels stack。出于显而易见的原因，它们确实不允许在它们堆叠的方向上对齐。使用Grid, 列定义如下：

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
于 2012-08-27T23:36:35.487 回答
55

即使这是旧的，如果有人像我一样遇到这个，这里有一个简单的解决方案。

制作一个新网格，并在该网格内放置两个具有不同水平对齐方式的堆栈面板。

<Grid>
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
        <!--Code here-->
    </StackPanel>
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
        <!--Code here-->
    </StackPanel>
</Grid>

可能的问题是，现在如果没有额外的处理，两者可能会相互重叠。

于 2017-02-15T23:24:42.620 回答
5

由于您已将StackPanel的方向设置为Horizontal，因此该HorizontalAlignment属性将不适用于子元素。如果您需要额外的控件，您可以保留StackPanel，但我建议切换到Grid（除其他外）来构建您想要的布局。

此外，这Grid将允许您控制每列的​​实际宽度：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="50" />
        <ColumnDefinition Width="150" />
    </Grid.ColumnDefinitions>

    <RadioButton
        Grid.Column="0"
        ...
    />

    <Label
        Grid.Column="1"
        ...
    />
</Grid>

于 2012-08-27T23:36:24.877 回答
5

用户@pasx 是对的。您应该使用 DockPanel 并将 RadioButton 停靠在左侧，将带有标签的 StackPanel 停靠在右侧。

<DockPanel>

    <DockPanel 
        DockPanel.Dock="Top" 
        LastChildFill="False" >

        <RadioButton 
            DockPanel.Dock="Left" 
            Content="_Programs" 
            IsChecked="{Binding Path=ProgramBanksSelected}"
            IsEnabled="{Binding Path=ProgramsEnabled}" 
            Margin="8" />

        <StackPanel
            DockPanel.Dock="Right">

            <Label 
                Content="Master" 
                Height="28" 
                Name="MasterFileStatus" 
                VerticalContentAlignment="Center"/>

        </StackPanel>

    </DockPanel>
    ...
于 2018-02-26T07:48:40.497 回答
1

如示例所示，以嵌套方式使用 Stackpanel 方向类型。网格宽度设置为父宽度以实现全宽度。

<StackPanel x:Name="stackBlah" Orientation="Vertical">
    <StackPanel Orientation="Horizontal">
        <Grid Width="{Binding ActualWidth, ElementName=stackBlah}" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition />
            </Grid.RowDefinitions>

            <StackPanel Grid.Column="0" HorizontalAlignment="Left" >
                <Button Content="Some button" />
            </StackPanel>
            <StackPanel Grid.Column="1" HorizontalAlignment="Right">
                <ToggleSwitch Header="Some toggle" AutomationProperties.Name="ToggleNotifications"/>
            </StackPanel>
        </Grid>
    </StackPanel>
</StackPanel>
于 2021-08-05T14:49:38.960 回答