Kendo UI for Angular TileLayout Overview
The Kendo UI for Angular TileLayout displays a collection of tiles and aligns them into columns and rows.
The tiles are highly customizable in terms of content, size, positioning, and the spacing that separates them. The TileLayout also allows end users to rearrange and resize any of the tiles while providing full control over the flow of the component during these events to the developer.
Start Free Trial
The following example demonstrates the TileLayout in action.
Change Theme
Theme
Loading ...
Key Features
- Tiles configuration—The TileLayout supports a number of settings for configuring the size and position of the tile rows and columns.
- Columns and rows dimensions—The TileLayout provides options for defining the number of visual columns and for setting the layout of its rows and columns.
- Auto flow—The TileLayout enables you to choose whether the component will use the auto-placement rules or the CSS grid-auto-flow configuration option.
- Tiles reordering—You can use the tile reordering options provided by the TileLayout such as enabling or disabling the functionality, using a programmatic approach to implement it, and more.
- Tiles resizing—You can use the tile resizing options provided by the TileLayout such as enabling or disabling the functionality, using a programmatic approach to implement it, and more.
- Tiles collection—The TileLayout delivers an alternative approach to the manual declaration of each container and enables you to render all tiles as a collection of configurable objects.
- Globalization—All Kendo UI for Angular Layout components provide globalization options.
Known Limitations
- Placing the TileLayout within an element with
positionset toabsoluteorrelativewill result in undesired offsetting of the Tiles during resizing.
Support and Learning Resources
- TileLayout Homepage
- Getting Started with the Kendo UI for Angular Layout
- API Reference of the TileLayout
- API Reference of the TileLayoutItem
- Getting Started with Kendo UI for Angular (Online Guide)
- Getting Started with Kendo UI for Angular (Video Tutorial)
- Virtual Classroom (Training Courses for Registered Users)
- TileLayout Forum
- Before You Start: All Things Angular (Telerik Blog Post)
- Knowledge Base