如何使用键盘浏览 Vaadin 网格和 select 项目?
How to navigate through Vaadin grid and select an item using keyboard?
我想知道是否可以仅使用键盘箭头键在 Vaadin 网格或树状网格和 select 项目中导航?从我在测试组件时看到的情况来看,默认行为似乎是仅移动到网格中的一个特定单元格或移动到 treegrid 中的特定行。如果用户按下空格键,则可以实现选择。
我试图向网格添加一个 shortcutListener,但它似乎不适用于箭头键。并且网格滚动条不会随着 selected 项目移动。
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??
//..//
}
});
我想我的问题是我不知道如何获取将 selection 移动到其他 cell/row 的事件。
这是代表我面临的问题的图像。只有蓝色边框的项目是使用箭头键 select 编辑的。当用户在没有空格键的情况下按下箭头键(向下或向上)时,我想自动 select 一个项目。
图片取自此处:https://demo.vaadin.com/sampler/#ui/grids-and-trees/grid/features
编辑1:
我正在使用最新版本的 Vaadin - 8.1.6。
编辑2:
我试图添加几个听众,看看我是否至少可以通过使用箭头 up/down 将移动注册到 next/previous 单元格,但没有任何运气。
这是我试过的听众列表:
- addSelectionListener - 仅在按下空格键后注册 selection
或鼠标点击。不完全是我要找的东西。
- addItemClickListener - 只注册 select 鼠标点击。
- addShortcutListener - 注册按下的键,但它不适用于箭头。
是否有任何侦听器可以帮助我解决这个问题?
网格组件具有基本的键盘导航。如果您需要高级选项,就像您提到的那样,用于键盘导航,我强烈建议您测试此插件:
https://vaadin.com/directory/component/gridfastnavigation-add-on
我想知道是否可以仅使用键盘箭头键在 Vaadin 网格或树状网格和 select 项目中导航?从我在测试组件时看到的情况来看,默认行为似乎是仅移动到网格中的一个特定单元格或移动到 treegrid 中的特定行。如果用户按下空格键,则可以实现选择。 我试图向网格添加一个 shortcutListener,但它似乎不适用于箭头键。并且网格滚动条不会随着 selected 项目移动。
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??
//..//
}
});
我想我的问题是我不知道如何获取将 selection 移动到其他 cell/row 的事件。 这是代表我面临的问题的图像。只有蓝色边框的项目是使用箭头键 select 编辑的。当用户在没有空格键的情况下按下箭头键(向下或向上)时,我想自动 select 一个项目。 图片取自此处:https://demo.vaadin.com/sampler/#ui/grids-and-trees/grid/features
编辑1:
我正在使用最新版本的 Vaadin - 8.1.6。
编辑2:
我试图添加几个听众,看看我是否至少可以通过使用箭头 up/down 将移动注册到 next/previous 单元格,但没有任何运气。
这是我试过的听众列表:
- addSelectionListener - 仅在按下空格键后注册 selection 或鼠标点击。不完全是我要找的东西。
- addItemClickListener - 只注册 select 鼠标点击。
- addShortcutListener - 注册按下的键,但它不适用于箭头。
是否有任何侦听器可以帮助我解决这个问题?
网格组件具有基本的键盘导航。如果您需要高级选项,就像您提到的那样,用于键盘导航,我强烈建议您测试此插件:
https://vaadin.com/directory/component/gridfastnavigation-add-on