When WebView is hardware accelerated, clicking on input field causes keyboard to appear and html is redrawed shifted and duplicated for a moment:
1) When soft keyboard is appearing WebView pans its content to bottom-left, then againt to normal position. Causes short view-able duplication.
2) When changing keyboards (ex. abc->numbers) contents are panned down by keyboard height and then back to normal position. Causes short view-able duplication.
Tested on two Android 4.0 tablets, if hardware accelerations is turned off no such glitches appear.
I failed to found any information on this, has anyone experienced same problem?
So I finally found some solutions:
The entire WebView content moves by layout margin width, so setting it to 0px fixes this problem.
android:windowSoftInputMode="adjustPan" for WebView activity.
Related
I have a situation where disabling scroll on mobile when my cart is turned on causes really weird graphical issue with android firefox toolbar. Cart is a fixed container taking an entire screen.
When toolbar is shown it just stays there and freezes (probably because i just turned off scrolling) but when its hidden and I'll turn on my cart white bar shows up in place of the toolbar picture related, as you can see it's obscuring my buttons as well. I found workaround for that where I make custom --vh unit based on actual screen height.
let vh = window.innerHeight * 0.01;
document.documentElement.style.setProperty('--vh', `${vh}px`);
I disable scroll by ading this on body
overflow-y:hidden;
I was also trying to disable it with different tricks like setting position to fixed or relative but it causes the same bug.
This only happens on firefox android.
Is there a way I can turn off scrolling without causing this, or maybe someone knows how to fix displaying 100vh height on mobile with pure css?
I have a webpapp that require a sticky botton navigation bar that stays at the bottom of the screen. I had taken the easy way out to use
.nav_bar {
width: 100%
position: fixed;
bottom: 0;
}
This has worked for me for all the views in desktop as well as mobile browsers. I had to port it to a webapp and the whole thing seems to break down as soon as I had to pull up the android soft keyboard.
As soon as the soft keyboard in Android is brought up to enter the amount in the text box, it messes up the viewport size of the current and subsequent pages.
Before the keyboard, I checked window.innerHeight and it was 615 which matches the screen size of the phone. After the keyboard is invoked, it suddenly jumps to (644 to 1182 depending on the page length).
Appreciate any help.
Below is the screen grab of the issue.
Try working with soft input methods.
You are using them this way in mafifest file between tag
<activity android:name="ActivityA" android:windowSoftInputMode="adjustResize">
In my AIR mobile application I am trying to resize my application when the softkeyboard is activated so that the bottom of my application will not be covered by the keyboard. From what I have read this is suppose to be the default behavior but I have never been able to get it to work and I have tried everything I have found online, instead the keyboard overlays ontop of the application.
I then decided I would resize my application myself based on the height and y position of the softkeyboard only to find out that the built in AIR methods for determining the height and y position of the keyboard are not correct (YAY). I even tried using a 3rd party ANE for determining the screen height by FreshPlanet and their code does not always return correct values either. I feel like this shouldn't be that hard to figure out but I am stuck. Please help!
TLDR:
How can I resize my application to be the remaining screen space when the softkeyboard is activated?
What renderMode are you using? (in manifest.xml) I found that only cpu is working to get the correct keyboard height.
Also try to set softKeyboardBehavior to none: <softKeyboardBehavior>none</softKeyboardBehavior>
First, it's not a simple question like this quest or this quest.
I have to get soft keyboard height in my project. I used to get device screen height and subtraction it by out app root view height. However, it work correctly until my test using keyboard suggestion. Unfortunately for me, my solution did not right in this case. The number I got alway bigger than the soft keyboard height. I tried to google but fail.
Here's my picture:
I see this debug message frequently in LogCat. When doing swipe or rotating the device for example. The emulator doesn't react to the events then. What does it mean?
In need to test rotation on the emulator but on some versions, when I press CTRL F12 or CTRL F11 nothing happens (well, the device rotates as a whole but not the screen) and I see this message in log. I don't find anything with google either...
Ok, it's PhoneGap specific. I found something in the source code of PhoneGap:
/**
* We are providing this class to detect when the soft keyboard is shown
* and hidden in the web view.
*/
class LinearLayoutSoftKeyboardDetect extends LinearLayout {
private static final String TAG = "SoftKeyboardDetect";
But I'm not doing anything with soft keyboard, I'm just rotating the device. It's a bug maybe?
I can give you the background on this log. There is a bug in Android or maybe they'd call it a lack of feature but there is no event thrown when the keyboard is shown or goes away. This causes a problem for web applications as the keyboard shortens the the screen size. When the screen size becomes smaller then your UI suffers.
In order to be able to react to the keyboard show/hide in PhoneGap Android we implemented the LinearLayoutSoftKeyboardDetect which is basically a LinearLayout but it reacts to changes in the screen size. If you rotate the device the width becomes the height and we can ignore the change but if the height gets dramatically smaller while the width remains the same it is safe to assume there is a keyboard being shown and we throw a show keyboard event. When the height gets dramatically larger while width stays the same we throw a hide keyboard event. Make sense?
This implementation seems affect with the situation -> When native keyboard is pop up it shrink the webview in phonegap. Again demention changes. So it tends to ignore necessary events. I want to detect native keyboard done button press event.