Row header refers to the fixed row/s on the left hand side of the grid which may or may not contain the caption string. In FlexGrid, by default, the left most column with zero index is allocated for the row header.

Set row header

WinUI FlexGrid control lets you set row header using the RowHeaders property of FlexGrid class. It helps to add row headers in unbound grid. Here, we have added 2 columns in row header and set text in cells of row header.

The code snippet below lets you specify the row header and set the header text:

// set unbound row headers
var rh = flexGrid1.RowHeaders;
rh.Columns.Clear();
rh.Columns.Add(new GridColumn());
rh.Columns.Add(new GridColumn());
for (int c = 0; c < rh.Columns.Count; c++)
{
    for (int r = 0; r < rh.Rows.Count; r++)
    // set row header text
    {
        rh[r, c] = string.Format("Header {0},{1}", c == 0 ? r / 2 : r, c);
        rh[r, 1] = string.Format("Row {0}", r + 1);
    }
    rh.Columns[c].Width = new GridLength(60);
}

Merge row header

FlexGrid provides the AllowMerging property in GridColumn class for Column object which specifies whether it is allowed to merge cells in a particular column (in this case, the row header) or not.

Use the code below to merge row headers in FlexGrid.

// allow merging
flexGrid1.AllowMerging = GridAllowMerging.All;
// allow merging the first fixed column
flexGrid1.RowHeaders.Columns[0].AllowMerging = true;

Wrap row header text

To wrap the text in column header, access the particular row and set its WordWrap property of GridColumn class to true.

Use the code below to wrap header text of the FlexGrid row.

// Wrap row header text
flexGrid1.RowHeaders.Columns[0].WordWrap = true;

Style row header

To style the column header, you can access the RowHeaderBackground property of the FlexGrid class and set a solid color in the background using the SolidColorBrush method, and further, use the RowHeaderFontStyle to set a particular font style.

Some of other properties that can be used to style the column headers are RowHeaderFontFamily, RowHeaderFontSize, RowHeaderFontStyle, RowHeaderFontWeight, RowHeaderForeground etc.

Customize column header of the FlexGrid control using the code below.

// Style row header
SolidColorBrush rowHeaderBrush = new SolidColorBrush(Windows.UI.Color.FromArgb(34, 124, 9, 9));
flexGrid1.RowHeaderBackground = rowHeaderBrush;
flexGrid1.RowHeaderFontStyle = Windows.UI.Text.FontStyle.Italic;