Vaadin获取控件Top、Left、Width、Height的一种方式

通过add event listener的方式获取当前点击的控件的信息。

可依据html中element的属性 https://www.w3school.com.cn/jsref/dom_obj_all.asp

import com.vaadin.flow.dom.DomEvent;
import elemental.json.JsonObject;

Tab tab = new Tab("my tab");
tab.getElement().addEventListener("click", this::handleClick)
    .addEventData("element.offsetTop")
    .addEventData("element.offsetLeft")
    .addEventData("element.offsetWidth")
    .addEventData("element.offsetHeight")
    .addEventData("element.id");

private void handleClick(DomEvent event) {
    JsonObject eventData = event.getEventData();
        double top = eventData.getNumber("element.offsetTop");
        double left = eventData.getNumber("element.offsetLeft");
        double width = eventData.getNumber("element.offsetWidth");
        double height = eventData.getNumber("element.offsetHeight");
        String id = eventData.getString("element.id");
}

另外，修改控件的style可参考https://vaadin.com/components/vaadin-dialog/java-examples中styled content章节。