How to create a FolderBrowser celltype in the WinForms GridControl?

7 mins read

Create FolderBrowser celltype in grid

The cell model does not have the FolderBrowser CellType. To generate the FolderBowser cell, create a custom cell model/renderer that provides the FolderBrowser CellType. To create a custom cell model/renderer, refer to the following example.

Solution

As stated above, this can be achieved by having a custom cell. The CellModel and the CellRenderer are inherited from the GridTextBoxCellModel and the GridTextBoxCellRenderer Classes respectively. It makes use of the Tool's FolderBrowser control.

Creating CellModel

In the custom cell model, the custom cell renderer class object is invoked by the CreateRenderer() override method.

//Deriving the GridTextBoxCellModel 
public class FolderBrowserCellModel : GridTextBoxCellModel
{
    protected FolderBrowserCellModel(SerializationInfo info, StreamingContext context): base(info, context)
    {
        //Set the button bar size.
        base.ButtonBarSize = new Size(20, 20);
    }
    //Constructor for the Derived Class
    public FolderBrowserCellModel(GridModel grid) : base(grid)
    { }
    //Override the CreateRenderer() in the Base class.
    public override GridCellRendererBase CreateRenderer(GridControlBase control)
    {
        //Returns the Custom Renderer Object
        return new FolderBrowserCellRenderer(control, this);
    }
}

'Deriving the GridTextBoxCellModel 
Public Class FolderBrowserCellModel Inherits GridTextBoxCellModel
    Protected Sub New(ByVal info As SerializationInfo, ByVal context As StreamingContext)
         MyBase.New(info, context)
         'Set the button bar size.
         MyBase.ButtonBarSize = New Size(20, 20)
    End Sub
    'Constructor for the Derived Class
    Public Sub New(ByVal grid As GridModel)
         MyBase.New(grid)
    End Sub
    'Override the CreateRenderer() in the Base class.
    Public Overrides Function CreateRenderer(ByVal control As GridControlBase) As GridCellRendererBase
         'Return the Custom Renderer Object
         Return New FolderBrowserCellRenderer(control, Me)
    End Function
End Class

Creating CellRenderer

In the custom cell renderer constructor, the customization of the cell is achieved. The ComboBox button is added to the FolderBrowserCellRenderer.

public class FolderBrowserCellRenderer : GridTextBoxCellRenderer
{
    //FolderBrowser object decleration.
    private Syncfusion.Windows.Forms.FolderBrowser folderBrowser1;
    public FolderBrowserCellRenderer(GridControlBase grid, GridTextBoxCellModel cellModel)
        : base(grid, cellModel)
    {
        //Add the ComboBoxButton to hte Cell's Renderer.
        AddButton(new GridCellComboBoxButton(this));
        //Initialize the folderBrowser1 object.
        this.folderBrowser1 = new Syncfusion.Windows.Forms.FolderBrowser();
    }
}

Public Class FolderBrowserCellRenderer  Inherits GridTextBoxCellRenderer
    'FolderBrowser object decleration.
    Private folderBrowser1 As Syncfusion.Windows.Forms.FolderBrowser
    Public Sub New(ByVal grid As GridControlBase, ByVal cellModel As GridTextBoxCellModel)
         MyBase.New(grid, cellModel)
         'Add the ComboBoxButton to hte Cell's Renderer.
         AddButton(New GridCellComboBoxButton(Me))
         'Initialize the folderBrowser1 object.
         Me.folderBrowser1 = New Syncfusion.Windows.Forms.FolderBrowser()
    End Sub
End Class

Overrides in Custom Cell Renderer class

The following methods help override the FolderBrowserCellRenderer class.

