How to disable scrolling of FlipView items using mouse wheel in Windows 8.1
I have a Windows 8.1 Store C # / XAML app, in this app I have a FlipView with multiple flipview elements. In one item, I have a WebView which is quite long.
The problem is when I scroll with the mouse wheel in the WebView and I get to the end of the page, the FlipView then scrolls to the next item, which is unwanted .
The expected behavior is to scroll freely in the WebView, not between FlipView elements. Ideally, switching between FlipView controls should only work with touch or programmatic change.
I've tried setting various ScrollViewer properties on FlipViewItem or nested items by changing the ManipulationMode, but nothing has worked so far.
Sample code:
<FlipView>
<FlipViewItem>
<Grid Background="Red"/>
</FlipViewItem>
<FlipViewItem>
<Grid>
<!-- when scrolling on this page, do not navigate to Blue or Red FlipViewItem-->
<WebView Source="http://cnn.com"/>
</Grid>
</FlipViewItem>
<FlipViewItem>
<Grid Background="Blue"/>
</FlipViewItem>
</FlipView>
source to share
Found it by trying almost all ScrollViewer related properties for all elements around, the solution is actually very simple - as Tamás Deme hinted that I need to handle the PointerWheelChanged Event for the Parent element containing the WebView.
<FlipView>
<FlipViewItem>
<Grid Background="Red"/>
</FlipViewItem>
<FlipViewItem>
<Grid PointerWheelChanged="PointerWheelIgnore">
<WebView Source="http://cnn.com"/>
</Grid>
</FlipViewItem>
<FlipViewItem>
<Grid Background="Blue"/>
</FlipViewItem>
</FlipView>
...
private void PointerWheelIgnore(object sender, PointerRoutedEventArgs e)
{
e.Handled = true;
}
Why does it work? WebView translates mouse wheel scroll events to move web content and set PointerRoutedEventArgs to be handled. But if the web content is already at the bottom, the WebView does not set the PointerRoutedEventArgs as handled, and this event then bubbles up to the FlipView, which flips between FlipViewItems . If I handle / stop PointerWheelChanged event between WebView and FlipView then there is no FlipView scrolling between items.
source to share