ListView Scrolling does not work when Manipulation events wired into ListviewItem - WP8.1

Question

I have wired Manipulation events with the listviewitem to capture left swipe and right swipe. But when I try to scroll down the listview, it does not work! The manipulation events get fired and the listview does not scroll!

This is the listview Datatemplate

    <Grid Height="60" Width="380" Margin="0,0,0,1">
        <Grid x:Name="ItemGrid" HorizontalAlignment="Left" VerticalAlignment="Center" Width="380" Height="60" Background="Orange" Canvas.ZIndex="2"
                                      ManipulationMode="TranslateX" ManipulationStarted="On_ChannelItem_ManipulationStarted" ManipulationDelta="On_ChannelItem_ManipulationDelta" ManipulationCompleted="OnChannelItemManipulationCompleted">
            <TextBlock x:Name="titleTextBlock" Margin="20,0,0,0" Canvas.ZIndex="2" VerticalAlignment="Center" TextAlignment="Left" FontSize="25" >
            </TextBlock>
        </Grid>
        <Grid x:Name="DelGrid" Opacity="0.0" HorizontalAlignment="Right" VerticalAlignment="Center" Height="60" Background="Red" Canvas.ZIndex="-1" Tapped="On_ChannelDelete_Tap" Width="380">
            <Button Content="X" FontSize="25" Canvas.ZIndex="-1" VerticalAlignment="Center" HorizontalAlignment="Center" Width="380" BorderThickness="0" />
        </Grid>
    </Grid>

This is the manipulation events

    private void OnChannelItemManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
    {
        Grid ChannelGrid = (Grid)sender;
        Grid DeleteGrid = (Grid)((Grid)(ChannelGrid.Parent)).Children[1];

        double dist = e.Cumulative.Translation.X;
        if (dist < -100) // Swipe left
        {                
            Storyboard SwipeLeft = new Storyboard();

            DoubleAnimation OpacityAnimation = new DoubleAnimation();
            OpacityAnimation.EnableDependentAnimation = true;
            OpacityAnimation.From = 0.0;
            OpacityAnimation.To = 1.0;
            OpacityAnimation.BeginTime = TimeSpan.FromMilliseconds(0);
            OpacityAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(1));
            Storyboard.SetTarget(OpacityAnimation, DeleteGrid);
            Storyboard.SetTargetProperty(OpacityAnimation, "Opacity");
            SwipeLeft.Children.Add(OpacityAnimation);

            DoubleAnimation WidthAnimation = new DoubleAnimation();
            WidthAnimation.EnableDependentAnimation = true;
            WidthAnimation.From = 380;
            WidthAnimation.To = 0;
            WidthAnimation.BeginTime = TimeSpan.FromMilliseconds(30);
            WidthAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(100));
            Storyboard.SetTarget(WidthAnimation, ChannelGrid);
            Storyboard.SetTargetProperty(WidthAnimation, "Width");
            SwipeLeft.Children.Add(WidthAnimation);
            SwipeLeft.Begin();
        }
        else if (dist > 100) // Swipe right
        {
            Storyboard SwipeRight = new Storyboard();

            ColorAnimation changeColorAnimation = new ColorAnimation();
            changeColorAnimation.EnableDependentAnimation = true;
            changeColorAnimation.To = Colors.Green;
            changeColorAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(100));
            Storyboard.SetTarget(changeColorAnimation, ChannelGrid);
            PropertyPath p = new PropertyPath("(ChannelGrid.Background).(SolidColorBrush.Color)");
            Storyboard.SetTargetProperty(changeColorAnimation, p.Path);
            SwipeRight.Children.Add(changeColorAnimation);

            SwipeRight.Begin();
        }
    }

How do I enable the normal listview scrolling as well as the swipe? Vertical Scrolling is possible when I remove the manipulation events

Answer 1

Update your manipulation mode to include System:

ManipulationMode="TranslateX,System"