ScrollViewer 捕捉

Question

我有这个 ScrollViewer，在一个 Windows Phone 8 项目中

<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 个图像的一部分，它会自动滚动到最近的图像并显示该图像。 我不希望滚动基本上显示 2 个图像的 2 个一半

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

Answer 1

您不应该为此使用ScrollViwer。如果您需要自定义滚动，您可以自己编写控件，或者如果图像数量较少，您可以重复使用Pivot。

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

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

对于缺少代码，我深表歉意，但我要么在此处发布整个解决方案（这可能需要几个小时），要么我可以提供有关解决方案细节的指针。