<UserControl x:Class="SilverlightApplication1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
	<UserControl.Resources>
		<SolidColorBrush x:Key="GridView_GroupPanelOuterBorder" Color="#FF848484"/>
		<telerik:Office_BlackTheme x:Key="Theme"/>
		<telerik:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
		<ControlTemplate x:Key="RadGridViewTemplate" TargetType="telerik:RadGridView">
			<Border x:Name="PART_MasterGridContainer" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
				<VisualStateManager.VisualStateGroups>
					<VisualStateGroup x:Name="GridViewActivity">
						<VisualState x:Name="Idle">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_GridViewLoadingIndicator">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Collapsed"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
						<VisualState x:Name="Busy">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_GridViewLoadingIndicator">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
					</VisualStateGroup>
					<VisualStateGroup x:Name="ColumnHeadersVisibility">
						<VisualState x:Name="ColumnHeadersVisible">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_HeaderRow">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
						<VisualState x:Name="ColumnHeadersCollapsed">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_HeaderRow">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Collapsed"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
					</VisualStateGroup>
					<VisualStateGroup x:Name="ColumnFootersVisibility">
						<VisualState x:Name="ColumnFootersVisible">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_FooterRow">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
						<VisualState x:Name="ColumnFootersCollapsed">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_FooterRow">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Collapsed"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
					</VisualStateGroup>
					<VisualStateGroup x:Name="GroupPanelVisibility">
						<VisualState x:Name="GroupPanelVisible">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_GroupPanel">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
						<VisualState x:Name="GroupPanelCollapsed">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_GroupPanel">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Collapsed"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
					</VisualStateGroup>
					<VisualStateGroup x:Name="InsertRowVisibility">
						<VisualState x:Name="InsertRowVisible">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_AddNewRow">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
						<VisualState x:Name="InsertRowCollapsed">
							<Storyboard>
								<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PART_AddNewRow">
									<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Collapsed"/>
								</ObjectAnimationUsingKeyFrames>
							</Storyboard>
						</VisualState>
					</VisualStateGroup>
				</VisualStateManager.VisualStateGroups>
				<Grid x:Name="HierrarchyBackground" Background="{TemplateBinding Background}">
					<Grid.ColumnDefinitions>
						<ColumnDefinition/>
						<ColumnDefinition x:Name="ScrollBarColumn" MinWidth="0" Width="0"/>
					</Grid.ColumnDefinitions>
					<Grid.RowDefinitions>
						<RowDefinition Height="Auto"/>
						<RowDefinition x:Name="PART_AttachedBehaviorRow" Height="Auto"/>
						<RowDefinition/>
						<RowDefinition x:Name="ScrollBarRow" Height="0" MinHeight="0"/>
						<RowDefinition Height="Auto"/>
					</Grid.RowDefinitions>
					
                    <telerik:GridViewGroupPanel x:Name="PART_GroupPanel" BorderBrush="{StaticResource GridView_GroupPanelOuterBorder}" 
                                                Background="{TemplateBinding GroupPanelBackground}" Grid.ColumnSpan="2" 
                                                Foreground="{TemplateBinding GroupPanelForeground}" Grid.Row="0" telerik:StyleManager.Theme="{StaticResource Theme}"/>
					
                    <!--<telerik:GridViewScrollViewer x:Name="PART_ItemsScrollViewer" Background="Transparent" CanContentScroll="True" Grid.ColumnSpan="2" Grid.Row="2" Grid.RowSpan="2" telerik:StyleManager.Theme="{StaticResource Theme}">
						<telerik:GridViewScrollViewer.FooterRow>
							<telerik:GridViewFooterRow x:Name="PART_FooterRow" IndentLevel="{TemplateBinding GroupCount}" telerik:StyleManager.Theme="{StaticResource Theme}"/>
						</telerik:GridViewScrollViewer.FooterRow>
						<telerik:GridViewScrollViewer.HeaderRow>
							<telerik:GridViewHeaderRow x:Name="PART_HeaderRow" IndentLevel="{TemplateBinding GroupCount}" telerik:StyleManager.Theme="{StaticResource Theme}"/>
						</telerik:GridViewScrollViewer.HeaderRow>
						<telerik:GridViewScrollViewer.NewRow>
							<telerik:GridViewNewRow x:Name="PART_AddNewRow" IndentLevel="{TemplateBinding GroupCount}" telerik:StyleManager.Theme="{StaticResource Theme}" Visibility="Collapsed"/>
						</telerik:GridViewScrollViewer.NewRow>
						<telerik:GridViewVirtualizingPanel x:Name="PART_GridViewVirtualizingPanel"/>
					</telerik:GridViewScrollViewer>-->

                    <Grid Grid.ColumnSpan="2" Grid.Row="2">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        
                        <telerik:GridViewHeaderRow x:Name="PART_HeaderRow" IndentLevel="{TemplateBinding GroupCount}" 
                                                   telerik:StyleManager.Theme="{StaticResource Theme}"/>
                        <telerik:GridViewNewRow Grid.Row="1" x:Name="PART_AddNewRow" IndentLevel="{TemplateBinding GroupCount}" 
                                                telerik:StyleManager.Theme="{StaticResource Theme}" Visibility="Collapsed"/>

                        <telerik:RadTileView Grid.Row="2" MaximizeMode="Zero"
                                             IsVirtualizing="True" RowHeight="300" ColumnWidth="300" 
                                             ItemsSource="{Binding Items, RelativeSource={RelativeSource TemplatedParent}}" >
                            <telerik:RadTileView.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding ID, StringFormat=ID: \{0\}}"/>
                                </DataTemplate>
                            </telerik:RadTileView.ItemTemplate>

                            <telerik:RadTileView.ContentTemplate>
                                <DataTemplate>
                                    <Grid VerticalAlignment="Top">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="100" />
                                            <ColumnDefinition />
                                        </Grid.ColumnDefinitions>
                                        
                                        <Grid.RowDefinitions>
                                            <RowDefinition />
                                            <RowDefinition />
                                            <RowDefinition />
                                            <RowDefinition />
                                        </Grid.RowDefinitions>
                                        
                                        <TextBlock Text="ID:" FontWeight="Bold" />
                                        <TextBlock Text="{Binding ID}" Grid.Column="1"/>

                                        <TextBlock Text="Name:" FontWeight="Bold" Grid.Row="1" />
                                        <TextBlock Text="{Binding Name}" Grid.Column="1" Grid.Row="1" />

                                        <TextBlock Text="Date:" FontWeight="Bold" Grid.Row="2" />
                                        <TextBlock Text="{Binding Date}" Grid.Column="1" Grid.Row="2" />

                                        <TextBlock Text="Discontinued:" FontWeight="Bold" Grid.Row="3" />
                                        <TextBlock Text="{Binding Discontinued}" Grid.Column="1" Grid.Row="3" />
                                    </Grid>
                                </DataTemplate>
                            </telerik:RadTileView.ContentTemplate>
                        </telerik:RadTileView>

                        <telerik:GridViewFooterRow Grid.Row="3" x:Name="PART_FooterRow" IndentLevel="{TemplateBinding GroupCount}" telerik:StyleManager.Theme="{StaticResource Theme}"/>

                    </Grid>
                    
                    <telerik:ScrollPositionIndicator x:Name="PART_ScrollPositionIndicator" Grid.ColumnSpan="2" ContentTemplate="{TemplateBinding ScrollPositionIndicatorTemplate}" HorizontalAlignment="Right" IsHitTestVisible="False" Margin="0,0,28,0" Grid.Row="2" telerik:StyleManager.Theme="{StaticResource Theme}" Visibility="{Binding IsScrolling, Converter={StaticResource BooleanToVisibilityConverter}, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"/>
					<Border x:Name="PART_FrozenColumnsPreview" Background="#33000000" HorizontalAlignment="Left" Grid.Row="1" Grid.RowSpan="4" Visibility="Collapsed" VerticalAlignment="Stretch" Width="6"/>
					<telerik:GridViewLoadingIndicator x:Name="PART_GridViewLoadingIndicator" Grid.ColumnSpan="2" Grid.RowSpan="4" telerik:StyleManager.Theme="{StaticResource Theme}" Visibility="Collapsed"/>
				</Grid>
			</Border>
		</ControlTemplate>
		<SolidColorBrush x:Key="ControlBackground" Color="White"/>
		<SolidColorBrush x:Key="ControlOuterBorder" Color="#FF848484"/>
		<SolidColorBrush x:Key="ControlForeground" Color="Black"/>
		<SolidColorBrush x:Key="Item_AlternateBackground" Color="#FFF4F4F4"/>
		<SolidColorBrush x:Key="GridView_GridLinesItemBorder" Color="#FFCBCBCB"/>
		<LinearGradientBrush x:Key="GridView_GroupPanelBackground" EndPoint="0.5,1" StartPoint="0.5,0">
			<GradientStop Color="#FFDFDFDF" Offset="1"/>
			<GradientStop Color="#FFBABABA"/>
		</LinearGradientBrush>
		<SolidColorBrush x:Key="GridView_GroupPanelForeground" Color="Black"/>
		<Style x:Key="RadGridViewStyle1" TargetType="telerik:RadGridView">
			<Setter Property="Template" Value="{StaticResource RadGridViewTemplate}"/>
			<Setter Property="Background" Value="{StaticResource ControlBackground}"/>
			<Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder}"/>
			<Setter Property="Foreground" Value="{StaticResource ControlForeground}"/>
			<Setter Property="BorderThickness" Value="1"/>
			<Setter Property="AlternateRowBackground" Value="{StaticResource Item_AlternateBackground}"/>
			<Setter Property="VerticalGridLinesBrush" Value="{StaticResource GridView_GridLinesItemBorder}"/>
			<Setter Property="HorizontalGridLinesBrush" Value="{StaticResource GridView_GridLinesItemBorder}"/>
			<Setter Property="GroupPanelBackground" Value="{StaticResource GridView_GroupPanelBackground}"/>
			<Setter Property="GroupPanelForeground" Value="{StaticResource GridView_GroupPanelForeground}"/>
			<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
			<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
			<Setter Property="VerticalAlignment" Value="Stretch"/>
			<Setter Property="HorizontalAlignment" Value="Stretch"/>
            <Setter Property="ShowGroupPanel" Value="False"/>
		</Style>
	</UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White">
        <telerik:RadGridView ItemsSource="{Binding}" Style="{StaticResource RadGridViewStyle1}" />
    </Grid>
</UserControl>
