GridView Orientation with Wrapping in WinRT

问题:

I am developing a WinRT app in c# , I am using a GridView to present my item.

I want my items to be arranged Horizontally and then(when reached the max width) next items should be added to the new row(Simply: only vertical scroll-bars can be visible).

Unfortunately my current xaml can only add items horizontal in one row(with a horizontal scroll bar)

<GridView x:Name="GridChildItem" 
                  ItemContainerStyle="{StaticResource NonTickGridViewItem}" 
                  VerticalContentAlignment="Stretch" 
                  ItemTemplate="{StaticResource CustomChildItemTemplete}"
                  SelectionMode="Single" 
                  IsItemClickEnabled="True" 
                  ItemClick="gridViewChild_ItemClick_1"
                  Margin="0,40,0,0" 
                  Height="Auto"
                  Background="{StaticResource DropDownMenuBackColor}" 
                  ScrollViewer.IsHorizontalScrollChainingEnabled="False"
                  ScrollViewer.IsVerticalScrollChainingEnabled ="True"
                  VerticalAlignment="Top">
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal" Margin="20,0,0,0" />
                </ItemsPanelTemplate>

           </GridView.ItemsPanel>
 </GridView>

回答1:

If you don't want to allow horizontal scrolling you need to use ListView instead of GridView,

From MSDN:

Use a ListView to display a collection of data that scrolls vertically. To display a collection that scrolls horizontally, use a GridView.

But if you want to keep the wrapping behavior you need to use WrapGrid as the ItemsPanel:

<ListView>
     <ListView.ItemsPanel>
          <ItemsPanelTemplate>
                <WrapGrid Orientation="Horizontal" />
           </ItemsPanelTemplate>
     </ListView.ItemsPanel>
</ListView>

回答2:

The default ItemsPanelTemplate of a GridView contains a WrapGrid with Orientation="Vertical": it stacks vertical and scrolls horizontal.

If you change the Orientation to Horizontal, it will stack horizontal, but for some reason won't scroll. You can solve that by setting ScrollViewer.VerticalScrollMode="Enabled" on the GridView (not on the WrapGrid!).

Example:

<GridView ScrollViewer.VerticalScrollMode="Enabled">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapGrid Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>