Edit this page

Customize Position

The RadTileView allows customization of the position of its items. There are two properties that control the position of a RadTileViewItem - Visibility and Position.

Setting the RadTileViewItem Visibility

The Visibility property of the TileViewItem allows you to choose which items to be displayed at any given moment.

<telerik:RadTileView x:Name="RadTileView1">
 <telerik:RadTileViewItem Header="Item1" Visibility="Collapsed">
  <TextBlock Text="Item1 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item2">
  <TextBlock Text="Item2 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item3" Visibility="Collapsed">
  <TextBlock Text="Item3 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item4">
  <TextBlock Text="Item4 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item5" Visibility="Collapsed">
  <TextBlock Text="Item5 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item6">
  <TextBlock Text="Item6 Content" />
 </telerik:RadTileViewItem>
</telerik:RadTileView>

Controlling the RadTileViewItem Position

The Position property of the TileViewItems controls the positions of the Restored and/or Minimized items. However, if there is a Maximized item, by default it will be on Position 0. Therefore setting another RadTileViewItem Position to 0, will maximize this item instead.

<telerik:RadTileView x:Name="RadTileView1">
 <telerik:RadTileViewItem Header="Item1" Visibility="Collapsed">
  <TextBlock Text="Item1 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item2" Position="2">
  <TextBlock Text="Item2 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item3" Visibility="Collapsed">
  <TextBlock Text="Item3 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item4" Position="0">
  <TextBlock Text="Item4 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item5" Visibility="Collapsed">
  <TextBlock Text="Item5 Content" />
 </telerik:RadTileViewItem>
 <telerik:RadTileViewItem Header="Item6" Position="1">
  <TextBlock Text="Item6 Content" />
 </telerik:RadTileViewItem>
</telerik:RadTileView>

More information and a sample project you can find here.