WrapPanel не переносится в отзывчивом контейнере - PullRequest
Новая
       28

WrapPanel не переносится в отзывчивом контейнере

0 голосов
/ 12 февраля 2020

Проблема

Итак, у меня есть WrapPanel, которая содержит динамический список c карт, который вы можете увидеть здесь. Размер карточек изменяется в зависимости от размера их содержимого (в основном названия), и все карточки имеют одинаковый размер по эстетическим причинам c.

The card List

Я хотел бы иметь возможность добавлять список карточек внутри каждой карточки, отображая несколько ключевых слов, каждое из которых выглядит следующим образом:

A Card with Status

Проблема I Суть в том, что независимо от того, что я делаю, WrapPanel, который содержит мои ключевые слова, всегда заставляет своего родителя расширять свою ширину, вместо того, чтобы переносить содержимое. На самом деле это вполне логично c, так как я не хочу использовать ничего, кроме размеров "Авто" для моих динамических c карт. Но я хотел бы знать, как заблокировать этот комментарий для внутренней WrapPanel, чтобы он не пытался расширяться, а использовал место, которое он уже имел, и Wrap, если требуется.

Я видел много людей просят аналогичные вещи, но никогда не в динамике c Control.

Resources

Это элемент управления, который создает мой список основных карт: 

<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>

This это элемент управления, который создает мой список ключевых слов: 

<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 строк, но вот главное: 

<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>

Ответы [ 3 ]

1 голос
/ 12 февраля 2020

Вы можете привязать ширину панели обертки к фактической ширине одного из ее предков. это даст панели обтекания явную ширину, означающую, что wpf будет ограничивать свои дочерние элементы по желанию. тот факт, что он привязан к данным, просто заставляет панель переноса реагировать на изменения размера, также по желанию. см. также { ссылка }

0 голосов
/ 12 февраля 2020

Невозможно достичь того, что вы хотите сделать с вашим текущим макетом.

Система макетов WPF сначала измеряет дочерние элементы и работает в обратном направлении вверх по визуальному дереву.

Из-за этого ваше ключевое слово WrapPanel измеряется до полной ширины, и в итоге определяется ширина вашей карты.

Одним из решений является установка такой же максимальной ширины для вашей карты * Элемент 1012 *, а также ваше ключевое слово WrapPanel.

Это позволяет вашим картам увеличиваться в размере, но вы устанавливаете разумный верхний предел ширины, который позволит обернуть ваши ключевые слова, когда они достигнут этого. предел.

0 голосов
/ 12 февраля 2020

Установите размер на WrapPanel. Он не будет знать, что оборачивать, если на нем не установлена ​​ширина. Так или иначе, ширина должна быть установлена ​​где-то, чтобы оберточная панель перестала расти. Я думаю, что если вы установите фиксированный размер для внешней сетки, он также будет перенесен.

...