# Tiles

**RadTileElement** represents a simple tile which can contain text and image and acts like a simple button. You can also add other elements to its **Children** collection programmatically.

To set the location of a tile, set its **Column** and **Row** properties either at design time or via code. These values are zero based and describe the location cell in either the main panel or the group in which the tile is placed.

#### Set tile's position

```C#
this.radTileElement1.Row = 1;
this.radTileElement1.Column = 0;

```

```VB.NET
Me.RadTileElement1.Row = 1
Me.RadTileElement1.Column = 0
```

![WinForms RadPanorama Row Column Property](https://www.telerik.com/products/winforms/documentation/assets/b70d0d9fb5280770c1941b1c3bb31b69/panorama-tiles001.png)

> caution **RadPanorama** uses dynamic number of columns, so you can set the **Column** property of a tile with a value, greater than the **ColumnsCount** value. However, setting the **Row** property with a value, greater than the **RowsCount** value, will result in an exception.

To change the span of a tile, set its **RowSpan** and **ColSpan** properties. The **RowSpan** property specifies how many cells of the row should be occupied by the tile. The **ColSpan** property specifies the number of cells in each column which the tile should occupy.

The **CellPadding** property specifies the offset of the tile according to the bounds of the cells. The following code snippet demonstrates using the **RowSpan**, **ColSpan** and **CellPadding** properties.

```C#
this.radTileElement1.RowSpan = 2;
this.radTileElement1.CellPadding = new Padding(5);

this.radTileElement2.ColSpan = 2;
this.radTileElement2.Column = 2;
this.radTileElement2.CellPadding = new Padding(5);

this.radTileElement3.Row = 1;
this.radTileElement3.Column = 1;
this.radTileElement3.CellPadding = new Padding(5);
    
```

```VB.NET
Me.RadTileElement1.RowSpan = 2
Me.RadTileElement1.CellPadding = New Padding(5)

Me.RadTileElement2.ColSpan = 2
Me.RadTileElement2.Column = 2
Me.RadTileElement2.CellPadding = New Padding(5)

Me.RadTileElement3.Row = 1
Me.RadTileElement3.Column = 1
Me.RadTileElement3.CellPadding = New Padding(5)
```

![WinForms RadPanorama CellPadding](https://www.telerik.com/products/winforms/documentation/assets/106ee552b9eba4af1ffb5dbf7a0e0cb5/panorama-tiles002.png)

## Live Tiles

**RadLiveTileElement** extends the functionality of **RadTileElement** by providing means of displaying content that changes on a specified time interval.

To change the content element, you can edit the contents of the tiles' **Items** collection:

#### Add live tiles

```C#
radLiveTileElement1.Items.Add(new LightVisualElement()
{
    Text = "Movie Idea: Pirates of the Carribean"
});
radLiveTileElement1.Items.Add(new LightVisualElement()
{
    Text = "Movie Idea: Inception"
});
radLiveTileElement1.Items.Add(new LightVisualElement()
{
    Text = "Movie Idea: The Expendables"
});
radLiveTileElement1.Items.Add(new LightVisualElement()
{
    Text = "Movie Idea: Harry Potter and the Deathly Hallows"
});
        
```

```VB.NET
RadLiveTileElement1.Items.Add(New LightVisualElement() With { _
    .Text = "Movie Idea: Pirates of the Carribean" _
})
RadLiveTileElement1.Items.Add(New LightVisualElement() With { _
    .Text = "Movie Idea: Inception" _
})
RadLiveTileElement1.Items.Add(New LightVisualElement() With { _
    .Text = "Movie Idea: The Expendables" _
})
RadLiveTileElement1.Items.Add(New LightVisualElement() With { _
    .Text = "Movie Idea: Harry Potter and the Deathly Hallows" _
})
```

The following properties are responsible for controlling the behavior of the transition between content elements:

#### Customize Animation

```C#
this.radLiveTileElement1.AnimationFrames = 15; //sets the number of frames in a transition
this.radLiveTileElement1.AnimationInterval = 30; //sets the interval between each frame in the transition in miliseconds
this.radLiveTileElement1.ContentChangeInterval = 7000; //sets the interval between each content change
this.radLiveTileElement1.TransitionType = ContentTransitionType.SlideUp; //sets the type of the transition animation

```

```VB.NET
Me.RadLiveTileElement1.AnimationFrames = 15 'sets the number of frames in a transition
Me.RadLiveTileElement1.AnimationInterval = 30 'sets the interval between each frame in the transition in miliseconds
Me.RadLiveTileElement1.ContentChangeInterval = 7000 'sets the interval between each content change
Me.RadLiveTileElement1.TransitionType = ContentTransitionType.SlideUp 'sets the type of the transition animation
```

![WinForms RadPanorama Custom Animation](https://www.telerik.com/products/winforms/documentation/assets/dd7ba39e7dca4858365f92a395a95c07/panorama-tiles003.gif)

## Populating with Tiles/Groups Programmatically

You can find below a sample code snippet demonstrating how to add groups to **RadPanorama** and fill the groups with tiles.

![WinForms RadPanorama Populating With Data Programmatically](https://www.telerik.com/products/winforms/documentation/assets/fc5ee13b156f3eac5410435a978f2b4d/panorama-tiles004.png)

#### Populating With Data Programmatically

```C#
TileGroupElement group1 = new TileGroupElement();
group1.Text = "Group 1";
TileGroupElement group2 = new TileGroupElement();
group2.Text = "Group 2";
radPanorama1.Groups.Add(group1);
radPanorama1.Groups.Add(group2);
radPanorama1.ShowGroups = true;

RadTileElement tile1 = new RadTileElement();
tile1.Text = "Tile 1";
tile1.ColSpan = 2;
group1.Items.Add(tile1);

RadTileElement tile2 = new RadTileElement();
tile2.Text = "Tile 2";
tile2.ColSpan = 2;
group2.Items.Add(tile2);

RadTileElement tile3 = new RadTileElement();
tile3.Text = "Tile 3";
group2.RowsCount = 3;
tile3.Row = 1;
tile3.RowSpan = 2;
group2.Items.Add(tile3);

```

```VB.NET
Dim group1 As New TileGroupElement()
group1.Text = "Group 1"
Dim group2 As New TileGroupElement()
group2.Text = "Group 2"
RadPanorama1.Groups.Add(group1)
RadPanorama1.Groups.Add(group2)
RadPanorama1.ShowGroups = True

Dim tile1 As New RadTileElement()
tile1.Text = "Tile 1"
tile1.ColSpan = 2
group1.Items.Add(tile1)

Dim tile2 As New RadTileElement()
tile2.Text = "Tile 2"
tile2.ColSpan = 2
group2.Items.Add(tile2)

Dim tile3 As New RadTileElement()
tile3.Text = "Tile 3"
group2.RowsCount = 3
tile3.Row = 1
tile3.RowSpan = 2
group2.Items.Add(tile3)

```

## See Also

* [Properties and Methods ](https://www.telerik.com/products/winforms/documentation/controls/panorama/settings)
* [Custom Tiles](https://www.telerik.com/products/winforms/documentation/controls/panorama/custom-tiles)