checkbox styling in checkbox column

Question

Dear Colleagues, question 1.Is it possible to styling the hover state of checkboxes in checkbox column?question2.Is it possible to set a background picture to disable state of checkboxes for example "X" iconThank you in advance!BRBalint

Dhanasekar Mohanraj · Accepted Answer

Hi BalintSzakacs,Please find the response for the reported issue below,

Reported issue

Response

Is it
  possible to styling the hover state of checkboxes in checkbox column?

You can
  achieve your requirement by using SfDataGrid.QueryCheckBoxCellStyle event below
  code snippet,

this.sfDataGrid1.QueryCheckBoxCellStyle
    += SfDataGrid1_QueryCheckBoxCellStyle;
     
    private void SfDataGrid1_QueryCheckBoxCellStyle(object sender,
    Syncfusion.WinForms.DataGrid.Events.QueryCheckBoxCellStyleEventArgs e)
    {
        if (e.Column.MappingName == "Status")
        {
            //
    Customizing the unchecked state checkboxes hover backcolor 
            var uncheckedHoverBackColor = e.Style.GetType().GetProperty("UncheckedHoverBackColor", System.Reflection.BindingFlags.Instance |
    System.Reflection.BindingFlags.NonPublic);
            uncheckedHoverBackColor.SetValue(e.Style,
    Color.Green);
     
            //  Customizing the unchecked state
    checkboxes hover border-color 
            var uncheckedHoverBorderColor = e.Style.GetType().GetProperty("UncheckedHoverBorderColor", System.Reflection.BindingFlags.Instance |
    System.Reflection.BindingFlags.NonPublic);
           
    uncheckedHoverBorderColor.SetValue(e.Style, Color.Yellow);
     
            //  Customizing the checked state checkboxes
    hover backcolor 
            var checkedHoverBackColor = e.Style.GetType().GetProperty("CheckedHoverBackColor", System.Reflection.BindingFlags.Instance |
    System.Reflection.BindingFlags.NonPublic);
           
    checkedHoverBackColor.SetValue(e.Style, Color.Green);
     
            //  Customizing the checked state checkboxes
    hover border-color 
            var checkedHoverBorderColor = e.Style.GetType().GetProperty("CheckedHoverBorderColor", System.Reflection.BindingFlags.Instance |
    System.Reflection.BindingFlags.NonPublic);
            checkedHoverBorderColor.SetValue(e.Style,
    Color.Yellow);
        }
    }

For more
  information related to styling the hovering state of the checkbox, please
  refer to the below knowledge base documentation link,
   
  KB
  Link:  https://www.syncfusion.com/kb/12813/how-to-set-uncheckedhoverback-color-in-gridcheckboxcolumn-of-winforms-datagrid-sfdatgrid

We have
  prepared the sample based on your scenario. Please have a look at this and
  revert us if you have any concerns on this.

Is it possible to
  set a background picture to disable state of checkboxes for example “X” icon

We have already
  published the KB for removing the check box based on the conditions shown
  below,

public
    Form1()
    {
       
    InitializeComponent();
       
    this.sfDataGrid1.DataSource = new OrderInfoCollection().OrdersListDetails;
       
    this.sfDataGrid1.CellRenderers["CheckBox"] = new
    CustomCheckBoxCellRenderer();
    }
     
    public
    class CustomCheckBoxCellRenderer : GridCheckBoxCellRenderer
    {
       
    protected override void OnRender(Graphics paint, Rectangle cellRect, string
    cellValue, CellStyleInfo style, DataColumnBase column, RowColumnIndex
    rowColumnIndex)
       
    {
           
    if (column.GridColumn.MappingName == "IsClosed")
           
    {
               
    DataRowBase dataRow =
    (DataRowBase)column.GetType().GetProperty("DataRow",
    System.Reflection.BindingFlags.Instance | 
                   
    System.Reflection.BindingFlags.NonPublic).GetValue(column);

if ((dataRow.RowData as OrderInfo).Quantity > 50)
                   
    paint.FillRectangle(new SolidBrush(style.BackColor), cellRect);
               
    else
                   
    base.OnRender(paint, cellRect, cellValue, style, column, rowColumnIndex);
           
    }
       
    }
    }

Please refer to the below KB for more information. And you can change the background by using
  this, 
   
  KB Link: https://www.syncfusion.com/kb/12380/how-to-hide-checkboxes-in-a-gridcheckboxcolumn-of-a-row-based-on-value-of-another-column-in

Please have a
  look at this and revert us if you need further assistance with this.

Regards,Dhanasekar M.If this post is helpful, please consider Accepting it as the
solution so that other members can locate it more quickly.Attachment: Sample_2c7f5ff7.zip

Dhanasekar Mohanraj · Answer

Hi BalintSzakacs,Currently, we are checking the feasibility to achieve your requirement. We will check and
update you with further details on September 28, 2022.

We appreciate your patience until then.

Regards,
Dhanasekar M.

BalintSzakacs · Answer

Hi  Dhanasekar M,Thanks for your answer! Realted to 2. ,one more question. Can I set the "EnabledImage", "DisabledImage", and "IndeterminateImage" property of the checkbox in the CheckboxColumn of the sfDataGrid?Thank you in advance!BRBalint

Dhanasekar Mohanraj · Answer

Hi BalintSzakacs,You can achieve your requirement by using a custom renderer
for the check box column using the below code snippet,

this.sfDataGrid1.CellRenderers.Remove("CheckBox");
  this.sfDataGrid1.CellRenderers.Add("CheckBox", new GridCheckBoxCellRendererExt());
  
  public class GridCheckBoxCellRendererExt : GridCheckBoxCellRenderer
  {
     
  protected override void OnRender(Graphics paint, Rectangle cellRect, string cellValue, CellStyleInfo style,
  DataColumnBase column, RowColumnIndex rowColumnIndex)
     
  {
          base.OnRender(paint, cellRect, cellValue, style, column,
  rowColumnIndex);
   
          if (cellValue.ToString() == "True")
              paint.DrawImage((Image.FromFile(@"..\..\Image\Checked.png")), new
  Point(cellRect.X + 41, cellRect.Y + 7));
          else if
  (cellValue.ToString() == "False")
              paint.DrawImage((Image.FromFile(@"..\..\Image\Unchecked.png")), new
  Point(cellRect.X + 41, cellRect.Y + 7));
          else
              paint.DrawImage((Image.FromFile(@"..\..\Image\Intermediate.png")), new
  Point(cellRect.X + 41, cellRect.Y + 7));
     
  }
  }

For more information related to the custom renderer, please refer to the below user
guide documentation link,UG Link: https://help.syncfusion.com/windowsforms/datagrid/columntypes#customize-column-renderer
We have
modified the sample based on your scenario. Please find the sample in the
attachment and let us know if you have any concerns about this.Regards,Dhanasekar M.If this post is helpful, please consider Accepting it as the
solution so that other members can locate it more quickly.Attachment: Sample_dcb59cb1.zip