[Android] StageWebView HTML text input does not pan app when softkeyboard is displayed

[DaveCates]

The softkeyboard covers up content when selecting a text input field within an HTML page via the StageWebView.

The StageWebView content should pan so that the text field being targeted in always visible so users can see which text they are entering. This panning should be handled automatically by Air.

I've listed this as a bug on Bugbase: Bug#4159718 - [Android] StageWebView HTML text input does not pan app when softkeyboard is displayed

This a real show stopper for us on a major app at the moment and I can't believe it's not been fixed. Looking at this thread on the Starling forum, from 2 years ago, it seems to have been an issue for a very long time! http://forum.starling-framework.org/topic/soft-keyboard-goes-over-stagewebview

Just wondered if anyone else has experienced this and would like to either offer a solution/workaround or vote for the bug

Thanks.

[lemmingDev]

I have this issue too, and it's still a problem with AIR 32.0 in Nov 2018

Hopefully someone on the team will think this is worthy of fixing and get it sorted for us...

[marcanw]

I had the same issue on android and fix it with this: GitHub - freshplanet/ANE-KeyboardSize: Air Native Extension (Android) for measuring soft keyboard si...

I use it to monitor the soft keyboard and adapt the viewport accordingly.

A bit of a hack but it works fine.

[lemmingDev]

Thanks for the reply

How exactly are you adjusting the viewport?

Just moving the whole thing up?

Thanks

[marcanw]

I change the height of the viewport

Here is my code:

private var checkKBsi:uint;

private var monitoringKB:Boolean= false;

private function set monitorKB(on:Boolean)

{

     if(!gvars.isAndroid) return;

     clearInterval(checkKBsi);

     stage.removeEventListener(Event.DEACTIVATE, deactivate);

     stage.removeEventListener(Event.ACTIVATE, activate);

     if(on)

     {

          stage.addEventListener(Event.DEACTIVATE, deactivate);

          var MK:MeasureKeyboard = MeasureKeyboard.getInstance();

          checkKBsi = setInterval(onKeyboardChange, 600);

          function onKeyboardChange( ):void

          {

               var kby:int = MK.getKeyboardY();

               if(kby != webView.viewPort.height) webView.viewPort = new Rectangle(0, 0,w, kby);

          }

     }

     else if(h != webView.viewPort.height) webView.viewPort = new Rectangle(0, 0,w, h);

     monitoringKB = on;

}

private function deactivate(e:*)

{

     stage.removeEventListener(Event.DEACTIVATE, deactivate);

     clearInterval(checkKBsi);

     stage.addEventListener(Event.ACTIVATE, activate);

}

private function activate(e:*)

{

     monitorKB = monitoringKB;

}

I optimized a bit by setting monitorKB to true when the user is in an input field. So it means that you have to setup a js -> as3 communication (via LOCATION_CHANGING).

If you haven't set up the LOCATION_CHANGING I wouldn't bother and just set monitorKB to true when the stagewebview is on the stage.

Hope it helps.

[lemmingDev]

Turns out that the panning works fine without doing anything special all long as you are rendering on the CPU.

I had changed it to GPU, and that's why it wasn't working.

[marcanw]

Rendering on direct here, CPU would be the only mode that handle keyboard panning.