Back to Devexpress

TileView.CustomDrawTile Event

windowsforms-devexpress-dot-xtragrid-dot-views-dot-tile-dot-tileview-0f819045.md

latest12.5 KB
Original Source

TileView.CustomDrawTile Event

Allows you to draw tiles manually.

Namespace : DevExpress.XtraGrid.Views.Tile

Assembly : DevExpress.XtraGrid.v25.2.dll

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

Declaration

csharp
[DXCategory("CustomDraw")]
public event EventHandler<TileViewItemCustomDrawEventArgs> CustomDrawTile
vb
<DXCategory("CustomDraw")>
Public Event CustomDrawTile As EventHandler(Of TileViewItemCustomDrawEventArgs)

Event Data

The CustomDrawTile event's data class is TileViewItemCustomDrawEventArgs. The following properties provide information specific to this event:

PropertyDescription
AppearanceGets appearance settings for the painted tile. Inherited from TileCustomDrawEventArgs.
BoundsGets or sets tile bounds. Inherited from TileCustomDrawEventArgs.
CacheGets an object that stores the most used pens, fonts, and brushes. Inherited from TileCustomDrawEventArgs.
DefaultSelectionBoundsGets the default bounds of the selection rectangle. Inherited from TileCustomDrawEventArgs.
DefaultSelectionColorGets the default color of the selection rectangle. Inherited from TileCustomDrawEventArgs.
DefaultSelectionWidthGets the default thickness of the selection rectangle. Inherited from TileCustomDrawEventArgs.
DrawingProcessGets the stage of the drawing process.
HandledGets or sets whether to skip the default painting. Inherited from TileCustomDrawEventArgs.
IsDisabledGets the disabled state of the processed tile. Inherited from TileCustomDrawEventArgs.
IsFocusedGets the focused state of the processed tile.
IsHoveredGets the hovered state of the processed tile. Inherited from TileCustomDrawEventArgs.
IsSelectedGets the selection state of the processed tile. Inherited from TileCustomDrawEventArgs.
ItemGets the processed tile.
RowHandleGets the row handle of the processed tile.
ShouldDrawBackgroundGets whether the tile should display a background. Inherited from TileCustomDrawEventArgs.
ShouldDrawBorderGets whether the tile should display a border. Inherited from TileCustomDrawEventArgs.
ShouldDrawCheckMarkGets whether the tile should display a check mark. Inherited from TileCustomDrawEventArgs.
ShouldDrawContentGets whether the tile should display content. Inherited from TileCustomDrawEventArgs.
ShouldDrawDisabledOverlayGets whether the tile should display a disabled overlay. Inherited from TileCustomDrawEventArgs.
ShouldDrawHoveredOverlayGets whether the tile should display a hovered overlay. Inherited from TileCustomDrawEventArgs.
TileViewEmptySpaceBackColorGets the Tile View background.

The event data class exposes the following methods:

MethodDescription
DefaultDraw()Draws the processed tile element in its default appearance. Inherited from TileCustomDrawEventArgs.
DrawBackground()Draws the tile background in its default appearance. Inherited from TileCustomDrawEventArgs.
DrawBorder()Draws the tile border in its default appearance. Inherited from TileCustomDrawEventArgs.
DrawCheckMark()Draws the tile check mark in its default appearance. Inherited from TileCustomDrawEventArgs.
DrawContent()Draws tile content in its default appearance. Inherited from TileCustomDrawEventArgs.
DrawDisabledOverlay()Draws the overlay for the disabled state in its default appearance. Inherited from TileCustomDrawEventArgs.
DrawHoveredOverlay()Draws the overlay for the hovered state in its default appearance. Inherited from TileCustomDrawEventArgs.
DrawHtml(HtmlTemplate, DxHtmlPainterContext, Action<DxHtmlPainterArgs>)Paints the specified HTML template inside the processed tile element. The context parameter allows you to assign an object that transfers mouse events to template elements. Inherited from TileCustomDrawEventArgs.
DrawHtml(HtmlTemplate, Action<DxHtmlPainterArgs>)Paints the specified HTML template inside the processed tile element. Inherited from TileCustomDrawEventArgs.

Remarks

The following code snippet demonstrates the default drawing algorithm:

csharp
void tileView1_CustomDrawTile(object sender, TileViewItemCustomDrawEventArgs e) {
    switch (e.DrawingProcess) {
        case TileViewItemCustomDrawProcess.DrawTile:
            if (e.ShouldDrawBackground)
                e.DrawBackground();
            if (e.ShouldDrawContent)
                e.DrawContent();
            if (e.ShouldDrawHoveredOverlay)
                e.DrawHoveredOverlay();
            if (e.ShouldDrawDisabledOverlay)
                e.DrawDisabledOverlay();
            if (e.ShouldDrawBorder)
                e.DrawBorder();
            if (e.ShouldDrawCheckMark)
                e.DrawCheckMark();
            break;
        case TileViewItemCustomDrawProcess.DrawCheckMark:
            e.DefaultDraw();
            break;
        case TileViewItemCustomDrawProcess.DrawSelection:
            e.DefaultDraw();
            break;
    }
    e.Handled = true;
}
vb
Private Sub tileView1_CustomDrawTile(ByVal sender As Object, ByVal e As TileViewItemCustomDrawEventArgs)
    Select Case e.DrawingProcess
        Case TileViewItemCustomDrawProcess.DrawTile
            If e.ShouldDrawBackground Then e.DrawBackground()
            If e.ShouldDrawContent Then e.DrawContent()
            If e.ShouldDrawHoveredOverlay Then e.DrawHoveredOverlay()
            If e.ShouldDrawDisabledOverlay Then e.DrawDisabledOverlay()
            If e.ShouldDrawBorder Then e.DrawBorder()
            If e.ShouldDrawCheckMark Then e.DrawCheckMark()
        Case TileViewItemCustomDrawProcess.DrawCheckMark
            e.DefaultDraw()
        Case TileViewItemCustomDrawProcess.DrawSelection
            e.DefaultDraw()
    End Select

    e.Handled = True
End Sub

ShouldDraw... conditions allow you to modify specific tile elements.

The following demo uses the CustomDrawTile event to render HTML and CSS templates inside tiles:

Run Demo: Tile View - CustomDrawTile Event

csharp
DxHtmlPainterContext context = new DxHtmlPainterContext();

tileView1.CustomDrawTile += (s, e) => {
    SampleData obj = tileView1.GetRow(e.RowHandle) as SampleData;
    if (obj.Hidden) {
        if (e.DrawingProcess == TileViewItemCustomDrawProcess.DrawTile) {
            e.DrawBackground();
            e.DrawHtml(htmlTemplate, context, (args) => args.InteractivityKey = obj.ID);
            e.DrawBorder();
            e.Handled = true;
        }
    }
};
html
<div class="tile">
    <div class="text"><strong>Content of this tile is hidden</strong></div>
    <div class="show-action">Show content</div>
</div>
css
.tile {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.show-action {
    color: deepskyblue;
    text-decoration: underline;
    cursor: pointer;
}
    .show-action:hover {
        color: lightskyblue;
    }

See Also

TileView Class

TileView Members

DevExpress.XtraGrid.Views.Tile Namespace