Enable mouse scrolling while maintaining the ability to touch selected items

Question

I am using a gridview to display a list of items. I need the ability to use the mouse scroll wheel to scroll on the page that contains the GridView. This is easily achieved by overriding the GridView template.

<GridView.Template> <ControlTemplate> <ItemsPresenter /> </ControlTemplate> </GridView.Template> 

However, I also need elements that can be selected from the touch device. This is usually done by clicking the item down, after which it will be selected. After applying the above template, the redefinition of the touch selection mechanism breaks.

I went to Blend and started looking at the default template for the GridView, which can be seen below

 <ControlTemplate TargetType="GridView"> <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"> <ScrollViewer x:Name="ScrollViewer" BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsHorizontalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsHorizontalScrollChainingEnabled}" IsVerticalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsVerticalScrollChainingEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" TabNavigation="{TemplateBinding TabNavigation}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}"> <ItemsPresenter HeaderTemplate="{TemplateBinding HeaderTemplate}" Header="{TemplateBinding Header}" HeaderTransitions="{TemplateBinding HeaderTransitions}" Padding="{TemplateBinding Padding}" /> </ScrollViewer> </Border> </ControlTemplate> 

If I remove the ScrollViewer or disable the horizontal part of the scroll in any way, then the touch selection will stop working.

How can I turn on mouse scrolling and touch selection at the same time?

And just in order to clarify, I do not need actions that must occur simultaneously. Both just need to work separately on the same page for the same GridView.

Answer 1

I do not think your scenario is possible. SV with a mesh inside it is a problem. MSDN docs say that GridView prevents the PointerWheelChanged bubble event:

See GridView Docs:

Attention. The PointerWheelChanged event does not bubble from the GridView. This means that the control that has a GridView inside it does not accept mouse wheel change messages if the pointer is over the GridView. For example, if you place a GridView inside a ScrollViewer, you cannot scroll the ScrollViewer with the mouse wheel when the pointer is over the GridView.