Based on a question I answered on Stackoverflow I’ve decided to just quickly show how you can generate the default template for a control, so you then can change it as you please. Let’s face it, the default templates will only take you so far, you will want to edit that purple selected item color at some point, or like me- remove all selection animations and just use the panel to simply display data as a collection.
Here is two ways to generate the template in Visual Studio 2012:
Here is two ways to generate the template in Blend:
This will generate the template, add an x:key to the style, and add this style as astatic resource to the control you selected.
To just make minor/simple changes you can just override some style properties within the controls style (localy)- you can’t do both as the style property can only be set once. When defined locally you don’t need to reference the style.
Notice the ItenContainerStyle- this is where we made the style changes!
<ListView> <ListView.ItemsPanel> <ItemsPanelTemplate> <WrapGrid Orientation="Horizontal" HorizontalChildrenAlignment="left"/> </ItemsPanelTemplate> </ListView.ItemsPanel> <ListView.ItemContainerStyle> <Style TargetType="ListViewItem"> <Setter Property="Padding" Value="0"/> <Setter Property="Margin" Value="0"/> </Style> </ListView.ItemContainerStyle> <ListViewItem> <TextBlock Foreground="Wheat">hej</TextBlock> </ListViewItem> <ListViewItem> <TextBlock Foreground="Wheat">hej</TextBlock> </ListViewItem> </ListView>
4 comments on “Example WinRT/Metro App: How to edit default template in Visual Studio 2012 and Blend”
Pingback: Windows 8 Developer Links – 2012-07-23Dan Rigby | Dan Rigby
Pingback: Dew Drop – July 23, 2012 (#1,369) | Alvin Ashcraft's Morning Dew
Pingback: Example Metro app /WinRT: How to change default selected item colors when using Listview? »
Pingback: Example Metro app /WinRT: How to change the style of the radiobutton? »