Set Group's Display Indices

RadTileList gives the opportunity to modify the order the groups will be displayed. Depending on the way you define your tiles, you can either set it directly in xaml or in AutogeneratingTile event handler.

Manually Generated Tiles

Once you create the groups in the definition of the tiles, you can set directly the properties of the group there. For example:

Example 1: Setting the DisplayIndex property of the TileGroups

XAML

	<telerik:RadTileList x:Name="RadTileList1">
	  <telerik:RadTileList.Groups>
	    <telerik:TileGroup Header="Europe" DisplayIndex="2">
	      <telerik:TileGroup.Items>
	        <telerik:Tile Background="#FFA300AB" Content="Italy" />
	        <telerik:Tile Background="#FFA300AB" Content="Germany" />
	      </telerik:TileGroup.Items>
	    </telerik:TileGroup>
	    <telerik:TileGroup Header="Asia" DisplayIndex="1">
	      <telerik:TileGroup.Items>
	        <telerik:Tile Background="#FFA300AB" Content="China" />
	        <telerik:Tile Background="#FFA300AB" Content="India" />
	      </telerik:TileGroup.Items>
	    </telerik:TileGroup>
	    <telerik:TileGroup Header="Africa" DisplayIndex="0">
	      <telerik:TileGroup.Items>
	        <telerik:Tile Background="#FFA300AB" Content="Nigeria" />
	        <telerik:Tile Background="#FFA300AB" Content="Egipt" />
	      </telerik:TileGroup.Items>
	    </telerik:TileGroup>
	  </telerik:RadTileList.Groups>
	</telerik:RadTileList>

Autogenerated Tiles

When you set ItemsSource of RadTileList and you need to control the order of the groups, you need to handle AutoGeneratingTile event and set the DisplayIndex of a group there. For example, if we work with the source defined in Autogenerated tiles article:

Example 2: Subscribing to the AutoGeneratingTile event

XAML

	<telerik:RadTileList x:Name="RadTileList2"
	           GroupMember="Occupation"
	                   AutoGeneratingTile="OnAutoGeneratingTile"
	                   ItemTemplate="{StaticResource ItemTemplate}"/>

Example 3: Handling the AutoGeneratingTile event

C#

	private void OnAutoGeneratingTile(object sender, AutoGeneratingTileEventArgs e)
	{
	    var item = e.Tile.DataContext as Employee;
	    if (item.Occupation.Contains("Manager"))
	    {
	        e.Tile.Group.DisplayIndex = 0;
	        e.Tile.Group.Header = "Managers";
	    }
	}

And the result will be: