<disclaimer> The reason that the GridView and ListView have built-in animations for when a user taps or mouse-downs on an item is to provide feedback that they have indeed tapped/mouse downed on an item. I highly discourage the removal of these built-in animations as it will detract from your user experience. That said, there are times where you may need to remove these animations. For example if you nest a ListView within an item of a GridView, then, depending on what you want tappable, you’ll need to remove the animations on either the GridView or ListView.</disclaimer>
*If you’re building for Windows 8.0 then I suggest taking a look at some of the existing posts out there on how to remove storyboards from the ItemContainerStyle (eg http://stackoverflow.com/questions/10359197/windows-8-gridview-disabling-item-tap-visualization)
A lot of the discussion on the web is on how to remove various transitions from elements in Windows 8/8.1. For example setting the Transitions property to an empty TransitionsCollection. However, after setting virtually every transitions property I could find, I was still seeing the tap animation. It turns out that one solution is much simpler than I’d thought, and can be useful if you want to get rid on all the built in GridView/ListView item effects. Be warned, this will remove all those built-in effects!
Let’s walk through a simple example:
– Create a new Windows application based on the Hub App template – this will give us a GridView to work with. You can also use the Grid App if you want.
– Open the application in Blend (right-click the project and select “Open in Blend”)
– Locate a GridView to modify – we’re going to use the GridView in Section 3 of the Hub
– Right-click the GridView and select Edit Additional Templates –> Edit Generated Item Container (ItemContainerStyle) –> Edit a Copy
– Switch to code mode (I prefer split mode) and delete (or comment out) the GridViewItemPresenter element.
– Add an empty ContentPresenter element.
<Style x_Key=”GridViewItemStyle1″ TargetType=”GridViewItem”>
<Setter Property=”FontFamily” Value=”{ThemeResource ContentControlThemeFontFamily}”/>
<Setter Property=”FontSize” Value=”{ThemeResource ControlContentThemeFontSize}”/>
<Setter Property=”Background” Value=”Transparent”/>
<Setter Property=”TabNavigation” Value=”Local”/>
<Setter Property=”IsHoldingEnabled” Value=”True”/>
<Setter Property=”Margin” Value=”0,0,2,2″/>
<Setter Property=”Template”>
<Setter.Value>
<ControlTemplate TargetType=”GridViewItem”>
<ContentPresenter />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
– Run the application – you’ll notice that there is no tap animation on the GridView in section 3, yet it still responds to tap or mouse click on the item (just no visible feedback).
Note: If you have a GridView or ListView that isn’t interactive you can always either disable it or set the IsHitTestVisible property to false.