使用 maxwidth 和右对齐父级使 ComboBox 拉伸到可用空间

发布于 2024-10-17 10:57:30 字数 889 浏览 2 评论 0原文

我在实现我想要的布局时遇到问题。这是我的代码：

<DockPanel DockPanel.Dock="Bottom" HorizontalAlignment="Right" LastChildFill="True">
                <Label DockPanel.Dock="Left" Content="Add new:"/>
                <Button DockPanel.Dock="Right" Content="Add" VerticalAlignment="Center"/>
                <ComboBox VerticalAlignment="Center" MaxWidth="150" HorizontalAlignment="Stretch">
                    <System:String>Item1</System:String>
                    <System:String>Item2</System:String>
                    <System:String>Item3</System:String>
                </ComboBox>
            </DockPanel>

我想要的是将三个元素按标签、组合框、按钮的顺序向右对齐。标签和按钮应占用需要尽可能多的空间，但我希望 ComboBox 占用可能尽可能多的空间，最多 150 像素。当 DockPanel 未设置为 HorizontalAlignment=Right 时，它会起作用。

有什么提示/解决方案吗？

谢谢。

原文

I'm having a problem achieving the layout i want.
This is my code:

<DockPanel DockPanel.Dock="Bottom" HorizontalAlignment="Right" LastChildFill="True">
                <Label DockPanel.Dock="Left" Content="Add new:"/>
                <Button DockPanel.Dock="Right" Content="Add" VerticalAlignment="Center"/>
                <ComboBox VerticalAlignment="Center" MaxWidth="150" HorizontalAlignment="Stretch">
                    <System:String>Item1</System:String>
                    <System:String>Item2</System:String>
                    <System:String>Item3</System:String>
                </ComboBox>
            </DockPanel>

What I want is to have the three elements aligned to the right, in the order Label, ComboBox, Button. The Label and the button should take as much space as needed, but I want the ComboBox to take as much space as possible up to 150 px.
It kind of works when the DockPanel is not set to HorizontalAlignment=Right.

Any tips/solutions?

Thanks.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

风筝在阴天搁浅。 2024-10-24 10:57:30

使用 RightToLeft 设置，如下所示：

<Grid x:Name="LayoutRoot">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition></RowDefinition>
    </Grid.RowDefinitions>
    <Grid FlowDirection="RightToLeft">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
            <ColumnDefinition MaxWidth="150"></ColumnDefinition>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>
            <Label FlowDirection="LeftToRight" Grid.Column="2" Content="Add new:"/>
            <ComboBox FlowDirection="LeftToRight" Grid.Column="1" VerticalAlignment="Center" MaxWidth="150" HorizontalAlignment="Stretch">
                <ComboBoxItem>Test</ComboBoxItem>
                <ComboBoxItem>Test</ComboBoxItem>
                <ComboBoxItem>Test</ComboBoxItem>
           </ComboBox>
         <Button FlowDirection="LeftToRight"  Grid.Column="0" DockPanel.Dock="Right" Content="Add" VerticalAlignment="Center"/>
     </Grid>
</Grid>

这是正在运行的：

Narrow

Use the RightToLeft setting, like this:

<Grid x:Name="LayoutRoot">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition></RowDefinition>
    </Grid.RowDefinitions>
    <Grid FlowDirection="RightToLeft">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
            <ColumnDefinition MaxWidth="150"></ColumnDefinition>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>
            <Label FlowDirection="LeftToRight" Grid.Column="2" Content="Add new:"/>
            <ComboBox FlowDirection="LeftToRight" Grid.Column="1" VerticalAlignment="Center" MaxWidth="150" HorizontalAlignment="Stretch">
                <ComboBoxItem>Test</ComboBoxItem>
                <ComboBoxItem>Test</ComboBoxItem>
                <ComboBoxItem>Test</ComboBoxItem>
           </ComboBox>
         <Button FlowDirection="LeftToRight"  Grid.Column="0" DockPanel.Dock="Right" Content="Add" VerticalAlignment="Center"/>
     </Grid>
</Grid>

Here is is running:

Narrow

Wide