Dear Vaadin users / developers!
In my application I would like to display a label (red transparent box) on the top of the content, which when clicked, displays the popup window.
So here is code, that generates the content, shown in the attachments:
int x = ...;
int y = ...;
int width = ...;
int height = ...;
Label label = new Label();
label.setWidth(width, UNITS_PIXELS);
label.setHeight(height, UNITS_PIXELS);
label.addStyleName("mybox");
documentImagePanel.addComponent(label);
ComponentPosition position = documentImagePanel.getPosition(label);
position.setLeft(Float.valueOf(x), UNITS_PIXELS);
position.setTop(Float.valueOf(y), UNITS_PIXELS);
HorizontalLayout popupContent = new HorizontalLayout();
// Fill popupContent with some data
PopupView popupViewComponent = new PopupView(null, popupContent);
documentImagePanel.addComponent(popupViewComponent);
position = documentImagePanel.getPosition(popupViewComponent);
position.setLeft(Float.valueOf(x), UNITS_PIXELS);
position.setTop(Float.valueOf(y), UNITS_PIXELS);
As you see from the code, the popup window should appear with the same left/top offset, as the label. But in practice the popup window is centred at the given point.
The HTML generated for label (box) and popup:
<div class="v-label v-label-mybox mybox" style="height: 56px; width: 60px;"></div>
<div style="left: 34px; top: 82px; z-index: 20000; visibility: visible; position: absolute; ..." class="v-popupview-popup">... </div>
I cannot explain this behaviour. I expect that absolute positioning is the same for any UI component.
I think, this centring is happening in
VPopupView.showPopup()
, but I’ve found no way to switch off this behaviour or customize it.
