ScrollViewer捕捉

Question

我在一个Windows phone8项目中有这个ScrollViewer

<ScrollViewer Name="MediaScroll" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto" Background="#7FD13E3E" Tap="ScrollViewer_Tap" VerticalAlignment="Top" LayoutUpdated="MediaScroll_LayoutUpdated">
            <ItemsControl ItemTemplate="{StaticResource ItemTemplate2}" ItemsPanel="{StaticResource ItemsPanelTemplate1}" ItemsSource="{Binding listaMedia}">

            </ItemsControl>
        </ScrollViewer>

使用这些模板的

    <phone:PhoneApplicationPage.Resources>

    <ItemsPanelTemplate x:Key="ItemsPanelTemplate1">
        <StackPanel Orientation="Horizontal" Margin="0,0,0,0"/>
    </ItemsPanelTemplate>

    <DataTemplate x:Key="ItemTemplate2">

        <StackPanel Width="480">
            <Image Source="/Assets/play@2x.png" Width="75" Canvas.ZIndex="10" Margin="203,85,202,0"  />
            <Image Source="{Binding snapshot.path}" Stretch="Fill" VerticalAlignment="Top" Margin="0,-160,0,0" />
        </StackPanel>
        <!--<Image Tag="{Binding id}"  Source="{Binding snapshot.path}" Width="150" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="-10,0,-9,0" Tap="Image_Tap" />-->
        <!--Your other code-->
    </DataTemplate>

</phone:PhoneApplicationPage.Resources>

我得到了一个带有图像的列表，滚动条水平地显示它们。当我滚动时，我希望ScrollViewer捕捉到最近的图像，这意味着如果滚动显示的是两个图像的一部分，它会自动滚动到最近的图像并显示那个图像。我不想让卷轴显示2个图像的一半

我不确定是否可以通过LayoutUpdated事件做到这一点。

Answer 1

你不应该使用ScrollViwer来做这件事。如果您需要自定义滚动，您可以自己编写控件，或者如果图像数量较少，则可以重用Pivot。

因此，您需要创建自己的用户控件并覆盖操作*事件。当用户拖动图像时，您可以使用RenderTransform更新其翻译。当用户释放拖拽时，您可以检测图像是否已移动到中间位置。在这种情况下，您可以手动设置下一个图像的动画。

为此，您需要自定义图像加载代码，自定义动画主要是在代码中构建的。如果用户在动画中再次开始拖动，不要忘记取消现有的动画。

我为缺少代码道歉，但我会在这里发布整个解决方案(这可能需要几个小时)，或者我可以给出关于解决方案细节的指针。