Edit this page

Styling Merged Cells

Merged cells have a template structure similar to RadGridView cells. You could also read the article, Template Structure of the GridViewMergedCell.

In this article we will discuss the following topics:

Targeting the GridViewMergedCell element

In order to style merged cells, you should create an appropriate style targeting the GridViewMergedCell element.

You have two options:

  • To create an empty style and set it up on your own.

  • To copy the default style of the control and modify it.

To learn how to modify the default GridViewMergedCell style, please refer to the Modifying Default Styles article.

The GridViewMergedCell is located in the Telerik.Windows.Controls.GridView namespace of the Telerik.Windows.Controls.GridView assembly.

GridViewMergedCell uses Triggers, not VisualStateManager's states, to apply property values based on specified conditions.

You can apply a style to the merged cells, similar to:

Example 1: Styling all merged cells of an application

<Style TargetType="telerik:GridViewMergedCell">
            <Setter Property="VerticalContentAlignment" Value="Top"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="Background" Value="#ffcc00"/>
        </Style>

If you're using Implicit Styles, you should base your style on the GridViewMergedCellStyle.

Figure 1: Styled merged cells

RadGridView styled merged cells

Setting MergedCellsStyle

If instead you would like to set a style only for a specific RadGridView, you can use its MergedCellsStyle property, like so:

Example 2: Styling merged cells of a specific RadGridView

<Grid.Resources>
                <Style TargetType="telerik:GridViewMergedCell" x:Key="GridViewMergedCellsStyle">
                    <Setter Property="VerticalContentAlignment" Value="Top"/>
                    <Setter Property="HorizontalContentAlignment" Value="Center"/>
                    <Setter Property="Background" Value="#ffcc00"/>
                </Style>
            </Grid.Resources>

            <telerik:RadGridView MergedCellsStyle="{StaticResource GridViewMergedCellsStyle}" />

If you are using Implicit Themes, you should base the style on the one defined for the corresponding theme.

Setting MergedCellsStyleSelector

You could also use RadGridView's MergedCellsStyleSelector property to style merged cells differently based on a specific condition. More details about how this can be achieved can be found in the MergedCellsStyleSelector article.

See Also