RadzenTileLayout Class

A dashboard layout that arranges RadzenTileLayoutItem tiles on a configurable column/row grid. When EditMode is enabled tiles can be moved by dragging their header and resized from the bottom-right corner. Tile positions are snapped to grid cells and reported through two-way bindable parameters and the Change callback.

Inheritance

Object

ComponentBase

RadzenComponent

RadzenTileLayout

Implements

IComponent

IHandleEvent

IHandleAfterRender

Namespace: Radzen.Blazor

Assembly: Radzen.Blazor.dll

Syntax

public class RadzenTileLayout : RadzenComponent, IComponent, IHandleEvent, IHandleAfterRender

Examples

<RadzenTileLayout Columns="12" RowHeight="80" EditMode="true" ShowGrid="true" Change=@OnChange>
    <RadzenTileLayoutItem Title="Sales" Col="1" Row="1" ColSpan="6" RowSpan="2">
        ...
    </RadzenTileLayoutItem>
    <RadzenTileLayoutItem Title="Visitors" Col="7" Row="1" ColSpan="6" RowSpan="2">
        ...
    </RadzenTileLayoutItem>
</RadzenTileLayout>

Constructors

RadzenTileLayoutLink to this section

A dashboard layout that arranges RadzenTileLayoutItem tiles on a configurable column/row grid. When EditMode is enabled tiles can be moved by dragging their header and resized from the bottom-right corner. Tile positions are snapped to grid cells and reported through two-way bindable parameters and the Change callback.

Declaration
public RadzenTileLayout()

Properties

AllowMoveLink to this section

Gets or sets a value indicating whether tiles can be moved while in EditMode.

Declaration
public bool AllowMove { get; set; }
Property Value
Type Description
boolGets or sets a value indicating whether tiles can be moved while in EditMode.

AllowResizeLink to this section

Gets or sets a value indicating whether tiles can be resized while in EditMode.

Declaration
public bool AllowResize { get; set; }
Property Value
Type Description
boolGets or sets a value indicating whether tiles can be resized while in EditMode.

ChangeLink to this section

Gets or sets the callback raised after a tile has been moved or resized.

Declaration
public EventCallback<RadzenTileLayoutItem> Change { get; set; }
Property Value
Type Description
EventCallback<RadzenTileLayoutItem>Gets or sets the callback raised after a tile has been moved or resized.

ChildContentLink to this section

Gets or sets the tiles to display. Should contain RadzenTileLayoutItem components.

Declaration
public RenderFragment ChildContent { get; set; }
Property Value
Type Description
RenderFragmentGets or sets the tiles to display. Should contain RadzenTileLayoutItem components.

ColumnsLink to this section

Gets or sets the number of columns in the grid.

Declaration
public int Columns { get; set; }
Property Value
Type Description
intGets or sets the number of columns in the grid.

EditModeLink to this section

Gets or sets a value indicating whether tiles can be moved and resized. When false the layout is read-only.

Declaration
public bool EditMode { get; set; }
Property Value
Type Description
boolGets or sets a value indicating whether tiles can be moved and resized. When false the layout is read-only.

GapLink to this section

Gets or sets the gap between cells, in pixels.

Declaration
public double Gap { get; set; }
Property Value
Type Description
doubleGets or sets the gap between cells, in pixels.

RowHeightLink to this section

Gets or sets the height of a single row, in pixels.

Declaration
public double RowHeight { get; set; }
Property Value
Type Description
doubleGets or sets the height of a single row, in pixels.

RowsLink to this section

Gets or sets the number of rows in the grid. When 0 the grid grows automatically to fit its tiles.

Declaration
public int Rows { get; set; }
Property Value
Type Description
intGets or sets the number of rows in the grid. When 0 the grid grows automatically to fit its tiles.

ShowGridLink to this section

Gets or sets a value indicating whether to render a grid overlay.

Declaration
public bool ShowGrid { get; set; }
Property Value
Type Description
boolGets or sets a value indicating whether to render a grid overlay.

Methods

BuildRenderTreeLink to this section

Declaration
protected override void BuildRenderTree(Rendering.RenderTreeBuilder __builder)
Parameters
Type Name Description
Rendering.RenderTreeBuilder __builder

DisposeLink to this section

Declaration
public override void Dispose()

GetComponentCssClassLink to this section

Declaration
protected override string GetComponentCssClass()
Returns
Type Description
string
An error has occurred. This app may no longer respond until reloaded. Reload 🗙