How to navigate the current cell within the selected ranges like Excel when pressing Enter or Tab key in the GridDataControl?
In Excel, the current cell is navigated towards right for Tab key and down for Enter key within the selected region. You can also achieve the same requirement in the GridDataControl, but it doesn’t have a direct support.
To achieve this, you need to wire the PreviewKeyDown event in ModelLoaded event to handle the key navigation and SelectionChanging event to clear the selection when the current cell is out of the selected region based on the condition with local variable. You can wire these events as shown in the following code example.
C#
public MainWindow()
{
InitializeComponent();
//Wire SelectionChanging event
this.gridDataControl.Model.SelectionChanging += Model_SelectionChanging;
//Wire ModelLoaded event
this.gridDataControl.ModelLoaded += gridDataControl_ModelLoaded;
}
The PreviewKeyDown event for the GridDataControl is wired from the ModelLoaded event as shown in the following code example.
C#
void gridDataControl_ModelLoaded(object sender, EventArgs e)
{
//Wire PreviewKeyDown event
this.gridDataControl.PreviewKeyDown += gridDataControl_PreviewKeyDown;
}
With the help of SelectionChanging event, you can clear the selection when the current cell is clicked outside the selected ranges like Excel as shown in the following code example.
C#
void Model_SelectionChanging(object sender, GridSelectionChangingEventArgs e)
{
//check the moving state of current cell
if (isinmoving)
{
//if the selection is outside of the cell , then the selected ranges is cleared
e.Cancel = true;
//Set the isinmoving state to false
isinmoving = false;
}
}
Now, you can change the navigation behavior of Enter key from right to down like Excel by using the EnterKeyBehaviour.MouseDown in GridDataControl as shown in the following code example.
C#
//Customize the EnterKeyBehaviour in to MouseDown this.gridDataControl.Model.Options.EnterKeyBehaviour = EnterKeyBehaviour.MouseDown;
With the help of the AlphaBend selection, you can achieve the selection format like Excel as shown in the following code example.
C#
//Format of Selection is changed as AlphaBend this.gridDataControl.Model.Options.DrawSelectionOptions = GridDrawSelectionOptions.AlphaBlend;
The above AlphaBend selection is displayed in the GridDataControl as shown in the following screenshot.
Figure 1 : Default position of the current cell with in selected region
You can get the ranges of selected region by using the SelectedRanges property in the GridDataControl. You need to check whether the current cell is maintained within that selected region or not. With the help of CurrencyManager, you can get the current cell’s row and column index in the GridDataControl as shown in the following code example.
C#
void gridDataControl_PreviewKeyDown(object sender, KeyEventArgs e)
{
//Get the selected region by using SelectedRanges property
var range = gridDataControl.Model.SelectedRanges;
//Get the row index of current cell
var rowindex = gridDataControl.Model.CurrencyManager.CurrentCell.RowIndex;
//Get the column index of current cell
var colindex = gridDataControl.Model.CurrencyManager.CurrentCell.ColumnIndex;
// Check whether the pressed is Tab or Enter key
if (e.Key == Key.Tab)
{
//Customize the selection behavior of Tab key
}
else if (e.Key == Key.Enter)
{
//Customize the selection behavior of Enter key
}
}
While pressing the Tab key, the next cell is automatically selected as a current cell and you can decide whether the current cell is inside or outside the selected region by comparing the above current cell row and column index with the SelectedRanges as shown in the following code example.
C#
if (e.Key == Key.Tab)
{
//Need to maintain isinmoving to true if the selection is in moving state while pressing the Tab Key
isinmoving = true;
//Check whether the current cell of a column is exceeded from selected area in to unselected area
if (range.ActiveRange.Right <= colindex)
{
//If the above conditions is satisfied , need to move the selection in to next row at the left position
gridDataControl.Model.CurrencyManager.CurrentCell.MoveTo(rowindex + 1, range.ActiveRange.Left);
e.Handled = true;
}
//Check whether the selection in end of column at selected ranges.
if (range.ActiveRange.Bottom <= rowindex && range.ActiveRange.Right <= colindex)
{
//if the above condition is satisfied , need to move the selection to the top of selected range at the left gridDataControl.Model.CurrencyManager.CurrentCell.MoveTo(range.ActiveRange.Top, range.ActiveRange.Left);
e.Handled = true;
}
}
Similarly, you can also check and handle navigation behavior when the Enter key is pressed as shown in the following code example.
C#
else if (e.Key == Key.Enter)
{
//Need to maintain isinmoving to true if the selection is in moving state while pressing the Enter Key
isinmoving = true;
//Check whether the current row and column index is equal to selected range top and left position
if (range.ActiveRange.Top >= rowindex && range.ActiveRange.Left == colindex)
{
//Move to next row if the above condition is satisfied gridDataControl.Model.CurrencyManager.CurrentCell.MoveTo(range.ActiveRange.Top + 1, range.ActiveRange.Left);
e.Handled = true;
}
//Check whether the current row index with in the selected bottom range and column index should not match end of the selected range
else if (range.ActiveRange.Bottom <= rowindex && range.ActiveRange.Right != colindex)
{
//If the above condition is satisfied ,the selection will move to top of the next column in selected range gridDataControl.Model.CurrencyManager.CurrentCell.MoveTo(range.ActiveRange.Top, colindex+1);
e.Handled = true;
}
//Check whether the enter key is pressed at the end of active range in cell
else if (range.ActiveRange.Bottom <= rowindex && range.ActiveRange.Right <= colindex)
{
//Need to move the selection in to top of the first column gridDataControl.Model.CurrencyManager.CurrentCell.MoveTo(range.ActiveRange.Top, range.ActiveRange.Left);
e.Handled = true;
}
}
You can refer to the following sample link to navigate the current cell within the selected ranges of GridCell in WPF.
Link
