网格视图横向滚动（UWP）

Question

我正在开发一个UWP应用程序，希望我的GridView可以水平滚动，而不是默认的垂直模式。有没有方法可以实现？

这是我的代码:

<GridView x:Name="HostListView" Grid.Row="2" Height="150" Margin="310,0,0,0"
                  ItemsSource="{Binding FilteredHosts}" SelectedItem="{Binding SelectedHost, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
                  SelectionChanged="HostListView_SelectionChanged" IsSwipeEnabled="False">
    <GridView.ItemTemplate>
        <DataTemplate >
            <StackPanel Margin="8" Width="220">
                <TextBlock Text="{Binding Name}" Style="{StaticResource TitleTextBlockStyle}"
                           FontSize="15" TextWrapping="NoWrap" 
                           MaxHeight="40" Foreground="White"/>
                <TextBlock Text="{Binding Designation}" Style="{StaticResource CaptionTextBlockStyle}" 
                           TextWrapping="NoWrap" Foreground="White"/>
            </StackPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

- thalassophile

---

你想要多少行？单行还是多行？ - Vijay Nirmal

Answer 1

这很简单，只需告诉GridView使用水平滚动条而不是垂直滚动条。这将启用水平滚动部分。

下一步最可能要确保项目按正确顺序排列，因为您不希望第4项在屏幕外，而第20项在第二行中可见，因此它们必须垂直堆叠。您可以通过更改ItemsWrapGrid的Orientation属性来实现这一点。

<GridView ...
          ScrollViewer.HorizontalScrollBarVisibility="Auto"
          ScrollViewer.HorizontalScrollMode="Auto"
          ScrollViewer.VerticalScrollBarVisibility="Disabled"
          ScrollViewer.VerticalScrollMode="Disabled">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid Orientation="Vertical" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
    <GridView.ItemTemplate>
        ...
    </GridView.ItemTemplate>
</GridView>

更多信息可以在我的SemanticZoom博客文章中找到，我也将其改为了水平滚动。

- Bart