带有滑动手势的WP8自定义flipView C#答案

【问题标题】：WP8 custom flipView C# with swipe gesture带有滑动手势的WP8自定义flipView C#
【发布时间】：2014-10-30 19:30:39
【问题描述】：

我为应用程序 WP8 制作了一个简单的自定义翻转视图，效果很好，但我不知道如何在没有箭头的情况下使用滑动手势来更改图像，这是代码（在本主题 @987654321 的答案之后@):

namespace PhoneApp1
{
public partial class FlipView : UserControl
{
    public FlipView()
    {
        InitializeComponent();
        Datasource = new List<object>();
        SelectedIndex = 0;
    }

    private IList Datasource;
    public static readonly DependencyProperty ItemTemplateProperty =
        DependencyProperty.Register("ItemTemplate", typeof(DataTemplate), typeof(FlipView), new   PropertyMetadata(default(DataTemplate)));

    public DataTemplate ItemTemplate
    {
        get { return (DataTemplate)GetValue(ItemTemplateProperty); }
        set
        {
            SetValue(ItemTemplateProperty, value);
            contentPresenter.ContentTemplate = value;
            contentPresenter.Content = SelectedItem;
        }
    }

    public static readonly DependencyProperty ItemsSourceProperty =
       DependencyProperty.Register("ItemsSource", typeof(IList), typeof(FlipView), new PropertyMetadata(default(IList)));

    public IList ItemsSource
    {
        get { return (IList)GetValue(ItemsSourceProperty); }
        set
        {
            SetValue(ItemsSourceProperty, value);
            Datasource = value;
            SelectedIndex = SelectedIndex;
        }
    }

    public static readonly DependencyProperty SelectedIndexProperty =
        DependencyProperty.Register("SelectedIndex", typeof(int), typeof(FlipView), new PropertyMetadata(default(int)));

    public int SelectedIndex
    {
        get { return (int)GetValue(SelectedIndexProperty); }
        set
        {
            SetValue(SelectedIndexProperty, value);

            rightButton.Visibility = leftButton.Visibility = Visibility.Visible;
            if (SelectedIndex == 0)
            {
                leftButton.Visibility = Visibility.Collapsed;
            }

            if (SelectedIndex + 1 == Datasource.Count)
            {
                rightButton.Visibility = Visibility.Collapsed;
                SelectedItem = Datasource[SelectedIndex];
            }

            if (Datasource.Count > SelectedIndex + 1)
            {
                SelectedItem = Datasource[SelectedIndex];
            }
        }
    }

    public static readonly DependencyProperty SelectedItemProperty =
        DependencyProperty.Register("SelectedItem", typeof(object), typeof(FlipView), new PropertyMetadata(default(object)));

    public object SelectedItem
    {
        get { return (object)GetValue(SelectedItemProperty); }
        set
        {
            SetValue(SelectedItemProperty, value);
            contentPresenter.Content = SelectedItem;
        }
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        SelectedIndex--;
    }

    private void Button_Click_1(object sender, RoutedEventArgs e)
    {
        SelectedIndex++;
    }
}
}

为此自定义翻转视图提供滑动手势的最佳做法是什么？（顺便说一句，我是 C# 开发的菜鸟）

【问题讨论】：

标签： c# windows-phone-8 flipview

【解决方案1】：

使用 NuGet 或访问他们的网站 The Windows Phone Toolkit 获取 Windows Pone 工具包。

然后您可以在要检测滑动的控件上使用<toolkit:GestureService.GestureListener>，如下所示：

<Image Source="/Assets/AlignmentGrid.png">
    <toolkit:GestureService.GestureListener>
        <toolkit:GestureListener Flick="OnFlick"></toolkit:GestureListener>
    </toolkit:GestureService.GestureListener>
</Image>

private void OnFlick(object sender, FlickGestureEventArgs e)
{
    double swipe_velocity = 1000;

    // User flicked towards left
    if (e.HorizontalVelocity < -swipe_velocity)
    {
        // Load the next image 
    }

    // User flicked towards right
    if (e.HorizontalVelocity > swipe_velocity)
    {
        // Load the previous image
    }
}

您可以将 swipe_velocity 更改为您喜欢的值。

如果没有工具包，您将不得不使用 XNA 或使用 3 个事件

ManipulationCompleted
ManipulationDelta
ManipulationStarted

计算您的手势。

【讨论】：