Skip to main content Skip to footer

C1FlexGrid : Cell Navigation via Arrow Keys

Many a times we have requirement of navigating in grid cells via Keyboard Arrow Keys.

Requirement Analysis

One such requirement with the Arrow Keys is such that : 1. When the cursor reaches the Left most Edge of a Cell then the focus shifts to the next cell on the left hand side. 2. When the cursor reaches the Right most Edge of a Cell then the focus shifts to the next cell on the right hand side. 3. When the cursor is not in any of the above described states and is positioned inside a cell, currently in Edit Mode, then it should navigate within the cell text with the help of Arrow Keys. In this blog post, we will discuss the same in our very own ComponentOne FlexGrid for Winforms. Refer to the image below to get an idea of what functionality we will achieve at the end. Flex_CellNavigation

Implementation Technique

Following is a summary of the implementation steps followed: 1. Handle the KeyDownEdit event of the C1FlexGrid. 2. Assign TextBox as an Editor to the currently selected cell in the grid. 3. Check if the right most edge or the left most edge of the cell is reached (that is, if the cursor is placed at the end of the textbox's text or at the start). 4. Accordingly, shift the focus of the cursor or navigate inside the cell. The implementation is rather plain and simple as compared to the requirement though ;) Here you go:


private void c1FlexGrid1_KeyDownEdit(object sender, C1.Win.C1FlexGrid.KeyEditEventArgs e)  
{  
//Get the current cell's Editor As a TextBox  
TextBox tb = (TextBox)this.C1FlexGrid1.Editor;  
if (tb.SelectionLength == 0)  
{  
    //If the Caret is at the end of the Text (right edge) in TextBox  
    if (tb.SelectionStart == tb.Text.Length)  
    {  
        //then on the press of Right arrow key  
        //the cursor should move to the next column in same row  
        if (e.KeyData == Keys.Right)  
        {  
            if (e.Col < C1FlexGrid1.Cols.Count-1)  
            {  
                C1FlexGrid1.Select(e.Row, e.Col + 1);  
            }  
            else  
            {  
                //if it is the last column in the grid then end editing  
                C1FlexGrid1.Select(e.Row, e.Col);  
                C1FlexGrid1.FinishEditing();  
            }  
        }  
        //If the Caret is at the start of the Text (left edge) in TextBox  
    }  
    else if (tb.SelectionStart == 0)  
    {  
        //then on the press of Left arrow key  
        //the cursor should move to the previous column in the same row  
        if (e.KeyData == Keys.Left)  
        {  
            if (e.Col > 1)  
            {  
                C1FlexGrid1.Select(e.Row, e.Col - 1);  
            }  
            else  
            {  
                //if it is the first column in the grid then end editing  
                C1FlexGrid1.Select(e.Row, e.Col);  
                C1FlexGrid1.FinishEditing();  
            }  
        }  
    }  
}  
}  


Download Sample CS Download Sample VB

MESCIUS inc.

comments powered by Disqus