public override void OnPrepareViewStyleInfo(GridPrepareViewStyleInfoEventArgs e)
{
    // Here you can adjust settings that override the default settings from the grid
    e.Style.ShowButtons = GridShowButtons.Show;
    e.Style.Clickable = true;
    e.Style.TextAlign = GridTextAlign.Left;
    e.Style.VerticalAlignment = GridVerticalAlignment.Middle;
    e.Style.WrapText = false;
}
protected override void OnButtonClicked(int rowIndex, int colIndex, int button)
{
    base.OnButtonClicked(rowIndex, colIndex, button);
    try
    {
        if (folderBrowser1.ShowDialog() == DialogResult.OK)
            this.Grid.Model[rowIndex, colIndex].Text = folderBrowser1.DirectoryPath.ToString();
        // Resize the col widths to fit the path..
        this.Grid.Model.ColWidths.ResizeToFit(GridRangeInfo.Col(colIndex), GridResizeToFitOptions.None);
    }
    catch (Exception ex)
    {
        Console.WriteLine(ex.ToString());
    }
}
protected override Rectangle OnLayout(int rowIndex, int colIndex, GridStyleInfo style, Rectangle innerBounds, Rectangle[] buttonsBounds)
{
    // Trace the properties of the cell
    TraceUtil.TraceCurrentMethodInfo(rowIndex, colIndex, style, innerBounds, buttonsBounds);
    // Here you specify where the button should be drawn within the cell.
    Rectangle rightArea = Rectangle.FromLTRB(innerBounds.Right - 20, innerBounds.Top, innerBounds.Right, innerBounds.Bottom);
    buttonsBounds[0] = GridUtil.CenterInRect(rightArea, new Size(20, 20));
    // Here you return the area where the text should be drawn/edited.
    innerBounds.Width -= 20;
    return innerBounds;
}

Public Overrides Sub OnPrepareViewStyleInfo(ByVal e As GridPrepareViewStyleInfoEventArgs)
    ' Here you can adjust settings that override the default settings from the grid
    e.Style.ShowButtons = GridShowButtons.Show
    e.Style.Clickable = True
    e.Style.TextAlign = GridTextAlign.Left
    e.Style.VerticalAlignment = GridVerticalAlignment.Middle
    e.Style.WrapText = False
End Sub
Protected Overrides Sub OnButtonClicked(ByVal rowIndex As Integer, ByVal colIndex As Integer, ByVal button As Integer)
    MyBase.OnButtonClicked(rowIndex, colIndex, button)
   Try
         If folderBrowser1.ShowDialog() = DialogResult.OK Then
              Me.Grid.Model(rowIndex, colIndex).Text = folderBrowser1.DirectoryPath.ToString()
         End If
         ‘Resize the colwidths to fit the path..
         Me.Grid.Model.ColWidths.ResizeToFit(GridRangeInfo.Col(colIndex), GridResizeToFitOptions.None)
         Catch ex As Exception
               Console.WriteLine(ex.ToString())
    End Try
End Sub
Protected Overrides Function OnLayout(ByVal rowIndex As Integer, ByVal colIndex As Integer, ByVal style As GridStyleInfo, ByVal innerBounds As Rectangle, ByVal buttonsBounds() As Rectangle) As Rectangle
    ' Trace the properties of the cell
    TraceUtil.TraceCurrentMethodInfo(rowIndex, colIndex, style, innerBounds, buttonsBounds)
    ' Here you specify where the button should be drawn within the cell.
    Dim rightArea As Rectangle = Rectangle.FromLTRB(innerBounds.Right - 20, innerBounds.Top, innerBounds.Right, innerBounds.Bottom)
    buttonsBounds(0) = GridUtil.CenterInRect(rightArea, New Size(20, 20))
    ‘Here you return the area where the text should be drawn/edited.
    innerBounds.Width -= 20
    Return innerBounds
End Function

Adding CellModel

In the Form_Load method, the custom cell type is added to the CellModel.

//The name given at the argument is used to set the CellType name.
this.gridControl1.CellModels.Add("FolderBrowser", new FolderBrowserCellModel(gridControl1.Model));

‘The name given at the argument is used to set the CellType name.
Me.gridControl1.CellModels.Add("FolderBrowser", New FolderBrowserCellModel(gridControl1.Model))

Assigning CellType

// set the cell type to FolderBrowser 
this.gridControl1[2, 3].CellType = "FolderBrowser";
this.gridControl1[2, 3].Text = "FolderBrowser";

'set the cell type to FolderBrowser 
Me.gridControl1(2, 3).CellType = "FolderBrowser"
Me.gridControl1(2, 3).Text = "FolderBrowser"

Folderbrowser cell in GridControl

Figure 1: FolderBrowser Cell in Grid Control

Samples:

C#: FolderBrowserCell

VB: FolderBrowserCell

Did you find this information helpful?

Yes

Comments (0)

How to create a FolderBrowser celltype in the WinForms GridControl?

Create FolderBrowser celltype in grid

Access denied