Getting Started
Adding the RadTileView to the page
In order to use RadTileView control in your projects you have to add references to the following assemblies:
- Telerik.Windows.Controls
- Telerik.Windows.Controls.Navigation
- Telerik.Windows.Data
You can find more info here.
<UserControl x:Class="RadTileViewHelpExamples.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"> <Grid x:Name="LayoutRoot">
<telerik:RadTileView>
<telerik:RadTileViewItem Header="Item1">
<TextBlock Text="Item1 Content"/>
</telerik:RadTileViewItem>
<telerik:RadTileViewItem Header="Item2">
<TextBlock Text="Item2 Content"/>
</telerik:RadTileViewItem>
<telerik:RadTileViewItem Header="Item3" >
<TextBlock Text="Item3 Content"/>
</telerik:RadTileViewItem>
</telerik:RadTileView>
</Grid>
</UserControl>
As you can see from the image below the items are in restored state by default.
Setting maximized item
To set an item in maximized state you can use the TileState property and set its value to Maximized.
<telerik:RadTileView>
<telerik:RadTileViewItem TileState="Maximized" Header="Item1">
<TextBlock Text="Item1 Content"/>
</telerik:RadTileViewItem>
<telerik:RadTileViewItem Header="Item2">
<TextBlock Text="Item2 Content"/>
</telerik:RadTileViewItem>
<telerik:RadTileViewItem Header="Item3" >
<TextBlock Text="Item3 Content"/>
</telerik:RadTileViewItem>
</telerik:RadTileView>
As you can see from the image below Item1 is now in maximized state.
Setting minimized position
To set the minimized area positions use the MinimizedItemsPosition property. It is an enumeration with the following values:
- Left
- Top
- Right
- Bottom
<telerik:RadTileView MinimizedItemsPosition="Bottom">
<telerik:RadTileViewItem TileState="Maximized" Header="Item1">
<TextBlock Text="Item1 Content"/>
</telerik:RadTileViewItem>
<telerik:RadTileViewItem Header="Item2">
<TextBlock Text="Item2 Content"/>
</telerik:RadTileViewItem>
<telerik:RadTileViewItem Header="Item3" >
<TextBlock Text="Item3 Content"/>
</telerik:RadTileViewItem>
</telerik:RadTileView>
