ScrollPanel out of sync when DisclosurePanel + Virtual Keyboard

105 Views Asked by At

I am not able to find a solution on (mgwt) ScrollPanels and (gwt) DisclosurePanels with (e.g. android) Virtual keyboards.

After using the mobile Virtual Keyboard to enter data into a text field inside a DisclosurePanel (and the Virtual keyboard has disappeared), the ScrollPanel in my app is out of sync with the page. I cannot scroll to the top of the page and there is a blank area at the end of the page representing the size of the Virtual Keyboard. Thus scrolling beyond the end of page is possible, but not to top.

The pages typically have several Disclosure Panels. The out of sync situation does not occur when all such panels on the page are open when input is entered. Correct scrolling is also maintained after if the keyboard is cancelled (i.e. no input given) when popping up.

UI Binder snippet:

    <mgwt:panel.scroll.ScrollPanel ui:field="ascroll">
        <mgwt:panel.flex.FlexPanel>
            <mgwt:header.HeaderPanel>
                <mgwt:header.HeaderTitle ui:field="atitle"/>
            </mgwt:header.HeaderPanel>
            <gwt:DisclosurePanel width="100%">
                <gwt:customHeader>
                    <mgwt:header.HeaderPanel
                        <mgwt:header.HeaderTitle ui:field="anothertitle"/>
                    </mgwt:header.HeaderPanel>
                </gwt:customHeader>
                <mgwt:panel.flex.FlexPanel>
                    <mgwt:form.Form>
                        <mgwt:form.FormEntry>
                            <mgwt:input.MTextBox ui:field="afield"/>
                        </mgwt:form.FormEntry>
                    </mgwt:form.Form>
                </mgwt:panel.flex.FlexPanel>
            </gwt:DisclosurePanel>
        </mgwt:panel.flex.FlexPanel>
    </mgwt:panel.scroll.ScrollPanel>

I use refresh on the ScrollPanel for all open/close of the DisclosurePanels. Works fine. I have tried to do refresh also in the onChange/onFocus events of the fields but to no avail.

ViewPort is set to the following (have also tried/used default getAppSetting()):

        ViewPort viewPort = new MGWTSettings.ViewPort();
    viewPort
        .setWidthToDeviceWidth()
        .setHeightToDeviceHeight()
        .setUserScaleAble(false)
        .setMinimumScale(1.0)
        .setMinimumScale(1.0)
        .setMaximumScale(1.0);

    MGWTSettings settings = new MGWTSettings();
    settings.setViewPort(viewPort);
    settings.setFullscreen(true);
    settings.setFixIOS71BodyBug(true);
    settings.setPreventScrolling(true);
    MGWT.applySettings(settings);

Any suggestions to what I can do to ensure scrolling to be in sync with size of page?

1

There are 1 best solutions below

0
Mike Winter On

I eventually caved in and replaced MGWT ScrollPanel with the GWT ScrollPanel. Needs some mobile css tinkering but works fine.