GWT PopupPanel 弹出位置不正确答案

【问题标题】：GWT PopupPanel incorrect popup positionGWT PopupPanel 弹出位置不正确
【发布时间】：2017-10-09 18:34:17
【问题描述】：

我正在使用 GWT PopupPanel 在用户单击按钮时在按钮上方显示一个弹出窗口。

我正在设置弹出窗口的位置并显示如下：

panel.setPopupPosition(leftPos, topPos);
panel.show();

但是，当我在弹出窗口显示后检查其顶部值时，我发现它的位置比我分配的位置略低。

问题可能是 setPopupPosition 改变了传入的值：

// Account for the difference between absolute position and the
// body's positioning context.
left -= Document.get().getBodyOffsetLeft();
top -= Document.get().getBodyOffsetTop();

如何确保 GWT PopupPanel 的位置正是我给它的值？ setPopupPosition() 似乎确实是设置位置的唯一方法，但它对我传入的位置进行了一些操作（这对我的用例来说是不必要的）。

【问题讨论】：

您可以使用直接访问弹出窗口的 DOM 元素样式 - 例如PopupPanel.getElement().getStyle().setPropertyPx("top", topPos);
啊，我试过了，但没有成功（弹出窗口出现在 0,0），但关键是在调用 show() 之后设置这些属性。这对我有用，因为在调用show() 后设置位置时我没有看到其他人提到的弹出“跳转”，但我想知道在调用show() 之前是否有任何方法可以设置位置而不使用setPopupPosition()？随意回答您的建议（请务必在致电show() 后提及这样做，我会接受！
我已经添加了答案。

标签： html css gwt popup popuppanel

【解决方案1】：

您可以使用直接访问 popup 的 DOM 元素来调整 PopupPanel 的位置。但它应该在调用 show() 之后和使弹出窗口可见之前完成。否则，您可能会看到一些“跳跃”效果。示例：

PopupPanel popupPanel = new PopupPanel();
...
// this callback will be called after PopupPanel.show(), but before it is shown
popupPanel.setPopupPositionAndShow(new PositionCallback() {
    @Override
    public void setPosition(int offsetWidth, int offsetHeight) {
        Style style = popupPanel.getElement().getStyle();
        style.setLeft(100, Unit.PX);
        style.setTop(100, Unit.PX);
    }
});

【讨论】：