WrapPanel:试图使ItemWidth等于任何元素的最大宽度

本文关键字：元素 于任何 ItemWidth WrapPanel | 更新日期: 2023-09-27 18:02:08

希望没有其他人已经问过这个问题，但是我已经搜索过了，没有找到任何提及。如果我错过了解释这个问题的其他问题，请随时为我指出正确的方向。

我有一个带有数据绑定项的WrapPanel，本质上包含一个图标和一些可变长度的文本(这是一个图表的图例)。我非常喜欢这样一个事实，即当我将ItemWidth设置为某个设定值时，项目显示在整齐的列中。然而，由于每个条目的文本长度变化很大，我不能轻易地选择一个适用于所有情况的特定值。也就是说，在某些情况下，所有条目的文本可能都很短，因此ItemWidth的值较小是合适的。但是在其他时候，这样小的ItemWidth会导致一些条目的文本被截断。

我想我可以以某种方式将ItemWidth数据绑定到WrapPanel的子元素，以便提取每个项目的宽度(并找到最大宽度，并将其用作ItemWidth等)，但我对这样做很谨慎，因为数据绑定到错误的东西的可能性。例如，当ItemWidth改变时，绑定到的东西也会改变，从而导致无限循环(或者至少，循环重复的次数多于必要的次数)。

什么是最好的方法来设置这个，以便ItemWidth是只大，因为它需要是为了防止截断?

编辑:

我想保留WrapPanel提供的功能，允许有可变数量的列项，这取决于WrapPanel本身允许的空间。

WrapPanel:试图使ItemWidth等于任何元素的最大宽度

你可以在Grid中包装每个项目，并使用Grid的ShareSizeScope属性来确保所有项目共享相同的宽度。

例如，在WrapPanel中，你可以将Grid.IsSharedSizeScope设置为true

<WrapPanel Grid.IsSharedSizeScope="True">

然后您将每个项目包装在单个单元格Grid中，使用SharedSizeGroup属性告诉它们它们都共享一个大小

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition SharedSizeGroup="SharedGroup" />
    </Grid.ColumnDefinitions>
    <ContentPresenter />
</Grid>

如果你想要一个例子，一个快速的谷歌搜索给了我这个答案，其中包含一个代码示例。

如果你有大量的数据集，我建议你也进行性能测试。

尝试以下操作。需要注意的部分是网格。IsSharedSizeScope="True"在换行面板和列定义的SharedSizeGroup属性。

<Window x:Class="WpfApplication1.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">
    <Grid>
        <WrapPanel Grid.IsSharedSizeScope="True">
            <WrapPanel.Resources>
                <Style TargetType="TextBlock">
                    <Setter Property="Padding" Value="2" />
                    <Setter Property="HorizontalAlignment" Value="Center" />
                </Style>
            </WrapPanel.Resources>
            <WrapPanel.Children>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="1234567890" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="1234567890" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="1234567890" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="1234567890" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="1234567890" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="1234567890" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="abcdefghijklmnopqrstuvwxyz" />
                </Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="group1" />
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="1234567890" />
                </Grid>
            </WrapPanel.Children>
        </WrapPanel>
    </Grid>
</Window>

尝试将itemwidth属性设置为Auto…在这里看到的:

http://msdn.microsoft.com/en-us/library/system.windows.controls.wrappanel.itemwidth (v = vs.110) . aspx

要以编程方式执行这个"宽度设置"，您可以在呈现控件后执行以下操作。

protected override void OnRender(DrawingContext dc)
{
int largest = 0;
foreach(UIElement child in this.myWrapPanel.Children)
{
    if(child.Width>largest)
        largest = child.Width;
}
this.myWrapPanel.ItemWidth = largest;

}
相关文章：