Implicit Styling
The DataGrid enables you to style its specific inner elements by using its implicit styling feature.
Setup
All examples in this article will use the setup shown in the following example.
Populate the DataGrid
DataGridHoverControl
The following example shows how to change the appearance of a cell or row (depending on the current SelectionUnit
) when the mouse hovers over the element.
Style the DataGridHoverControl
SelectionRegionBorderControl
The following example shows how to change the appearance of the selected cell or row (depending on the current SelectionUnit
). The SelectionRegionBorderControl
overlays the decorations of the selected cell or row.
Style the SelectionRegionBorderControl
SelectionRegionBackgroundControl
The following example shows how to change the appearance of the selected cell or row (depending on the current SelectionUnit
). Note that the SelectionRegionBorder
control is rendered over the SelectionRegionBackground
control.
Style the SelectionRegionBackgroundControl
DataGridCurrencyControl
The following example shows how to change the appearance of the DataGridCurrencyControl
, that is, the appearance of the current item.
Style the DataGridCurrencyControl
DataGridColumnDragControl
The following example shows how to change the appearance of the column header while executing a drag operation.
Style the DataGridColumnDragControl
DataGridFlyoutGroupHeader
The following example shows how to change the appearance of the group header in the flyout.
Style the DataGridFlyoutGroupHeader
DataGridFilteringFlyout
The following example shows how to change the appearance of the filtering flyout. You can use its ClearFilterButtonStyle
and FilterButtonStyle
properties to style the Clear Filter and Filter buttons respectively.