TileView.CustomItemTemplate Event

Allows you to assign and customize templates for individual tiles.

Namespace : DevExpress.XtraGrid.Views.Tile

Assembly : DevExpress.XtraGrid.v25.2.dll

NuGet Packages : DevExpress.Win.Grid, DevExpress.Win.Navigation

Declaration

C#
VB.NET

csharp

[DXCategory("Data")]
public event TileViewCustomItemTemplateEventHandler CustomItemTemplate

<DXCategory("Data")>
Public Event CustomItemTemplate As TileViewCustomItemTemplateEventHandler

Event Data

The CustomItemTemplate event's data class is DevExpress.XtraGrid.Views.Tile.TileViewCustomItemTemplateEventArgs.

Remarks

Handle the CustomItemTemplate event to override the default template for individual tiles. The following properties allow you to specify the default tile template:

TileView.TileTemplate — The default regular template.
TileView.TileHtmlTemplate — The default HTML-CSS template.

Override Regular Templates

Create regular templates beforehand in the Data Grid Designer’s Tile Template page. These templates are stored in the TileView.Templates collection, and they are also accessible from the Templates parameter of the CustomItemTemplate event.

When you handle the CustomItemTemplate event, access a required template from the e.Templates collection. Assign the template to the event’s Template parameter for individual items.

Override HTML-CSS Templates

When you handle the CustomItemTemplate event, you can assign a new HTML-CSS template (a DevExpress.Utils.Html.HtmlTemplate object) to the e.HtmlTemplate event parameter.

You can also use the following properties to modify the HTML and CSS markup of the current template:

e.HtmlTemplate.Template — Specifies HTML markup.
e.HtmlTemplate.Styles — Specifies CSS styles.

Tip

TileView’s TileView.TileHtmlTemplates property allows you to create multiple HTML-CSS templates at design time. You can then access these templates in your CustomItemTemplate event handler, and assign them to tiles.

The following example changes CSS styles for tiles based on their ‘Flagged’ property value:

See the following demo for the complete code:

Run Demo

C#
VB.NET

csharp

void TileView1_CustomItemTemplate(object sender, TileViewCustomItemTemplateEventArgs e) {
    var msg = tileView1.GetRow(e.RowHandle) as EmailMessage;
    if(msg == null) return;
    string result = e.HtmlTemplate.Styles;
    if(msg.Flagged) {
        result = result.Replace("<FlagDefaultOpacity>", "1").Replace("<FlagHoverOpacity>", "1");
    } else {
        result = result.Replace("<FlagDefaultOpacity>", "0").Replace("<FlagHoverOpacity>", "0.5");
    }
    e.HtmlTemplate.Styles = result;
}

Private Sub TileView1_CustomItemTemplate(ByVal sender As Object, ByVal e As TileViewCustomItemTemplateEventArgs)
    Dim msg = TryCast(tileView1.GetRow(e.RowHandle), EmailMessage)
    If msg Is Nothing Then Return
    Dim result As String = e.HtmlTemplate.Styles
    If msg.Flagged Then
        result = result.Replace("<FlagDefaultOpacity>", "1")
        result = result.Replace("<FlagHoverOpacity>", "1")
    Else
        result = result.Replace("<FlagDefaultOpacity>", "0")
        result = result.Replace("<FlagHoverOpacity>", "0.5")
    End If
    e.HtmlTemplate.Styles = result
End Sub