如何在Windows 8 Metro中使用C++/XAML实现循环滚动的ScrollViewer

Question

在Windows 8 Metro应用程序中，是否可以创建一个ScrollViewer，在到达视图中的最后一项时，将其循环回第一项？如果可以，如何实现这个效果？

- PZS

Answer 1

肯定是可以的。我正在解决这个问题，完成后会发布工作成果。到目前为止，它大致如下。

这个想法是钩入滚动查看器的viewchanged事件，在移动条时触发。一旦进入，计算偏移量和项目大小的位置，然后您就可以将其与您的listbox容器的实际大小或其他内容进行比较。

一旦您知道了偏移量的位置，以及知道了列表框的实际高度和项目的高度，您就可以知道当前可见的项目和不可见的项目。确保你绑定到对象的列表是实现INotifyChanged接口的可观察集合，并具有双向绑定。然后，您可以定义一组基于滚动位置来回旋转的对象。

另一个选择是尝试不同的起点，也许是一个带有跑马灯和滚动条的单个控件？

XAML

</UserControl.Resources>
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
<ScrollViewer x:Name="ScrollViewer1">
    <ListBox x:Name="SampleListBox" Background="White" ItemsSource="{Binding Path=sampleItems}" ItemTemplate="{StaticResource sampleTemplate}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Grid.Row="0" Grid.RowSpan="2">

    </ListBox>
</ScrollViewer>
</Grid>

代码后台

    public sealed partial class MainPage : Page
{
    List<SampleItem> sampleItems;
    const int numItems = 15;
    public MainPage()
    {
        sampleItems = new List<SampleItem>();
        for (int i = 0; i < numItems; i++)
        {
            sampleItems.Add(new SampleItem(i));
        }
        this.InitializeComponent();
        SampleListBox.ItemsSource = sampleItems;
        ScrollViewer1.ViewChanged += ScrollViewer1_ViewChanged;
    }
    void ScrollViewer1_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
    {
        ScrollViewer viewer = sender as ScrollViewer;
        ListBox box = viewer.Content as ListBox;
        ListBoxItem lbi = box.ItemContainerGenerator.ContainerFromIndex(0) as ListBoxItem;
        double elementSize;
        if (lbi == null)
            return;
        elementSize = lbi.ActualHeight;

    }        /// <summary>
    /// Invoked when this page is about to be displayed in a Frame.
    /// </summary>
    /// <param name="e">Event data that describes how this page was reached.  The Parameter
    /// property is typically used to configure the page.</param>
    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
    }
}

public class SampleItem
{
    public String ItemCount { get; set; }
    public SampleItem(int itemCount)
    {
        ItemCount = itemCount.ToString();
    }
}

- Dev Dave

Answer 2

我不相信在WinRT/XAML中有像那样的控件，所以您需要实现一个自定义控件。有很多方法可以采取，但我可能会避免使用ScrollViewer，并直接处理操作事件，因为将ScrollViewer的行为弯曲到您的要求可能不容易。 我将基于操作事件控制滚动偏移量，并基于滚动偏移量 - 定位视图中的元素 - 例如使用Canvas控件。您需要根据滚动偏移量重新定位项目面板中的元素，以便例如超出视口一端的项目被移到另一端。这将涉及自定义依赖属性、项容器等。如果您熟悉所有这些API，则可能需要至少几个小时的工作。

- Filip Skakun