如何在 Vaadin 8 的 Grid 中使用 Vaadin Action Framework
How to use Vaadin Action Framework in Grid of Vaadin 8
使用 Vaadin 的 Table class 可以将动作处理程序添加到 table。
例如,在以前的 Vaadin 版本中,当用户在 table 区域内右键单击时,以下 2 个选项可能会显示在屏幕上:
Table aTable=new Table();
aTable.addActionHandler(new Action.Handler(){
public Action[] getActions(Object target, Object sender)
{
//example, that shows 2 options
return new Action[] {new Action("Option 1"), new Action("Option 2")};
public void handleAction(Action action, Object sender, Object target)
{//just prints action name for this example
System.out.println("Action:"+action);
}
});
Action.Handler 存在于 Vaadin 8 中,但是无法将 Action.Handler 添加到 Vaadin 8 中的网格,我也没有找到创建上下文菜单的任何其他方法。
在 Grid 中使用 Action Framework 的方法是什么?
Grid 是否有任何其他方法来创建上下文菜单?
也就是说,上面的例子会怎么写呢
现有文章和答案(例如 ) do not cover the topic above, and it is not documented in Vaadin docs (https://vaadin.com/docs/-/part/framework/components/components-grid.html)。
您可以使用 vaadin-context-menu add-on introduced since Vaadin 7.6 (online demo and github source)。理论上它可以支持任何组件,但对于网格我们将使用专用的 GridContextMenu
(记得重新编译你的 widgetset)。
依赖关系:
<dependency>
<groupId>com.vaadin</groupId>
<artifactId>vaadin-context-menu</artifactId>
<version>2.0.0</version>
</dependency>
实施:
import com.vaadin.contextmenu.GridContextMenu;
import com.vaadin.icons.VaadinIcons;
import com.vaadin.ui.Grid;
import com.vaadin.ui.Notification;
import com.vaadin.ui.UI;
import com.vaadin.ui.VerticalLayout;
public class MyUi extends UI {
@Override
protected void init(VaadinRequest request) {
// basic grid setup
Grid<Person> grid = new Grid<>(Person.class);
grid.getColumns().forEach(column -> column.setHidable(true).setSortable(true));
grid.setItems(
new Person("Darth", "Vader"),
new Person("Luke", "Skywalkaer"),
new Person("Java", "De-Hut")
);
// grid context menu setup
Random random = new Random();
GridContextMenu<Person> contextMenu = new GridContextMenu<>(grid);
// handle header right-click
contextMenu.addGridHeaderContextMenuListener(event -> {
contextMenu.removeItems();
contextMenu.addItem("Hide", VaadinIcons.EYE_SLASH, selectedMenuItem -> {
event.getColumn().setHidden(true);
});
contextMenu.addItem("Sort", VaadinIcons.LIST_OL, selectedMenuItem -> {
grid.sort(event.getColumn().getId(), SortDirection.values()[random.nextInt(2)]);
});
});
// handle item right-click
contextMenu.addGridBodyContextMenuListener(event -> {
contextMenu.removeItems();
if (event.getItem() != null) {
grid.select((Person) event.getItem());
contextMenu.addItem("Info", VaadinIcons.INFO, selectedMenuItem -> {
Notification.show("Right-clicked item " + event.getItem());
});
}
});
// set UI content
VerticalLayout content = new VerticalLayout();
content.setSizeFull();
content.addComponents(grid);
setContent(content);
}
// basic bean
public static class Person {
private String firstName;
private String lastName;
public Person(String firstName, String lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
public String getFirstName() {
return firstName;
}
public void setFirstName(String firstName) {
this.firstName = firstName;
}
public String getLastName() {
return lastName;
}
public void setLastName(String lastName) {
this.lastName = lastName;
}
@Override
public String toString() {
return "Person{" +
"firstName='" + firstName + '\'' +
", lastName='" + lastName + '\'' +
'}';
}
}
}
结果:
使用 Vaadin 的 Table class 可以将动作处理程序添加到 table。 例如,在以前的 Vaadin 版本中,当用户在 table 区域内右键单击时,以下 2 个选项可能会显示在屏幕上:
Table aTable=new Table();
aTable.addActionHandler(new Action.Handler(){
public Action[] getActions(Object target, Object sender)
{
//example, that shows 2 options
return new Action[] {new Action("Option 1"), new Action("Option 2")};
public void handleAction(Action action, Object sender, Object target)
{//just prints action name for this example
System.out.println("Action:"+action);
}
});
Action.Handler 存在于 Vaadin 8 中,但是无法将 Action.Handler 添加到 Vaadin 8 中的网格,我也没有找到创建上下文菜单的任何其他方法。
在 Grid 中使用 Action Framework 的方法是什么? Grid 是否有任何其他方法来创建上下文菜单? 也就是说,上面的例子会怎么写呢
现有文章和答案(例如
您可以使用 vaadin-context-menu add-on introduced since Vaadin 7.6 (online demo and github source)。理论上它可以支持任何组件,但对于网格我们将使用专用的 GridContextMenu
(记得重新编译你的 widgetset)。
依赖关系:
<dependency>
<groupId>com.vaadin</groupId>
<artifactId>vaadin-context-menu</artifactId>
<version>2.0.0</version>
</dependency>
实施:
import com.vaadin.contextmenu.GridContextMenu;
import com.vaadin.icons.VaadinIcons;
import com.vaadin.ui.Grid;
import com.vaadin.ui.Notification;
import com.vaadin.ui.UI;
import com.vaadin.ui.VerticalLayout;
public class MyUi extends UI {
@Override
protected void init(VaadinRequest request) {
// basic grid setup
Grid<Person> grid = new Grid<>(Person.class);
grid.getColumns().forEach(column -> column.setHidable(true).setSortable(true));
grid.setItems(
new Person("Darth", "Vader"),
new Person("Luke", "Skywalkaer"),
new Person("Java", "De-Hut")
);
// grid context menu setup
Random random = new Random();
GridContextMenu<Person> contextMenu = new GridContextMenu<>(grid);
// handle header right-click
contextMenu.addGridHeaderContextMenuListener(event -> {
contextMenu.removeItems();
contextMenu.addItem("Hide", VaadinIcons.EYE_SLASH, selectedMenuItem -> {
event.getColumn().setHidden(true);
});
contextMenu.addItem("Sort", VaadinIcons.LIST_OL, selectedMenuItem -> {
grid.sort(event.getColumn().getId(), SortDirection.values()[random.nextInt(2)]);
});
});
// handle item right-click
contextMenu.addGridBodyContextMenuListener(event -> {
contextMenu.removeItems();
if (event.getItem() != null) {
grid.select((Person) event.getItem());
contextMenu.addItem("Info", VaadinIcons.INFO, selectedMenuItem -> {
Notification.show("Right-clicked item " + event.getItem());
});
}
});
// set UI content
VerticalLayout content = new VerticalLayout();
content.setSizeFull();
content.addComponents(grid);
setContent(content);
}
// basic bean
public static class Person {
private String firstName;
private String lastName;
public Person(String firstName, String lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
public String getFirstName() {
return firstName;
}
public void setFirstName(String firstName) {
this.firstName = firstName;
}
public String getLastName() {
return lastName;
}
public void setLastName(String lastName) {
this.lastName = lastName;
}
@Override
public String toString() {
return "Person{" +
"firstName='" + firstName + '\'' +
", lastName='" + lastName + '\'' +
'}';
}
}
}
结果: