How to customize the sort icon in WinForms GridControl?

Customize the sort icon

To customize the sort icon in the WinForms GridControl, the following two options are based on the theme that has been applied to the grid.

Solution 1:

If you are using the Metro theme for your application, then you can simply use the GridMetroColors class for customizing sort icon colors as per the code example below.

GridMetroColors colors = new GridMetroColors();
colors.SortIconColor.HoverSortIconColor = Color.Red;
colors.SortIconColor.NormalSortIconColor = Color.Red;
this.gridControl1.SetMetroStyle(colors);

Dim colors As New GridMetroColors()
colors.SortIconColor.HoverSortIconColor = Color.Red
colors.SortIconColor.NormalSortIconColor = Color.Red
Me.gridControl1.SetMetroStyle(colors)

The output is as follows

Applied metro theme

Solution 2:

If you are using other office themes for the grid, you can customize the sort icon by using the DrawCell event.

void gridControl1_DrawCell(object sender, GridDrawCellEventArgs e)
{
    e.Cancel = true;
    e.Renderer.Draw(e.Graphics, e.Bounds, e.RowIndex, e.ColIndex, e.Style);
    if (e.Style.Tag != null)
    {
        string s = e.Style.ValueMember;
        ListSortDirection listSortDirection = (ListSortDirection)e.Style.Tag;
        int dig = (!string.IsNullOrEmpty(s) && s.Length > 1) ? 2 : 1;
        Rectangle rect = new Rectangle(e.Bounds.X + e.Bounds.Width / 3, e.Bounds.Y, e.Bounds.Width, e.Bounds.Height);// e.Bounds;
        rect = GridUtil.CenterInRect(rect, new Size(8 * dig, 8));
        int i2 = Math.Max(0, (rect.Height - 6) / 2);
        rect.Inflate(-i2, -i2);
        rect.Offset(7, 0);
        Pen pen1 = new Pen(Color.Red);
        GridTriangleDirection triangleDirection = listSortDirection == ListSortDirection.Ascending ? GridTriangleDirection.Down : GridTriangleDirection.Up;
        GridPaintTriangle.Paint(e.Graphics, rect, triangleDirection, Brushes.Red, pen1, true);
        pen1.Dispose();
    }
}

Private Sub gridControl1_DrawCell(ByVal sender As Object, ByVal e As GridDrawCellEventArgs)
 e.Cancel = True
 e.Renderer.Draw(e.Graphics, e.Bounds, e.RowIndex, e.ColIndex, e.Style)
 If e.Style.Tag IsNot Nothing Then
  Dim s As String = e.Style.ValueMember
  Dim listSortDirection As ListSortDirection = CType(e.Style.Tag, ListSortDirection)
  Dim dig As Integer = If(((Not String.IsNullOrEmpty(s)) AndAlso s.Length > 1), 2, 1)
  Dim rect As New Rectangle(e.Bounds.X + e.Bounds.Width \ 3, e.Bounds.Y, e.Bounds.Width, e.Bounds.Height) ' e.Bounds;
  rect = GridUtil.CenterInRect(rect, New Size(8 * dig, 8))
  Dim i2 As Integer = Math.Max(0, (rect.Height - 6) / 2)
  rect.Inflate(-i2, -i2)
  rect.Offset(7, 0)
  Dim pen1 As New Pen(Color.Red)
  Dim triangleDirection As GridTriangleDirection = If(listSortDirection = ListSortDirection.Ascending, GridTriangleDirection.Down, GridTriangleDirection.Up)
  GridPaintTriangle.Paint(e.Graphics, rect, triangleDirection, Brushes.Red, pen1, True)
  pen1.Dispose()
 End If
End Sub