GWT popuppanel的静态定位

时间:2011-09-12 10:50:11

标签: gwt popuppanel

我正在使用GWT弹出面板显示在我的jsp页面中垂直堆叠的一些信息。我面临的问题是,一旦弹出面板显示,它就不会保持其设定位置。我正在使用setPopupPosition()设置弹出面板的位置。 但是,每当用户滚动浏览器时,显示的弹出面板会相应地上下移动。它不会保持其显示位置的原始位置。

我已经尝试将css属性设置为弹出面板上应用的(position:fixed;),但它不起作用。我在某处读到,为了静态显示html元素,我们可以使用position:fixed和width:100%来实现。但在我的情况下,我无法将宽度设置为100%,因为我需要弹出面板以显示特定大小。

有没有办法在GWT中实现弹出面板的固定位置?我是否必须听取浏览器的滚动条事件才能确定位置,或者可以采用不同的方式处理。

这是我的一段代码,用于设置弹出式面板在GWT中的位置。

           final PopupPanel simplePopup = new PopupPanel(false);
           _beamMenu = simplePopup;
           rendererDisplay(response, simplePopup,true);
           int left =_beamIcon.getAbsoluteLeft() + _beamIcon.getOffsetWidth() - simplePopup.getOffsetWidth();
           int top = _beamIcon.getAbsoluteTop() - simplePopup.getOffsetHeight();
           simplePopup.setPopupPosition(left, top);

在这方面的任何帮助将受到高度赞赏。

非常感谢, Asheesh

2 个答案:

答案 0 :(得分:4)

添加一个css:position: fixed !important;

答案 1 :(得分:2)

PopupPanel的默认行为应该足够了。您实际上需要position: absolute而不是fixed。 (有关位置类型的说明,请参阅http://www.quirksmode.org/css/position.html,但fixed表示滚动时 float 的显示时间。

您可能遇到的问题是,当您显示PopupPanel时,它会从DOM中的任何位置删除,并添加到RootPanel中:

(这是来自GWT 2.4所以您的确切代码可能非常)

public void show() {
    if (showing) {
        return;
    } else if (isAttached()) {
        // The popup is attached directly to another panel, so we need to remove
        // it from its parent before showing it. This is a weird use case, but
        // since PopupPanel is a Widget, its legal.
        this.removeFromParent();
    }
    resizeAnimation.setState(true, false);
}

...

public void setState(boolean showing, boolean isUnloading) {
    ...
    RootPanel.get().add(curPanel);
    ...
}

因此,虽然position: absolute应该足够,但您的其他顶级窗口小部件也可能是绝对定位的。因此,当您滚动页面时,您可能实际上滚动了其他一个小部件的内容,并且PopupPanel 卡住到外部元素,该元素没有大的偏移高度而不是正在滚动。这就是为什么它似乎具有与使用fixed定位相同的行为(即,始终是浏览器窗口顶部和侧面的XX像素)。

返回并查看您的页面构造并修复其他小部件,您应该没问题。根据我的观察,新的LayoutPanels会在整个地方使用position: absolute,因此您可能需要手动将其设置为relative