How - to: Change the Default Keyboard Behavior in RadGridView for Silverlight/ WPF

by XAML Team | Comments 7

RadGridView provides a set of keyboard navigation scenarios that will result in certain consequence of commands to be executed. Thus – and naturally in this case - when clicking on the Del–button will cause deletion of the current item, Ins-button will add a new one into the grid. However, there exists a great possibility that you do not need this pre-coded behavior and you want to predefine it.

In that case you can follow up one of the following two scenarios. The first one is to use the basic interface responsible for the keyboard navigation – IKeyboardCommandProvider and implement your own logic. On utilizing this possibility you will be provided with a more “global” way of changing the behavior of all keys.   However, in this case comes out the requirement to predefine every command. Another – and much easier approach– is to create a custom class that inherits DefaultKeyboardCommandProvider and to override the ProvideCommandsForKey(Key key) method.Thus you will be able to change just a few details and get the desired behavior.  

The provided commands for the grid are as follows:

  • BeginInsert, Delete
  • CommitEdit, BeginEdit, CancelCellEdit, CancelRowEdit;
  • MoveLeft, MoveRight, MoveDown, MoveNext, MovePrevious
  • SelectCurrentItem, SelectCurrentUnit, ExtendSelectionToCurrentUnit
  • ActivateRow
  • ExpandHierarchyItem, CollapseHierarchyItem

All of them are hosted in the class RadGridViewCommands and enable the user to create the desired way of action responding to the usage of a certain key.

However, there are some important notes to be mentioned here. Firstly, once the commands are cleared from the list, the grid is no longer responsible for their handling. And secondly, there is a possibility that some of them may not be completed. For example in case the validation of a certain field fails, no CommitEdit will be executed.

Now having in mind those commands and the hints given above, let us try to produce a real scenario walking through the necessary steps one by one.

1. Set the goal – the default behavior of RadGridView when the CurrentCell is in edit-mode and the Enter-button is clicked is to move down and put the cell below into edit-mode too. However, what we want in this case is just to stay in the same row without editing the next item. Furthermore, another set of actions that we require to change is in the situation of having a GridViewSelectionColumn and clicking the Tab-button. This will cause all the selected rows to be deselected but the current one. Our aim will be every item to stay in the same stay as it has been.

2. Predefine the commands to be executed - at this step we need to create custom class – CustomKeyboardCommandProvider for example, inherit the DefaultKeyboardCommandProvider  and override the method ProvideCommandsForKey(Key key).

  • create the constructor for the class:

public CustomKeyboardCommandProvider(GridViewDataControl grid) : base(grid)

{

    this.parentGrid = grid;

}

 

  • override the ProvideCommandsForKey method:

public override IEnumerable<ICommand> ProvideCommandsForKey(Key key)

{

    List<ICommand> commandsToExecute = base.ProvideCommandsForKey(key).ToList();

 

    if (key == Key.Tab)

    {                         

        commandsToExecute.Remove(RadGridViewCommands.SelectCurrentItem);       

    }

    else if (key == Key.Enter)

    {

        if (parentGrid.CurrentCell.IsInEditMode)

        {

            commandsToExecute.Clear();                            

            commandsToExecute.Remove(RadGridViewCommands.MoveDown);

        }

 

    }

 

    return commandsToExecute;

}

 

3. Set the Keyboard Provider for the application in the main class:

this.playersGrid.KeyboardCommandProvider = new CustomKeyboardCommandProvider(this.playersGrid);

 

And that’s it !

In future we are planning to improve that whole sequence of steps and to enable the user to change the keyboard behavior much easier. So far the idea is to expose some specific properties on DefaultKeyboardCommandProvider facilitating the process and setting them will generate the desired result. 

You can test the newly-developed behavior in the application below:

 

The same sequence of steps is also applicable in WPF.The application for Silverlight can be downloaded from here.


Team Lead,
Telerik XAML Team

7 Comments

Ben Hayat
Excellent approach!
..Ben
Amit
very good. This is what i was looking for.
I hate code-behind
It would be even nicer if we could set the custom keyboard provider in xaml, because then you can assign it to a style and get the behavior on all your grids.

With Regards
Richard
Very good demo.  Makes me wonder how many other goodies I am missing!
Thank you.
Richard
To follow up on my last comment, I altered the overriding method a bit.  I found that in a WPF environment, there were four commands in the commandlist when the Enter key was pressed in Edit mode; CommitEdit, MoveDown, SelectCurrentUnit, and BeginEdit.  I definitely did not want to remove all of them from the list.
My users expect the edit to commit and the cursor to remain in the cell.  However they do not want to begin another edit.  So I removed only those and allowed the other commands to remain. 
Works great, now!
Abhishek Goel
Gr88 Piece of Work.. It Helps me a lot :)
Brad Young
This works and I can see where this could be used for some more advanced scenarios.  However, I guess if I have set CanUserDeleteRows="False" on the grid, I would not have to implement anything to get the Grid to ignore the delete key.

Comments

  1.    
      
      
       
  2. (optional, emails won't be shown on public pages)
  3. (optional)
Read more articles by XAML Team - or - read latest articles in Developer Tools