Imagine I have two WPF buttons on a window, with content as follows:
假设我在一个窗口上有两个WPF按钮,内容如下:
<Button>OK</Button>
<Button>Cancel</Button>
I want these buttons to be the same width, however in a scenario where the Content
is bound to a localised value for a given user's language, I don't know how wide the buttons need to be to accommodate the new content.
我希望这些按钮具有相同的宽度,但是如果内容被绑定到给定用户语言的本地化值,我不知道按钮需要多大的宽度来容纳新的内容。
How might I apply a minimum width to these buttons, such that the width of the widest one (according to content) is effectively used as the MinWidth
of both, thus keeping them uniform?
如何将最小宽度应用到这些按钮上,使最宽的按钮的宽度(根据内容)有效地用作两者的最小宽度,从而使它们保持一致?
Or to put it another way: I don't want the buttons to be the width of their container (unless using a container in a clever way is the answer to my problem), and I don't want them each to just size to their own content because that will make them different sizes. I want something in-between. The one with the largest content to size to display it's content, and all others to size to that same width, so the widths are all equal.
或者换句话说:我不希望按钮容器的宽度(除非使用一个容器在一个聪明的方式回答我的问题),我不想让他们每个大小自己的内容,因为这将使他们大小不同。我想要中间的。内容大小最大的那个显示它的内容,其他所有的都显示相同的宽度,所以宽度都是相等的。
I expect the answer lies in putting them in some sort of container. I know I could use a Grid
and let them fill grid "cells", but the point is I don't want them to be too wide, either. I know I could have some code-behind that runs on the Content_Changed
event of the buttons and sets the minwidth to that of the widest button, but I'm interested in a pure-xaml method. It might be I need to create a custom control extending ItemsControl
that rusn code-behind when new items are added or re-sized and applies the width of the widest item as the MinWidth
of all the other items.
我希望答案在于把它们放在某种容器中。我知道我可以使用一个网格,让它们填充网格“单元格”,但重点是,我也不希望它们太宽。我知道我可以有一些代码,它运行在按钮的Content_Changed事件上,并将minwidth设置为最宽的按钮,但是我对purexaml方法感兴趣。我可能需要创建一个自定义控件来扩展ItemsControl,以便在添加或重新调整新项目时使用rusn代码,并将最宽项目的宽度作为所有其他项目的最小宽度。
Many thanks in advance.
提前感谢。
2 个解决方案
#1
9
Use UniformGrid
<UniformGrid HorizontalAlignment="Right" Rows="1" Columns="2">
<Button Content="Ok" Grid.Column="0"/>
<Button Content="Cancel" Grid.Column="1"/>
</UniformGrid>
#2
20
The Grid
网格
<Grid HorizontalAlignment="Right" Grid.IsSharedSizeScope="true">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
<ColumnDefinition SharedSizeGroup="A"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<Button Grid.Column="0" Content="OK"/>
<Button Grid.Column="1" Content="Cancel"/>
</Grid.Children>
</Grid>
This can be broken up, you just need to set the IsSharedSizeScope
on a common ancestor, e.g.:
这可以被分解,你只需要设置一个共同祖先的IsSharedSizeScope,例如:
<StackPanel Grid.IsSharedSizeScope="true">
<Grid HorizontalAlignment="Right">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<Button Grid.Column="0" Content="OK"/>
</Grid.Children>
</Grid>
<!-- ... -->
<Grid HorizontalAlignment="Left">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<Button Grid.Column="0" Content="Cancel"/>
</Grid.Children>
</Grid>
</StackPanel>
To prevent the buttons from becoming too large change the HorizontalAlignment
of the Grid to something else than Stretch
or set a MaxWidth
.
为了防止按钮变得过大,可以将网格的水平对齐更改为其他内容,而不是拉伸或设置MaxWidth。
#1
9
Use UniformGrid
<UniformGrid HorizontalAlignment="Right" Rows="1" Columns="2">
<Button Content="Ok" Grid.Column="0"/>
<Button Content="Cancel" Grid.Column="1"/>
</UniformGrid>
#2
20
The Grid
网格
<Grid HorizontalAlignment="Right" Grid.IsSharedSizeScope="true">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
<ColumnDefinition SharedSizeGroup="A"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<Button Grid.Column="0" Content="OK"/>
<Button Grid.Column="1" Content="Cancel"/>
</Grid.Children>
</Grid>
This can be broken up, you just need to set the IsSharedSizeScope
on a common ancestor, e.g.:
这可以被分解,你只需要设置一个共同祖先的IsSharedSizeScope,例如:
<StackPanel Grid.IsSharedSizeScope="true">
<Grid HorizontalAlignment="Right">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<Button Grid.Column="0" Content="OK"/>
</Grid.Children>
</Grid>
<!-- ... -->
<Grid HorizontalAlignment="Left">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<Button Grid.Column="0" Content="Cancel"/>
</Grid.Children>
</Grid>
</StackPanel>
To prevent the buttons from becoming too large change the HorizontalAlignment
of the Grid to something else than Stretch
or set a MaxWidth
.
为了防止按钮变得过大,可以将网格的水平对齐更改为其他内容,而不是拉伸或设置MaxWidth。