Articles in this section
Category / Section

How to customize the sort icon in WinForms GridControl?

2 mins read

Customize the sort icon

To customize the sort icon in GridControl, the below two options based on which theme that have applied to the grid.

Solution 1:

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

C#

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

 

VB

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

 

Applied metro theme

Solution 2:

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

C#

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();
    }
}

 

VB

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

 

Applied office theme for grid

Samples:

C#: CustomSortIcon_C#

VB: CustomSortIcon_VB

Reference link: https://help.syncfusion.com/windowsforms/grid-control/visual-styles

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied