New to Telerik UI for WinForms? Download free 30-day trial

How to Convert a GridViewCheckBoxColumn to a Custom ToggleSwitch Column

Environment

Product Version Product Author
2022.3.913 RadGridView for WinForms Desislava Yordanova

Description

When RadGridView is bound to a DataSource collection, it automatically generates the columns considering the data type of each field of the source object. Thus, for boolean properties RadGridView generates a GridViewCheckBoxColumn. This article demonstrates how to replace the default GridViewCheckBoxColumn with a custom one that uses RadToggleSwitch.

Default column for boolean properties - "Discontinued"

convert-checkboxcolumn-to-toggleswitchcolumn 001

Solution

It is necessary to create a custom GridViewDataColumn that uses a custom GridDataCellElement containing the RadToggleSwitchElement for managing the boolean property:


private void RadForm1_Load(object sender, EventArgs e)
{ 
    this.productsTableAdapter.Fill(this.nwindDataSet.Products);

    this.radGridView1.DataSource = this.productsBindingSource;
    this.radGridView1.Columns.Remove("Discontinued");

    ToggleSwitchColumn toggleSwitchColumn = new ToggleSwitchColumn("Discontinued");
    this.radGridView1.Columns.Add(toggleSwitchColumn);

    this.radGridView1.BestFitColumns();
}

public class ToggleSwitchCellElement : GridDataCellElement
{
    public ToggleSwitchCellElement(GridViewColumn column, GridRowElement row) : base(column, row)
    {
    }

    private RadToggleSwitchElement toggleSwitchElement;

    protected override void CreateChildElements()
    {
        base.CreateChildElements();

        toggleSwitchElement = new RadToggleSwitchElement();
        toggleSwitchElement.ValueChanged+=toggleSwitchElement_ValueChanged;
        this.Children.Add(toggleSwitchElement);
    }

    private void toggleSwitchElement_ValueChanged(object sender, EventArgs e)
    {
        this.RowInfo.Cells[this.ColumnInfo.Name].Value = this.toggleSwitchElement.Value;
    }

    protected override void SetContentCore(object value)
    {
        if (this.Value != null && this.Value != DBNull.Value)
        {
               toggleSwitchElement.ValueChanged-=toggleSwitchElement_ValueChanged;
            this.toggleSwitchElement.Value = (bool)this.Value;
               toggleSwitchElement.ValueChanged+=toggleSwitchElement_ValueChanged;
        }
    }

    protected override Type ThemeEffectiveType
    {
        get
        {
            return typeof(GridDataCellElement);
        }
    }

    public override bool IsCompatible(GridViewColumn data, object context)
    {
        return data is ToggleSwitchColumn && context is GridDataRowElement;
    }
}

public class ToggleSwitchColumn : GridViewDataColumn
{
    public ToggleSwitchColumn(string fieldName) : base(fieldName)
    {
    }

    public override Type GetCellType(GridViewRowInfo row)
    {
        if (row is GridViewDataRowInfo)
        {
            return typeof(ToggleSwitchCellElement);
        }
        return base.GetCellType(row);
    }
}

Custom ToggleSwitch column - "Discontinued"

convert-checkboxcolumn-to-toggleswitchcolumn 002