Vaadin中单击的相对坐标

Question

我正在使用Vaadin 14构建一个应用程序，要求用户单击图像，然后进一步处理单击的坐标。Vaadin似乎只提供相对于用户屏幕或浏览器的点击坐标。我的应用程序需要坐标相对于组件。有办法做到这一点吗？

Answer 1

答案是通过Element API并使用image.getElement().addEventListener("click", ...).addEventData(...)，从而将必要的信息从浏览器传递到服务器。

就我而言：

Image image = ...
image.getElement().addEventListener("click", this::handleClick)
.addEventData("event.offsetX")
.addEventData("event.offsetY");
private void handleClick(DomEvent event) {
JsonObject eventData = event.getEventData();
double x = eventData.getNumber("event.offsetX");
double y = eventData.getNumber("event.offsetY");
String text = "X: " + x + ", Y: " + y;
System.out.println(text);
}

更多信息：https://vaadin.com/docs/v14/flow/element-api/tutorial-event-listener