XAML 通用应用程序：如何制作水平滚动 ListView答案

【问题标题】：XAML Universal App: How to make a horizontal scrolling ListViewXAML 通用应用程序：如何制作水平滚动 ListView
【发布时间】：2015-06-01 14:31:58
【问题描述】：

我无法让水平滚动的 ListView 工作。我已经很接近了，但是有些事情不太对劲。

这是我目前在互联网上搜索后得出的当前 XAML。这些项目是水平显示的，但它的问题是它仍然只想垂直滚动，即使我试图强制水平打开和垂直关闭的所有内容。

有人知道我做错了什么吗？

<ScrollViewer x:Name="scrollWatchlist" Grid.Row="1" Margin="0,5,0,3" DataContext="{Binding MovieViewModel}"
              HorizontalScrollMode="Enabled"
              HorizontalScrollBarVisibility="Visible"
              IsHorizontalRailEnabled="True"

              VerticalScrollMode="Disabled"
              VerticalScrollBarVisibility="Disabled"
              IsVerticalRailEnabled="False"

              IsScrollInertiaEnabled="True">
    <ScrollViewer.Template>
        <ControlTemplate>
            <ListView Margin="0,5,0,3" ItemsSource="{TemplateBinding DataContext}">
                <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal" />
                    </ItemsPanelTemplate>
                </ListView.ItemsPanel>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ListViewItem Margin="0,0,5,0" Tag="{Binding ID}">
                            <Image Source="{Binding FormattedPosterUri}" Width="92" />
                        </ListViewItem>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </ControlTemplate>
    </ScrollViewer.Template>
</ScrollViewer>

更新：对于遇到此问题的任何人来说，这是一个有效的 XAML 示例：

<ListView x:Name="lvwMovieWatchlist" Grid.Row="1" Margin="0,5,0,3" ItemsSource="{Binding MovieViewModel}"
          ScrollViewer.HorizontalScrollMode="Enabled"
          ScrollViewer.HorizontalScrollBarVisibility="Visible"
          ScrollViewer.IsHorizontalRailEnabled="True"
          ScrollViewer.VerticalScrollMode="Disabled">

    <ListView.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>
    <ListView.ItemTemplate>
        <DataTemplate>
            <ListViewItem Margin="0,0,5,0" Tag="{Binding ID}">
                <Image Source="{Binding FormattedPosterUri}" Width="92" />
            </ListViewItem>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

【问题讨论】：

标签： xaml windows-phone-8 win-universal-app

【解决方案1】：

您不需要ScrollViewer，而且您应该在ListView 中获取这些属性

<ListView  Margin="0,5,0,3" ItemsSource="{TemplateBinding DataContext}"ScrollViewer.HorizontalScrollMode="Enabled" ScrollViewer.HorizontalScrollBarVisibility="Visible" ScrollViewer.IsHorizontalRailEnabled="True">

【讨论】：

谢谢。没有意识到 ScrollViewer 属性是可访问的。不过，现在说得通了。
您还需要禁用垂直滚动，否则鼠标滚轮按钮将不起作用。
是的，我也禁用了它（虽然这是一个 WP 8 应用程序，所以我现在不必担心鼠标滚轮）。但是感谢您的提醒。
我最近也需要同样的东西并写了一篇博客：depblog.weblogs.us/2015/03/25/…也许你可以在那里得到一些额外的指点；）

【解决方案2】：

建议使用 GridView 来显示水平滚动的项目。只需在代码中将 ListView 替换为 Gridview 即可。

但是，您可以使用带有水平滚动条的 ListView：

<ListView ScrollViewer.HorizontalScrollBarVisibility="Auto"
          ScrollViewer.HorizontalScrollMode="Enabled"
          ScrollViewer.VerticalScrollMode="Disabled">

【讨论】：

你能发布一个链接，微软或普通民众说它是“推荐”的吗？此外，使用 Grid 不会像 ListView 那样为选择特定项目提供点击动画反馈。我特别想要那个功能。
这是微软认证考试 70-484 开发 Windows 商店应用程序基础知识中的问题之一。这里也提到了它：msdn.microsoft.com/en-us/library/windows/apps/xaml/…，但不是推荐，而是默认行为。关于动画，我不知道你的意思是什么？我得到了完全相同的反馈，但我使用的是 Windows 8...
GridView 和 ListView 之间的重要区别在于选择项目的手势（如果您启用了单击）。 ListView 的选择手势是向左->向右滑动，但如果您有水平滚动查看器，根据设计指南，您应该使用向上->向下滑动，这就是 GridView 所做的。
好吧，也许 GridView 会给出这种行为。我以前从未使用过它（我对 WP8 应用程序完全陌生，这是我的第一个应用程序）。当您在上面说 GridView 时，我什至都没有意识到；完全忽略了我只是在考虑 Grid，因为到目前为止我只使用过 Grid 和 ListView。我将不得不更多地研究 GridView。它实际上可能包含一些我对我正在处理的其他事情感兴趣的行为。谢谢:)
我完全建议您阅读名为考试参考 - 认证名称 - 准备指南的书，例如microsoftpressstore.com/store/…。它们非常适合学习带有大量示例和解释的官方微软建议。您还可以查看考试涵盖的内容：microsoft.com/learning/en-us/exam-70-484.aspx 并找到每个主题的 MSDN 链接。您可以在获得认证的人的博客上找到 msdn 链接列表