WPF按钮相同/推荐宽度

Question

假设您有一个带有多个按钮的窗口,例如Ok/Cancel或Yes/No/Cancel.所有按钮的宽度必须相同.显然,这可以通过猜测一个数字并将所有数字硬连接到该数字来完成.

有没有更好的方法来做到这一点,一个会考虑首选/推荐的尺寸(Ok按钮应该有多宽？这不是一个修辞问题,我实际上不知道答案!),需要什么通过最长字幕的文字,如果字体大小增加会发生什么？

Answer 1

做这件事有很多种方法:

1)使用网格进行布局.每个Button都有自己的Column,它是星号.这样,所有列的大小都相同:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Button Grid.Column="0">Yes</Button>
    <Button Grid.Column="1">No</Button>
    <Button Grid.Column="2">Cancel</Button>
</Grid>

2)您可以将一个项目作为"主要大小",并将所有其他项目的宽度绑定到此项目的宽度.

<StackPanel Orientation="Horizontal">
    <Button Name="MasterButton" Width="100">Yes</Button>
    <Button>
        <Button.Width>
            <Binding ElementName="MasterButton" Path="Width"/>
        </Button.Width>
        No
    </Button>
</StackPanel>

编辑:在实际代码中,您可能会有Width ="Auto".由于其他宽度基于"主宽度",因此应选择宽度最宽(最宽文本)的按钮.

Answer 2

另一种可能更简单的方法是SharedSizeGroup在ColumnDefinition和RowDefinition类上使用该属性.

WPF网格中的列(和行)可以自动调整大小以适合其内容 - SharedSizeGroup使用时,具有相同组名的列共享其调整大小逻辑.

Xaml看起来像这样......

<Grid Grid.IsSharedSizeScope="True">

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition SharedSizeGroup="Buttons" />
        <ColumnDefinition SharedSizeGroup="Buttons" />
        <ColumnDefinition SharedSizeGroup="Buttons" />
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Button Grid.Column="1"
            HorizontalAlignment="Stretch"
            VerticalAlignment="Center"
            Content="Ok"
            Margin="4" />

    <Button Grid.Column="2"
            HorizontalAlignment="Stretch"
            VerticalAlignment="Center"
            Content="Cancel"
            Margin="4" />

    <Button Grid.Column="3"
            HorizontalAlignment="Stretch"
            VerticalAlignment="Center"
            Content="Long Button Caption"
            Margin="4" />
</Grid>

Answer 3

使用“主”控件，就像丹尼尔的答案一样，但绑定到“ActualWidth”属性而不是“Width”：

<StackPanel Orientation="Horizontal">
    <Button Name="MasterButton">Yes</Button>
    <Button>
        <Button.Width>
            <Binding ElementName="MasterButton" Path="ActualWidth"/>
        </Button.Width>
        No
    </Button>
</StackPanel>

这样，在考虑了最小和最大宽度以及所有其他布局计算之后，该值是在运行时从主控件获取的。绑定到“宽度”会绑定到您在编译时放入属性的任何内容，这可能不是真正使用的宽度。

此外，绑定可以写得更短，例如

<Button Width="{Binding ElementName=MasterButton, Path=ActualWidth}"/>