WrapPanel不包装在响应容器中

Question

问题

因此，我有一个WrapPanel，其中包含卡片的动态列表，如您在此处看到的。这些卡片会根据其内容的大小（基本上是名称）而改变大小，出于美观原因，所有卡片的大小都相同。

我希望能够在每张卡中添加一张卡列表，每张卡都显示一些这样的关键字。

我面临的问题是，无论我做什么，包含我的关键字的WrapPanel都将始终使其父级扩展其Width，而不是包装其内容。实际上，这很合乎逻辑，因为我不想为动态卡使用“自动”大小以外的任何东西。但是我想知道如何阻止内部WrapPanel的这种配合，以便它不会尝试扩展，而是使用他已经拥有的位置并在需要时使用Wrap。

我见过很多人要求类似的东西，但从来没有在动态控件中提出过。

资源

这是创建我的主卡列表的控件：

<ItemsControl x:Name="FightersControl" Grid.IsSharedSizeScope="True">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition SharedSizeGroup="ColumnSize" />
                </Grid.ColumnDefinitions>
                <fight:FightingCharacterTileUserControl
                        Grid.Column="0" Grid.Row="0"
                        Margin="10"/>
            </Grid>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel  />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

这是创建我的关键字列表的控件：

<ItemsControl 
    ScrollViewer.HorizontalScrollBarVisibility="Disabled"
    ItemsSource="{Binding CustomVerboseStatusList.List}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <local:CustomVerboseStatusTile
                Margin="5"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel 
                Orientation="Horizontal"
            />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

由于大约120行，我不会发布完整的Card Control，但这是主要的内容：

<Grid
    Margin="10, 0">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    ...

    <CustomStatusTile
        Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2"
    />
</Grid>

Answer 1

将大小设置为WrapPanel。除非已设置宽度，否则它将不知道要包装什么。这种方式或其他方式必须在某处设置宽度，以便包裹面板停止生长。我认为，如果将外部网格设置为固定大小，它也会自动换行。

Answer 2

无法实现当前布局所需的功能。

WPF布局系统首先对孩子进行测量，然后向后往可视树工作。

因此，您的关键字WrapPanel被测到其完整宽度，最终确定了卡片的宽度。

一种解决方案是为卡的根元素以及关键字WrapPanel设置相同的MaxWidth。

这可以使卡的尺寸增加，但是您可以为宽度设置一个合理的上限，这样当关键字达到该上限时，它们就可以自动换行。

Answer 3

您可以将环绕面板的宽度绑定到其祖先的实际宽度之一。这将使环绕面板具有明确的宽度，这意味着wpf将根据需要约束其子级。它是数据绑定的事实，这使得包装板也可以根据需要对尺寸变化做出响应。另请参阅https://stackoverflow.com/a/1627811/4868864