GWT: PopupPanel setPopupPositionAndShow() delivers wrong offsetWidth and offsetHeight

StackOverflow https://stackoverflow.com/questions/8054360

  •  24-02-2021
  •  | 
  •  

Pergunta

I have written my own PopupPanel in GWT. I want to show the popup relative to an other widget. My implementation of the class looks like the following:

public class Popover extends PopupPanel implements PositionCallback {

    private static final Binder binder = GWT.create(Binder.class);
    private UIObject relative;

    interface Binder extends UiBinder<Widget, Popover> {
    }

    public Popover() {
        setWidget(binder.createAndBindUi(this));
        setStylePrimaryName("popover");
    }

    public void show(UIObject relative) {

        this.relative = relative;
        setPopupPositionAndShow(this);

    }

    public void setPosition(int offsetWidth, int offsetHeight) {

        if (relative != null) {

            int left = relative.getAbsoluteLeft();
            int top = relative.getAbsoluteTop();
            int width = relative.getOffsetWidth();
            int height = relative.getOffsetHeight();

            int topCenter = top + height / 2 - offsetHeight / 2;


            if (offsetWidth < left) {
                setPopupPosition(left - offsetWidth, topCenter);
            } else {
                setPopupPosition(left + width, topCenter);

            }
        }
    }

}

The problem is that offsetWidth and offsetHeight is always 10?

My Popover.ui.xml looks like the following:

<g:FlowPanel stylePrimaryName="popover">
    <g:FlowPanel stylePrimaryName="arrow" />
    <g:FlowPanel stylePrimaryName="inner">
        <g:Label stylePrimaryName="title" text="New Label" />
        <g:FlowPanel stylePrimaryName="content">
            <g:Label text="Hallo" />
        </g:FlowPanel>
    </g:FlowPanel>
</g:FlowPanel>
Foi útil?

Solução

getOffsetWidth() and getOffsetHeight() only work if the DOM is fully constructed and the container for which you want to get the value is visible and attached.

Why don't you use the showRelativeTo() function of the PopupPanel?

popup.showRelativeTo(SomeWidget);

Outras dicas

To solve this issue, I followed the steps used by PopupPanel's setPopupPositionAndShow(), but I made the positioning step a deferred command. My code didn't extend PopupPanel, hence the popupPanel variable:

popupPanel.setVisible(false);
popupPanel.show();

// Pausing until the event loop is clear appears to give the browser
// sufficient time to apply CSS styling.  We use the popup's offset
// width and height to calculate the display position, but those
// dimensions are not accurate until styling has been applied.
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
   @Override
   public void execute() {
      yourMethodToSetPositionGoesHere(popupPanel);
      popupPanel.setVisible(true);
   }
});
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top