Vaadin Grid ItemClickListener 无法使用 ImageRenderer 注册对列的点击

Question

我有以下代码，它应该显示一个可点击的图标，该图标打开一个弹出对话框，读出冗长的笔记。

        this.capacityCommentColumn = this.facilityGrid.addColumn(
                    p -> {
                        if (Strings.isNullOrEmpty(p.getCapacityComment())) {
                            return null;
                        } else {
                            return new ThemeResource("img/note.svg");
                        }
                    },
                    new ImageRenderer<>())
                    .setWidth(80)
                    .setCaption("Note");

        this.facilityGrid.addItemClickListener(new ItemClickListener<MapQueryService.RowResult>() {
            @Override
            public void itemClick(Grid.ItemClick<MapQueryService.RowResult> event) {
                if (event.getColumn() == capacityCommentColumn && !Strings.isNullOrEmpty(event.getItem().getCapacityComment())) {
                    final NoteWindow noteWindow = new NoteWindow();
                    noteWindow.txtDescription.setValue("test");
                    noteWindow.show();
                }
            }
        });

问题是代码不响应点击实际图像，只响应外部。你可以在下面看到这一点。知道是否可以使图像可点击吗？

Answer 1

您还需要向 中添加一个点击侦听器Renderer。例如：

Grid<Integer> grid = new Grid();

private void addIconColumn() {
    ImageRenderer<Integer> renderer = new ImageRenderer<>();
    renderer.addClickListener(e -> iconClicked(e.getItem())); // allow clicks on the image

    Grid.Column<Integer, ThemeResource> iconColumn = grid.addColumn(i -> new ThemeResource("img/icon.svg"), renderer)
            .setCaption("Icon");

    grid.addItemClickListener(e -> { // allow clicks on the cell
        if (iconColumn.equals(e.getColumn())) {
            iconClicked(e.getItem());
        }
    });
}

private void iconClicked(Integer i) {
    ... your UI logic here ...
}

你可以在这里看到一个工作示例：https : //github.com/alejandro-du/community-answers/tree/master/click-image-in-grid