如何在 Vaadin 网格中导航并使用键盘选择一个项目?

我想知道是否可以通过 Vaadin 网格或树形网格导航并仅使用键盘箭头键选择一个项目?从我在测试组件时看到的情况来看，默认行为似乎要么只移动到网格中的一个特定单元格，要么移动到 treegrid 中的特定行.如果用户按空格键，则可以实现选择.我试图向网格添加一个快捷方式侦听器，但它似乎不适用于箭头键.并且网格滚动条不会随所选项目一起移动.

grid.addShortcutListener(new ShortcutListener("Down", KeyCode.ARROW_DOWN, null) {@覆盖公共无效句柄操作(对象发送者，对象目标){//..//selectedItem = dataSource.get(currentSelectedItemIndex);grid.select(selectedItem);grid.scrollTo(currentSelectedItemIndex);//这似乎没有做任何事情??//..//}});

我想我的问题是我不知道如何获取将选择移动到其他单元格/行的事件.这是代表我面临的问题的图像.使用箭头键选择了只有蓝色边框的项目.当用户在没有空格键的情况下按下箭头键(向下或向上)时，我想自动选择一个项目.图片取自此处:

我正在使用最新版本的 Vaadin - 8.1.6.
我尝试添加几个听众，看看我是否至少可以使用向上/向下箭头将移动注册到下一个/上一个单元格，但没有任何运气.这是我尝试过的听众列表:

• addSelectionListener - 仅在空格键按下后注册选择或鼠标点击.不完全是我要找的.
• addItemClickListener - 只注册鼠标点击的选择.
• addShortcutListener - 注册按下的键，但它不适用于箭头.

是否有任何听众可以帮助我解决这个问题?

解决方案

Grid 组件有基本的键盘导航.如果您需要键盘导航的高级选项(如您所提到的)，我强烈建议您测试此插件:

https://vaadin.com/directory/component/gridfastnavigation-add-on

I'd like to know if it's possible to navigate through Vaadin grid or treegrid and select an item using only keyboard arrow keys? From what i've seen while testing the components, the default behavior seems to be either to move only to one specific cell in grid or to a specific row in treegrid. Selection can be achieved if the user presses spacebar. I've tried to add a shortcutListener to grid but it doesn't seem to work with arrow keys. And the grid scrollbar doesn't move with the selected item.

grid.addShortcutListener(new ShortcutListener("Down", KeyCode.ARROW_DOWN, null) {
    @Override
    public void handleAction(Object sender, Object target) {
        //..//
        selectedItem = dataSource.get(currentSelectedItemIndex);
        grid.select(selectedItem);
        grid.scrollTo(currentSelectedItemIndex); // this doesn't seem to do anything??
        //..//
    }
});

I guess my problem is that i don't know how to acquire event that moves selection to other cell/row. Here's an image to represent the problem which i'm facing. The item that has only blue border was selected using arrow keys. I'd like to select an item automatically when user presses arrow keys (Down or Up) without the spacebar. Image taken from here: https://demo.vaadin.com/sampler/#ui/grids-and-trees/grid/features

Edit1: I'm using latest version of Vaadin - 8.1.6.
Edit2: I tried to add couple of listeners to see if i could at least register the movement to the next/previous cell by using arrow up/down but without any luck. Here's a list of listeners i've tried:

• addSelectionListener - only registers selection after spacebar press or mouse click. Not quite what i'm looking for.
• addItemClickListener - only registers selection from mouse click.
• addShortcutListener - registers pressed key but it doesn't work with arrows.

Is there any listener that could potentially help me with this issue?

解决方案

The Grid component has basic keyboard navigation. If you need advanced options, like you have mentioned, for keyboard navigation, I would warmly recommend to test this add-on:

https://vaadin.com/directory/component/gridfastnavigation-add-on