Horizontal swipe gesture on UWP

Question

is there any way to get swipe gesture same as windows phone 8 with wptoolkit. Because wptoolkit nuget package is not available for uwp, so i am unable to get similar swipe gesture on UWP In windows Phone 8 with the help of WPtoolkit nugetget package i placed this

<toolkit:GestureService.GestureListener>
         <toolkit:GestureListener Flick="OnSwipe"/>
</toolkit:GestureService.GestureListener>

over text block, so i can swipe left to right or right to left over textbox1. and swipe gesture help me to implement this

private static int i;
private void OnSwipe(object sender, FlickGestureEventArgs e)
    {
        if (e.HorizontalVelocity < 0)
        {
              i++;
              txtBox1.Text = i.ToString();             
        }

        if (e.HorizontalVelocity > 0)
        {
             i--;
             txtBox1.Text = i.ToString();
        }
    }

i tried Manupulation method with scrollViewer on uwp but it continuously increase the value untill it scroll viewer stopped

and this is codes

    private static int i;
    private Point initialpoint;
    private void scrollview_ManipulationStarted(object sender, ManipulationStartedRoutedEventArgs e)
    {
        initialpoint = e.Position;
    }

    private void scrollview_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
    {
        if (e.IsInertial)
        {
            Point currentpoint = e.Position;
            if (currentpoint.X - initialpoint.X >= 2)
            {
                i++;
                txtBox1.Text = i.ToString();
            }

            if (currentpoint.Y - initialpoint.Y >= 2)
            {
                i--;
                txtBox1.Text = i.ToString();
            }
        }
    }

Any other way to implement same functionality.

Justin XL Justin XL · Accepted Answer · 2017-08-07T21:33:29

Actually you don't need to handle ManipulationStarted in this case and you don't need the initialPoint property. Assuming you have already defined your ScrollViewer's ManipulationMode to the following

ManipulationMode="TranslateX,TranslateInertia,System"

Then you simply use e.Cumulative.Translation.X to tell how long you have swiped in total

private void scrollview_ManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
{
    if (e.IsInertial)
    {
        var swipedDistance = e.Cumulative.Translation.X;

        if (Math.Abs(swipedDistance) <= 2) return;

        if (swipedDistance > 0)
        {
            i++;
        }
        else
        {
            i--;
        }

        txtBox1.Text = i.ToString();
    }
}

Update

Now that I understand your question better, I think you should handle gesture manipulation on the TextBox itself. If you want instant feedback, simply subscribe to the ManipulationDelta event and create a flag to only run the swipe logic once per touch.

private bool _isSwiped;
private void txtBox1_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
    if (e.IsInertial && !_isSwiped)
    {
        var swipedDistance = e.Cumulative.Translation.X;

        if (Math.Abs(swipedDistance) <= 2) return;

        if (swipedDistance > 0)
        {
            i++;
        }
        else
        {
            i--;
        }

        txtBox1.Text = i.ToString();

        _isSwiped = true;
    }
}

private void txtBox1_ManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
{
    _isSwiped = false;
}

Make sure you move all the handlers and set the ManipulationMode onto the TextBox.

<TextBox x:Name="txtBox1"
         ManipulationMode="TranslateX,TranslateInertia,System" 
         ManipulationDelta="txtBox1_ManipulationDelta" 
         ManipulationCompleted="txtBox1_ManipulationCompleted" />

Horizontal swipe gesture on UWP

1 Answers

Update