在 VariableSizedWrapGrid 中水平包装项目

Question

我有一个包含 VariableSizedWrapGrid 的 GridView，像这样...

    <local:MyGridview    
        Padding="116,0,0,0"        
        x:Name="itemGridView"
        AutomationProperties.AutomationId="ItemGridView"
        AutomationProperties.Name="Grouped Items"
        Grid.Column="1"
        Grid.Row="1"
        SelectionMode="None"
        ItemTemplateSelector="{StaticResource templateSelector}"
        ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}" 
        IsItemClickEnabled="True"
        ItemClick="itemGridView_ItemClick">

        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel Orientation="Horizontal" Margin="0"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>

        <GridView.GroupStyle>
            <GroupStyle>
                <GroupStyle.HeaderTemplate>
                    <DataTemplate>
                        <Grid>
                            <TextBlock Text="{Binding Key}" Margin="3,-7,10,10" Style="{StaticResource GroupHeaderTextStyle}" />
                        </Grid>
                    </DataTemplate>
                </GroupStyle.HeaderTemplate>
                <GroupStyle.Panel>
                    <ItemsPanelTemplate>
                        <VariableSizedWrapGrid Orientation="Vertical" ItemWidth="1" ItemHeight="1" Margin="0,3,40,0" />
                    </ItemsPanelTemplate>
                </GroupStyle.Panel>
            </GroupStyle>
        </GridView.GroupStyle>

    </local:MyGridview>

显示这样的项目...

我想让它水平而不是垂直堆叠项目，以便橙色瓷砖位于蓝色瓷砖旁边而不是在它下方

我尝试将 VariableSizedWrapGrid 的方向更改为水平，但发生这种情况....

我做的事情真的很傻吗？

Answer 1

为什么将 ItemWidth 和 ItemHeight 设置为 1？您是否从代码中设置了正确的 ColumnSpan 和 RowSpan 值？我建议您将 ItemWidth 和 ItemHeight 设置为更大的值，也许设置为最小项目的大小。 VariableSizedWrapGrid 布局算法并不完美，在我的示例中，有时它会根据需要水平放置小项目，有时 - 不是（我根本没有设置 VariableSizedWrapGrid 方向）。