Question

我的Windows应用商店应用的GridView必须包含分组GridViewItem，这些GridView具有相同的宽度，但可以是任意高度，具体取决于其内容。在每个组中，项目应该从上到下流动，然后，当可用高度用完时，包裹到下一列。整个Grid位于ItemsPanelTemplate行内，其中有一个星（*）高度，我认为它给它一个固定的垂直空间。所以我不明白为什么我在制作物品包装时遇到这么多麻烦，因此流入下一栏。

我一直在尝试GridView.ItemsPanel GroupStyle.Panel和VariableSizedWrapGrid中的各种面板，但我无法达到所需的布局。

除非我误解了Panel的用法，否则在ItemsWrapGrid属性中使用它似乎就像我需要的那样。虽然它给我正确的包装，但它不允许高度变化。也就是说，每个项目的高度都设置为第一个项目的高度。

我与VariableSizedWrapGrid的问题在于它将第一个单元格的高度应用于每个单元格。

我尝试将Orientation的{{1}}属性设置为Horizontal仅用于GridView.ItemsPanel属性（将GroupStyle.Panel保留为默认值）。这允许我需要不同的物品高度。但是这些项目不会流入每个组中的下一列。设置MaximumRowsOrColumns属性没有任何效果，但即使它确实不是我想要的，因为包装应该取决于特定屏幕的高度 - 而不是XAML中设置的任意数字。

我尝试过很多变化而没有成功。这就是XAML现在的样子。

<Grid>
    <Grid.Resources>
        <CollectionViewSource x:Key="subItems" Source="{Binding SubItems}" IsSourceGrouped="True" ItemsPath="SubItems"/>
    </Grid.Resources>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBlock Text="My Subheader" Style="{StaticResource SubheaderTextBlockStyle}" Margin="0,0,7,3"/>
    <GridView Grid.Row="1" ItemsSource="{Binding Source={StaticResource subItems}}" SelectionMode="None" Margin="0,3"
              ItemTemplateSelector="{StaticResource myTemplateSelector}">
        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <VariableSizedWrapGrid Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>
        <GridView.GroupStyle>
            <GroupStyle>
                <GroupStyle.HeaderTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding}"/>
                    </DataTemplate>
                </GroupStyle.HeaderTemplate>
                <GroupStyle.Panel>
                    <ItemsPanelTemplate>
                        <VariableSizedWrapGrid/>
                    </ItemsPanelTemplate>
                </GroupStyle.Panel>
            </GroupStyle>
        </GridView.GroupStyle>
        <ItemsControl.ItemContainerStyle>
            <Style TargetType="GridViewItem">
                <Setter Property="Width" Value="294"/>
                <Setter Property="Margin" Value="0,5"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            </Style>
        </ItemsControl.ItemContainerStyle>
    </GridView>
</Grid>

如何实现具有可变高度但在每组内包裹的分组单元格？

Answer 1

我找到了related question，其中包含已接受的答案，建议使用移植的WrapPanel。在那里使用的WrapPanel的宽度存在问题，但我也发现a proper WrapPanel implementation有效。

分组不同高度的GridViewItems

1 个答案: