I want to use RadGridView as a simple Listbox but with built in editing capability, like a File Explorer file list in which you can rename the files.
I think I've worked most of it out like removing all of the surrounding borders and gridlines, disabling the icon row and removing the cell focus rectangle, but I'm not sure how to modify the in place editing functionality.
I want to disable editing via overwriting the text, and I don't want pressing enter during editing to move edit mode on to the next cell down. And after editing I do not want using the arrow keys to move edit mode to other cells. The only edit support I want to keep is entering edit mode either programatically (which will be via a context menu item), or by pressing the F2 hotkey.
I've tried handling PreparingCellForEdit but the event args doesn't seems to indicate what triggered the edit, which makes cancelling particular edit modes impossible.
I think I've worked most of it out like removing all of the surrounding borders and gridlines, disabling the icon row and removing the cell focus rectangle, but I'm not sure how to modify the in place editing functionality.
I want to disable editing via overwriting the text, and I don't want pressing enter during editing to move edit mode on to the next cell down. And after editing I do not want using the arrow keys to move edit mode to other cells. The only edit support I want to keep is entering edit mode either programatically (which will be via a context menu item), or by pressing the F2 hotkey.
I've tried handling PreparingCellForEdit but the event args doesn't seems to indicate what triggered the edit, which makes cancelling particular edit modes impossible.
5 Answers, 1 is accepted
0
Hello Bob,
Nik
the Telerik team
You can create a custom Keyboard provider that will specify the needed actions on the necessary key inputs.
You can see how this can be achieved here.
Hope it helps!
Nik
the Telerik team
Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.
0
Bob
Top achievements
Rank 1
answered on 02 Apr 2013, 12:04 PM
Thanks. I've had a look at the page you linked and I've worked out how to disable automatically editing the next cell down when you press enter.
What I've been looking at now is how to disable editing when the selected cell is clicked on or when a cell is double clicked. Looking at the interface of the RadGridView I don't see any straightforward way to handle this. I've started examining the possibility of detecting when a cell is mouse clicked and cancelling the edit if the mouse button is down, but this is made difficult by the fact that most of the standard mouse events don't seem to fire at all. I'm currently looking for a set of Preview<whatever> events that will enable me to identify the cell edit scenario that I'm attempting to disable, but it's starting to look nasty already.
I still haven't got a solution to the issue of disabling edit mode when the user starts typing either.
Do you have any suggestions for how best to proceed?
What I've been looking at now is how to disable editing when the selected cell is clicked on or when a cell is double clicked. Looking at the interface of the RadGridView I don't see any straightforward way to handle this. I've started examining the possibility of detecting when a cell is mouse clicked and cancelling the edit if the mouse button is down, but this is made difficult by the fact that most of the standard mouse events don't seem to fire at all. I'm currently looking for a set of Preview<whatever> events that will enable me to identify the cell edit scenario that I'm attempting to disable, but it's starting to look nasty already.
I still haven't got a solution to the issue of disabling edit mode when the user starts typing either.
Do you have any suggestions for how best to proceed?
0
Bob
Top achievements
Rank 1
answered on 02 Apr 2013, 12:32 PM
I've managed to disable edit mode on clicking or double clicking the cell using the following code.
So now I'm just left with disabling edit mode for the current cell when the user starts typing.
private
void
PlainListGridView_PreviewMouseLeftButtonDown(
object
sender, MouseButtonEventArgs e)
{
Mouse.Capture(_plainListGridView);
_mouseLeftButtonDown =
true
;
}
private
void
PlainListGridView_PreviewMouseLeftButtonUp(
object
sender, MouseButtonEventArgs e)
{
Mouse.Capture(
null
);
_mouseLeftButtonDown =
false
;
}
private
void
PlainListGridView_BeginningEdit(
object
sender, GridViewBeginningEditRoutedEventArgs e)
{
if
(_mouseLeftButtonDown)
{
e.Cancel =
true
;
}
}
private
bool
_mouseLeftButtonDown;
So now I'm just left with disabling edit mode for the current cell when the user starts typing.
0
Bob
Top achievements
Rank 1
answered on 02 Apr 2013, 03:41 PM
After a bit of messing around I've come up with something I'm happy with. So here it is, a RadDataGrid subclassed to behave like a simple ListView but with built in editing support suitable for use as a File Explorer style view.
First the subclass:
Here is the CustomKeyboardCommandProvider:
Finally here is how you use it in XAML:
Thanks for the help. If you can see any improvements please let me know.
First the subclass:
class
SimpleRadGridView : Telerik.Windows.Controls.RadGridView
{
public
SimpleRadGridView()
{
// Inherit the base classes style.
Style baseStyle = (Style)FindResource(
"RadGridViewStyle"
);
Style thisStyle =
new
Style(
typeof
(SimpleRadGridView), baseStyle);
Resources.Add(
typeof
(SimpleRadGridView), thisStyle);
// Provide a subclassed KeyboardCommandProvider to override keyboard support.
KeyboardCommandProvider =
new
CustomKeyboardCommandProvider(
this
);
// Handle several events to further modify keyboard support.
CurrentCellChanged += OnRadGridView_CurrentCellChanged;
BeginningEdit += OnRadGridView_BeginningEdit;
// Example of how to handle the item that was double clicked or was selected when user
// pressed Enter. (This handler would normally be attached by an external client).
RowActivated += OnRadGridView_RowActivated;
}
private
void
OnRadGridView_CurrentCellChanged(
object
sender, GridViewCurrentCellChangedEventArgs e)
{
// Enforce that the Name column is always selected. This ensures that F2 always edits the
// Name cell since attempting to edit the icon column is undesirable.
GridViewCellInfo currentCell = CurrentCellInfo;
if
(currentCell !=
null
&& currentCell.Column !=
null
&&
currentCell.Column.UniqueName !=
"Name"
)
{
GridViewCellInfo newCell =
new
GridViewCellInfo(currentCell.Item, Columns[
"Name"
]);
CurrentCellInfo = newCell;
}
}
private
void
OnRadGridView_BeginningEdit(
object
sender, GridViewBeginningEditRoutedEventArgs e)
{
// Disables entering edit mode by any means other than F2.
if
(!Keyboard.IsKeyDown(Key.F2))
{
e.Cancel =
true
;
}
}
private
void
OnRadGridView_RowActivated(
object
sender, RowEventArgs e)
{
Trace.WriteLine(
"Activated "
+ (CurrentItem
as
ProjectItem).Name);
}
}
Here is the CustomKeyboardCommandProvider:
internal
class
CustomKeyboardCommandProvider : DefaultKeyboardCommandProvider
{
public
CustomKeyboardCommandProvider(GridViewDataControl grid) :
base
(grid)
{
_grid = grid;
}
public
override
IEnumerable<ICommand> ProvideCommandsForKey(Key key)
{
List<ICommand> commandsToExecute =
base
.ProvideCommandsForKey(key).ToList();
if
(key == Key.Enter)
{
commandsToExecute.Clear();
if
(_grid.CurrentCell.IsInEditMode)
{
// When Enter is pressed during the editing of a cell the default behaviour is
// to commit the edit then move down and edit the next cell. This code commits
// the edit but disables moving to the next cell.
commandsToExecute.Add(RadGridViewCommands.CommitEdit);
}
else
{
// When Enter is pressed at other times the default behaviour is to move to the
// next row. This code just activates the current row instead.
commandsToExecute.Add(RadGridViewCommands.ActivateRow);
}
}
else
if
(key == Key.Up || key == Key.Down)
{
// After a row has been edited the default behaviour is that moving to another
// row using the keyboard automatically places that row in edit mode. This
// disables that behaviour.
commandsToExecute.Remove(RadGridViewCommands.BeginEdit);
}
return
commandsToExecute;
}
private
readonly
GridViewDataControl _grid;
}
Finally here is how you use it in XAML:
<
rgv:SimpleRadGridView
x:Name
=
"_plainListGridView"
ItemsSource
=
"{Binding ProjectItems}"
IsSynchronizedWithCurrentItem
=
"True"
AutoGenerateColumns
=
"False"
ShowGroupPanel
=
"False"
ShowColumnHeaders
=
"False"
RowIndicatorVisibility
=
"Collapsed"
CanUserResizeColumns
=
"False"
GridLinesVisibility
=
"None"
>
<
tk:RadGridView.Columns
>
<
tk:GridViewImageColumn
DataMemberBinding
=
"{Binding ImageUrl}"
UniqueName
=
"ImageUrl"
ImageWidth
=
"16"
ImageHeight
=
"16"
Width
=
"24"
/>
<
tk:GridViewDataColumn
DataMemberBinding
=
"{Binding Name}"
UniqueName
=
"Name"
/>
</
tk:RadGridView.Columns
>
</
rgv:SimpleRadGridView
>
Thanks for the help. If you can see any improvements please let me know.
0
Hello Bob,
Nik
the Telerik team
The approach looks quite good. Glad you worked it out!
Greetings,Nik
the Telerik team
Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.