Styling Cell Characters and Spill Text Editing in C1Flexgrid

C1Flexgrid for WinForms is hugely popular for being a flexible control and provides us with almost total control over rendering of its elements. In this blog article, I am going to discuss following customizations in C1Flexgrid :

1. Customize Characters in a Cell
2. Spilling text to adjacent cell while editing. This concept is similar to MS-Excel wherein, the cell text is spilled to adjacent cell while editing.

Customize Characters in a Cell

You may want to change the FontStyle, Size or ForeColor of the characters in a single cell. This can be done using the OwnerDrawCell event of the C1Flexgrid which handles the drawing of characters. To begin with, set the DrawMode of C1Flexgrid to OwnerDraw so that the grid triggers OwnerDrawCell event. For the implementation purpose, consider a cell (with row index 1 and column index 1) containing text "John Smith". Following code snippet can be used to set different FontStyle, Size and ForeColor for individual characters of the Cell Text.

private void c1FlexGrid1_OwnerDrawCell(object sender, C1.Win.C1FlexGrid.OwnerDrawCellEventArgs e)  
<pre>{  
    //Verify Row/Col index  
    if (e.Col == 1 && e.Row == 1)  
    {  
      //Let the grid draw the BackGround and Border of the cell  
      e.DrawCell(C1.Win.C1FlexGrid.DrawCellFlags.Background | C1.Win.C1FlexGrid.DrawCellFlags.Border);  

      if (!(string.IsNullOrEmpty(e.Text)))  
      {  
        //Create an array of brushes and Fonts  
        SolidBrush[] brushes = new SolidBrush[] {  
                                                    new SolidBrush(Color.Red),  
                                                    new SolidBrush(Color.Green),  
                                                    new SolidBrush(Color.Blue),  
                                                    new SolidBrush(Color.Purple)  
                                                };  
        Font[] fonts = new Font[] {  
                                        new Font("Verdana", 10),  
                                        new Font("Tahoma", 12,FontStyle.Underline),  
                                        new Font("Calibri", 8, FontStyle.Bold),  
                                        new Font("Calibri", 12, FontStyle.Italic)  
                                   };  
        Single x = 0;  
        string text = e.Text;  
        //Traverse celltext and set Font/ForeColor.  
        for (int i = 0; i < text.Length; i++)  
        {  
            string character = text[i].ToString();  
            e.Graphics.DrawString(character, fonts[i % fonts.Length], brushes[i % brushes.Length], e.Bounds.X + x, e.Bounds.Y);  

            //Next character needs to be shifted right;  
            //depending on the space occupied by the previous character as per its FontSize/FontStyle  
            x += (e.Graphics.MeasureString(character, this.c1FlexGrid1.Font)).Width;  
         }  
       }  
       //we're done  
       e.Handled = true;  
    }  
}

If you want render RTF text into grid cells, then you may refer to our product sample called RTFGrid (C# and VB).

Spilling Text to Adjacent Cells During Editing

This is yet another common requirement of users to spill a long cell text to the adjacent empty cells. With AllowMergingEnum.Spill available with C1Flexgrid one may certainly achieve the this requirement. However this features works once the editing is complete. Till the time customer is editing, text scrolls within the editor bounds. Now, few customers requested if there can be a solution which provides spilling during the editing operation as well. Well implementation is easier then one can think. All we need to do is handle KeyUpEdit event of C1Flexgrid, calculate the size of string while user enters text; and increase the width of editor accordingly. Following code block shows the implementation for the same.

private void c1FlexGrid1_KeyUpEdit(object sender, C1.Win.C1FlexGrid.KeyEditEventArgs e)  
{  
    //Fetch the editor  
    TextBox tb = this.c1FlexGrid1.Editor as TextBox;  
    if (tb != null)  
    {  
      //Get handle of the textbox  
      Graphics g = Graphics.FromHwnd(tb.Handle);  
      //Fetch the space needed by text as per its FontSize/FontStyle  
      SizeF size = g.MeasureString(tb.Text, tb.Font);  
      //set width of textbox  
      tb.Width = (int)size.Width;  
    }  
}  

This is how cells look with individual character style changed and spill text. Download Sample CS Download Sample VB