Category / Section
How to customize the clear filter button in Dynamic FilterBarCell in WinForms GridGroupingControl?
4 mins read
Dynamic filter
In order to
customize the filter buttons of dynamic filterbar cell, create the CustomCellModel and CustomCellRenderer which
are inherited from GridTableFilterBarExtCellModel and GridTableFilterBarExtCellRenderer. In
order to customize the filter icons, create the class inherited from GridCellButton and
draw the images as you want on the button and add this button in custom cell
renderer using AddButton method.
Creating CustomCellModel
C#
class GridTableFilterCell : GridTableFilterBarExtCellModel
{
RecordFilterDescriptorCollection recordFilters;
TableDescriptor tableDescriptor;
Table table;
public GridTableFilterCell(Syncfusion.Windows.Forms.Grid.GridModel grid)
: base(grid)
{
//Remove the "(All)" text.
this.SelectAllText = string.Empty;
}
public override GridCellRendererBase CreateRenderer(GridControlBase control)
{
return new GridTableFilterCellRenderer(control, this);
}
} VB
Friend Class GridTableFilterCell Inherits GridTableFilterBarExtCellModel
Private recordFilters As RecordFilterDescriptorCollection
Private tableDescriptor As TableDescriptor
Private table As Table
Public Sub New(ByVal grid As Syncfusion.Windows.Forms.Grid.GridModel)
MyBase.New(grid)
'Remove the "(All)" text.
Me.SelectAllText = String.Empty
End Sub
Public Overrides Function CreateRenderer(ByVal control As GridControlBase) As GridCellRendererBase
Return New GridTableFilterCellRenderer(control, Me)
End Function
End ClassCreating
CustomCellRenderer
C#
public class GridTableFilterCellRenderer : GridTableFilterBarExtCellRenderer
{
Hashtable mouseHoverAtCells = new Hashtable();
public GridTableFilterCellRenderer(GridControlBase grid, GridCellModelBase cellModel) : base(grid, cellModel)
{
//To add button.
AddButton(new CustomFilterIcon(this));
}
}VB
Public Class GridTableFilterCellRenderer Inherits GridTableFilterBarExtCellRenderer
Private mouseHoverAtCells As New Hashtable()
Public Sub New(ByVal grid As GridControlBase, ByVal cellModel As GridCellModelBase)
MyBase.New(grid, cellModel)
'To add button.
AddButton(New CustomFilterIcon(Me))
End Sub
End ClassAdding
CustomFilterImage
C#
class CustomFilterIcon : GridCellButton
{
public CustomFilterIcon(GridCellRendererBase control) : base(control)
{
}
public override void Draw(Graphics g, int rowIndex, int colIndex, bool bActive, GridStyleInfo style)
{
GridTableFilterCellRenderer renderer = (GridTableFilterCellRenderer)Owner;
Bitmap image = null;
bool filteredColumn = false;
foreach (Syncfusion.Grouping.RecordFilterDescriptor filterdesc in renderer.Grid.TableDescriptor.RecordFilters)
{
if (filterdesc.MappingName == (style as GridTableCellStyleInfo).TableCellIdentity.Column.MappingName)
{
filteredColumn = true;
break;
}
}
//Draw the different filter icons based on whether the records are filtered or not.
if (renderer.Model.HasFilter((style as GridTableCellStyleInfo).TableCellIdentity) && filteredColumn)
{
//When records are filtered, this image is drawn.
image = new Bitmap(Image.FromFile(@"..\..\FilteredIcon.png"));
}
else
{
//When records are not filtered, this image is drawn.
image = new Bitmap(Image.FromFile(@"..\..\FilterIcon.png"));
}
g.DrawImage(image, Bounds.X, Bounds.Y, Bounds.Width, Bounds.Height);
}
}VB
Friend Class CustomFilterIcon Inherits GridCellButton
Public Sub New(ByVal control As GridCellRendererBase)
MyBase.New(control)
End Sub
Public Overrides Sub Draw(ByVal g As Graphics, ByVal rowIndex As Integer, ByVal colIndex As Integer, ByVal bActive As Boolean, ByVal style As GridStyleInfo)
MyBase.Draw(g, rowIndex, colIndex, bActive, style)
Dim renderer As GridTableFilterCellRenderer = CType(Owner, GridTableFilterCellRenderer)
Dim image As Bitmap = Nothing
Dim filteredColumn As Boolean = False
For Each filterdesc As Syncfusion.Grouping.RecordFilterDescriptor In renderer.Grid.TableDescriptor.RecordFilters
If filterdesc.MappingName = (TryCast(style, GridTableCellStyleInfo)).TableCellIdentity.Column.MappingName Then
filteredColumn = True
Exit For
End If
Next filterdesc
'Draw the different filter icons based on whether the records are filtered or not.
If renderer.Model.HasFilter((TryCast(style, GridTableCellStyleInfo)).TableCellIdentity) AndAlso filteredColumn Then
'When records are filtered, this image is drawn.
image = New Bitmap(image.FromFile("..\..\FilteredIcon.png"))
Else
'When records are not filtered, this image is drawn.
image = New Bitmap(image.FromFile("..\..\FilterIcon.png"))
End If
g.DrawImage(image, Bounds.X, Bounds.Y, Bounds.Width, Bounds.Height)
End Sub
End ClassAdding
CustomCellModel to grid
C#
GridTableFilterCell filterBarExtCell = new GridTableFilterCell(this.gridGroupingControl1.TableModel);
this.gridGroupingControl1.TableModel.CellModels.Add("DynamicFilter", filterBarExtCell);
this.gridGroupingControl1.TableDescriptor.Appearance.FilterBarCell.CellType = "DynamicFilter";VB
Dim filterBarExtCell As New GridTableFilterCell(Me.gridGroupingControl1.TableModel)
Me.gridGroupingControl1.TableModel.CellModels.Add("DynamicFilter", filterBarExtCell)
Me.gridGroupingControl1.TableDescriptor.Appearance.FilterBarCell.CellType = "DynamicFilter"The screenshot below illustrates the customization of the dynamic filter in GridGroupingControl.


Samples:
C# : Customizing Dynamic FilterBar_CS
VB: Customizing Dynamic FilterBar_VB
Reference Link: Dynamic filter