How to set a Popup to be always visible on the top in GWT

问题

I have a loading popup that I need to display on the top of the page, even if the user scroll down.

What I tried so far is to set the popup position as follows

setPopupPosition(Window.getClientWidth()/2 , 0);

The popup shows up on the absolut top.

回答1:

The situation can be resolved easily if you view it from a different angle: Not the popup position should adjust to the page - instead, the page should scroll behind the centering popup, e.g.:

final ScrollPanel scrollPanel = new ScrollPanel();
RootLayoutPanel.get().add(scrollPanel);
pagePanel = new FlowPanel();
scrollPanel.setWidget(pagePanel);
pagePanel.add(...);

Now add the entire page contents to pagePanel (instead of adding them directly to rootPanel).

Then you can create popups like this:

final PopupPanel popupPanel = new PopupPanel();
popupPanel.add(...);
popupPanel.center();

You'll still have to re-center the popup when the window resizes, but apart from that, the popup will always be at the center in front of the scrolling page.

回答2:

To achieve this you can implement Window.addWindowScrollHandler. It will always be on top whatever you do.

DialogBox dialog = new DialogBox();
dialog.setWidget(...);
Window.addWindowScrollHandler(new ScrollHandler() {
    @Override
    public void onWindowScroll(ScrollEvent event) {
        dialog.setPopupPosition((Window.getClientWidth() - widthOfDialog) / 2, event.getScrollTop());
    }
});

Hope this helps.. Thanks..

回答3:

The solution that worked for me is this

 setPopupPosition(Window.getClientWidth()/2 , Window.getScrollTop());

来源：https://stackoverflow.com/questions/12045546/how-to-set-a-popup-to-be-always-visible-on-the-top-in-gwt

标签

gwt

popup

position