Windows 8 Grid View control metro UI app

By Parin Turakhia May 07, 2012
Windows 8 Grid View control metro UI app
Hi Guys,
Following will help you to create Grid View control in Windows 8 metro UI apps XAML.

Step 1:

 Create User Control resources and the following 
   <CollectionViewSource x:Name="cvsItemSource" IsSourceGrouped="True"/>

Step 2:

  <GridView  x:Name="grdView"  BorderThickness="0" VerticalAlignment="Stretch"
                                           ItemsSource="{Binding Source={StaticResource cvsItemSource}}" 
                                            <DataTemplate x:Name="MainPage">
                                                         Here Is the template you want to display. 


                                                        <VariableSizedWrapGrid Orientation="Vertical" MaximumRowsOrColumns="2" Margin="0,0,0,0"/>
                                                        <TextBlock Margin="0,0,0,0"  Text="Title of the group" FontSize="25" Height="33" Foreground="#ffe1c4" />

                                                <StackPanel Orientation="Horizontal" />

Step 3:

Assign your item collection to the Item Source as follows:

cvsItemSource.Source = Your Collections;



Latest Blogs