Tile Class
A tile in a TileLayoutControl.
Namespace: DevExpress.Xpf.LayoutControl
Assembly: DevExpress.Xpf.LayoutControl.v23.2.dll
NuGet Package: DevExpress.Wpf.LayoutControl
Declaration
public class Tile :
MaximizableHeaderedContentControlBase,
ITile,
IMaximizableElement,
IClickable,
IWeakEventListenerRelated API Members
The following members return Tile objects:
Remarks
Tiles are interactive items in a TileLayoutControl. They can display any content and can be of four predefined sizes:
- Small - A medium square tile of 150x150 pixels.
- Large - A wide tile of 310x150 pixels.
- Extra Small - A small square tile of 70x70 pixels, a tile header is hidden.
- Extra Large - An extra large square tile of 310x310 pixels.
A tile consists of the following elements:
Header
The header is specified by the tile’s Header property. Its location within the tile is specified by the Padding, Tile.HorizontalHeaderAlignment and Tile.VerticalHeaderAlignment properties. To hide the header, set the Header property to an empty string.
Content
A tile’s content is specified by the Content property. You can provide varying content that is changed automatically at a specified time interval via the Tile.ContentSource property. The content change interval is specified by the Tile.ContentChangeInterval property.
You can also define a template that displays a tile’s content using the ContentTemplate property (e.g., the large tile shown in the top image).
Border
The border’s thickness is specified by the BorderThickness property. Its appearance is specified by the BorderBrush property.
To associate an action with a tile, define a command using the Tile.Command property or handle the Tile.Click event. The TileLayoutControl provides the TileLayoutControl.TileClick event, allowing you to perform required tile actions in one place.
Example
This example shows how to define varying content using the Tile.ContentSource property. The content change interval is set to 1 second. The Tile.AnimateContentChange option is enabled to play an animation each time the tile’s content changes.
The animation below shows the result:
<dxlc:TileLayoutControl Background="White" Name="tileLayoutControl1">
<dxlc:Tile Name="tile1" Size="Small" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
AnimateContentChange="True" ContentChangeInterval="00:00:01">
<dxlc:Tile.ContentSource>
<dx:FrameworkElements>
<Image Source="Images/Research.png" Stretch="None" />
<Image Source="Images/System.png" Stretch="None" />
<Image Source="Images/Statistics.png" Stretch="None" />
</dx:FrameworkElements>
</dxlc:Tile.ContentSource>
</dxlc:Tile>
</dxlc:TileLayoutControl>