Column / Editors / CheckBox
CheckBox

Display Checkbox for Boolean Values

FlexGrid, by default, uses the checkbox editor for representing the Boolean values. That is, when the DataType property of a Row or Column object is set to Bool type, a checkbox appears in the cells and user can toggle the value of an editable cell simply by clicking it. 

To disable this default behavior and display text value instead of a checkbox in a Bool type, you can set the Format property of Row or Column object to string values.

Default Checkbox Checkbox with Text Checkbox with Non-Boolean Value Three-state Checkbox
Default checkbox Checkbox with text Non-boolean checkbox Three state checkbox

Use the code below to set checkbox type editor in a WinForms FlexGrid column and configure it further.

// Set the data type to Boolean (displays the checkbox automatically)
c1FlexGrid1.Cols["Verified"].DataType = typeof(Boolean);    

// Display the string values instead of displaying checkbox
c1FlexGrid1.Cols["Verified"].Format = "Yes;No";
                                        
// Enables text alongside checkbox for the boolean column
c1FlexGrid1.Cols["Verified"].ImageAndText = true;

Display Checkbox for Non-Boolean Values

In unbound mode, you can display a checkbox along with any non-boolean text as well. You can use the SetCellCheck method to add checkbox to any kind of cells. Along with row and column index, this method takes value of CheckEnum enumeration as one of its parameters to specify the state of checkbox at the time of rendering.

Following code demonstrates how you can display checkbox for non-boolean values.

 // Set a two state checkbox in cell (3,2) in checked state
 c1FlexGrid1.SetCellCheck(3, 2, CheckEnum.Checked);                                

Set Checkbox Alignment

To set position of checkbox in the cell, you need to use ImageAlign property of the Row or Column object. This property accepts values from the ImageAlignEnum enumeration which lets you hide, tile, stretch or position the image.

Align the checkbox to display in center of a WinForms FlexGrid column using the code below.

// Align the checkbox in right-center of the cell
c1FlexGrid1.Cols["Verified"].ImageAlign = ImageAlignEnum.RightCenter;                

Change the Checkbox Image

To change icon image of different states of checkbox, you can use the GlyphEnum which can be accessed using the Glyphs property. For more information about changing glyphs, see Custom Glyphs.

You can change the images to be used for various checkbox states in WinForms FlexGrid using the code below.

    // Sets custom images as checkbox icons
    Image imgChk = new Bitmap("../../Resources/Images/checked.png");
    Image imgUnchk = new Bitmap("../../Resources/Images/unchecked.png");
    Image imgGray = new Bitmap("../../Resources/Images/null.png");
    c1FlexGrid1.Glyphs[GlyphEnum.Checked] = imgChk;
    c1FlexGrid1.Glyphs[GlyphEnum.Unchecked] = imgUnchk;
    c1FlexGrid1.Glyphs[GlyphEnum.Grayed] = imgGray;                      

Use Three State Checkbox

In addition to usual two state checkbox, FlexGrid lets you create three state checkbox as well. The simplest way of enabling the third state is through the CheckEnum. While a Boolean checkbox toggles between CheckEnum.Checked and CheckEnum.Unchecked states, the three states of a three state checkbox are represented by CheckEnum.TSChecked, CheckEnum.TSUnchecked, and CheckEnum.TSGrayed. However, in this case by default, user can not go back to null after switching to checked or unchecked state once. In order to cycle a checkbox between three states, you need to handle the ValidateEdit event.

Use the code below to create a three state checkbox in the WinForms FlexGrid.

     private void c1FlexGrid1_ValidateEdit(object sender, ValidateEditEventArgs e)
          {
        if (c1FlexGrid1.Cols[e.Col].Name == "Done")
         {
           e.Cancel = true;
           if (c1FlexGrid1[e.Row, e.Col].Equals(false))
             {
               c1FlexGrid1[e.Row, e.Col] = true;
             }
           else if (c1FlexGrid1[e.Row, e.Col].Equals(true))
             {
                c1FlexGrid1[e.Row, e.Col] = DBNull.Value;
             }
           else if (c1FlexGrid1[e.Row, e.Col].Equals(DBNull.Value))
             {
                c1FlexGrid1[e.Row, e.Col] = false;
             }
         }
      }            
See Also