GWT DialogBox centering does not take into account the zoom factor of my cell phone browser
I have a very simple GWT application that collects some data and provides a confirmation dialog when the user clicks the submit button. I create com.google.gwt.user.client.ui.DialogBox, fill it and call its center () method.
In a desktop web browser, the dialog box appears centered correctly. However, in a cell phone browser, centering does not take scaling into account. That is, if I zoomed in on the form and then click Submit, the dialog will focus on the shared page ... not in my current live viewport. If I zoomed very far, the dialog is not displayed at all. The app just seems dead if you're not smart enough to zoom out. Much the same thing happens on the iPhone and my Android phone.
The effect can be seen on the Google demo page at http://gwt.google.com/samples/Showcase/Showcase.html#!CwDialogBox Place the phone in portrait orientation, zoom in on the Showcase dialog, and click. The page will be frozen. You cannot see the pop-up window and you cannot move. The only thing you can do is zoom out.
I would be glad for any solution here. For example, perhaps the dialogue could be somehow centered in my "effective" viewport. Or maybe there is some way to ask the browser to zoom in?
source to share
Well, I didn't figure out how to get information about the actual viewport. That is, what the user sees after they have increased. But the smart solution is to just put the dialog on top of the submit button. Since they just hit the submit button, this should be a reasonable place to display the dialog.
int targetX = submitButton.getAbsoluteLeft() + (submitButton.getOffsetWidth() - dialogBox.getOffsetWidth()) / 2;
int targetY = submitButton.getAbsoluteTop() + (submitButton.getOffsetHeight() - dialogBox.getOffsetHeight()) / 2;
dialogBox.setPopupPosition(targetX, targetY);
source to share