11

如何使 Windows 8 ListView 中的 ListItems 水平流动。默认行为是垂直的,但我想以水平流显示列表,以便它可以呈现为全景图。

我尝试了支持水平布局的 GridView,但项目高度有一个限制,它不显示带有大文本的项目的完整项目内容。

4

3 回答 3

47

您可以通过这种方式使用 ListView:

<ListView
    Height="500"
    VerticalAlignment="Center"
    ScrollViewer.HorizontalScrollBarVisibility="Auto"
    ScrollViewer.VerticalScrollBarVisibility="Disabled"
    ScrollViewer.HorizontalScrollMode="Enabled"
    ScrollViewer.VerticalScrollMode="Disabled"
    ScrollViewer.ZoomMode="Disabled"
    SelectionMode="None">
    <ListView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsStackPanel
                Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>

-- 这给了它一个水平面板和用于水平滚动的右侧 ScrollBars。

当您获得较大的项目时,ListView 和 GridView 都可能导致问题。我认为默认情况下,项目可能会根据添加的第一个项目的大小来调整大小。您可以手动设置该大小:

<ListView.ItemContainerStyle>
    <Style
        TargetType="ListViewItem"><!-- note - for GridView you should specify GridViewItem, for ListBox - ListBoxItem, etc. -->
        <Setter
            Property="Height"
            Value="200" /> <!-- this is where you can specify the size of your ListView items -->
        <Setter
            Property="Width"
            Value="350" />
    </Style>
</ListView.ItemContainerStyle>

-- 请注意,所有项目的大小必须相同。

- 另请注意 - 我已更改此答案以将 a 替换StackPanelItemsStackPanel虚拟化,因此它应该为大型数据集提供更好的性能和更低的内存使用量,但- 不要创建具有大型水平滚动列表的布局。在某些非常有限的情况下,它们可能是一个很好的解决方案,但在大多数情况下,它们会破坏许多良好的 UI 模式并使您的应用程序更难使用。

于 2012-07-05T13:49:17.320 回答
5

您还可以使用以下样式封装 Filips 方法:

   <Style TargetType="ListView" x:Key="VerticalListView">
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />

        <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Enabled" />
        <Setter Property="ScrollViewer.VerticalScrollMode" Value="Disabled" />

        <Setter Property="ScrollViewer.ZoomMode" Value="Disabled" />
        <Setter Property="SelectionMode" Value="None" />

        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <StackPanel VerticalAlignment="Top" Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>

        <Setter Property="ItemContainerStyle">
            <Setter.Value>
                <Style TargetType="ListViewItem">
                    <Setter Property="Height" Value="400" />
                </Style>
            </Setter.Value>
        </Setter>
    </Style>

根据需要将其应用于您的 ListViews:

<ListView Style="{StaticResource VerticalListView}" />
于 2014-03-17T13:28:42.277 回答
0

我更喜欢样式方法,但您需要小心修改面板方向。在第一个视觉布局通过之前,不会创建项目控制面板,因此无法修改。如果初始方向与 Xaml 的一行不同,则必须找到一种策略来处理设置初始方向。也许也可以通过样式设置器分配 ItemsPanelTemplate。

于 2014-11-14T21:05:42.337 回答