How can I have a gridview work horizontally in UWP?

问题

I have a Gridview where I want items to be grouped and flow horizontally. The groups are still vertically scrolling. How can I fix this?

回答1:

The ItemsPanelTemplate is the one that determines the layout of items. Usually an ItemsWrapGrid is used for a GridView. That control has a property called MaximumRowsOrColumns. Set that to the number of rows you want as a max on a page. The data is then always in a horizontal layout. You can add something like this:

        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsWrapGrid MaximumRowsOrColumns="3"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>

回答2:

The groups are still vertically scrolling. How can I fix this?

I think you have done the "group-items" part work. So your problem is how to make the grouped items lay horizontal and make the GridView can horizontally scroll. To do this, you can set the ItemsWrapGrid of the GridView to vertical Orientation, for example like this:

<GridView ItemsSource="{Binding Source={StaticResource cvs}}" ScrollViewer.HorizontalScrollBarVisibility="Visible"
          ScrollViewer.HorizontalScrollMode="Enabled">
    <GridView.GroupStyle>
        <GroupStyle>
            <GroupStyle.HeaderTemplate>
                <DataTemplate>
                    <TextBlock x:Name="Header" FontSize="15" FontWeight="Bold" Text="{Binding Key}" />
                </DataTemplate>
            </GroupStyle.HeaderTemplate>
        </GroupStyle>
    </GridView.GroupStyle>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid Orientation="Vertical" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

来源：https://stackoverflow.com/questions/37955753/how-can-i-have-a-gridview-work-horizontally-in-uwp

标签

gridview

uwp