React | safari body scroll lock while modal on iOS devices (15.4) - ios

how to disable body scroll while modal window is open?
when you touch bottom part of iphone's screen - navigation panel appears (it's native safari behaviour). this event (resize) change viewport and allow to scroll.
I tried to implement a lot of solutions but I got a body which I can scroll or black navigation panel without any button and x2 height than usual

Related

How to mimic iOS Control Center behaviour

I'd like to mimic the iOS Control Center behaviour. I have a button in the bottom of my screen, and I'd like to reveal a second view controller as the user slides from that button to the top.
The behaviour is also similiar to the iOS and the Android status bar. What's the best solution to achieve this?

stop keyboard from shifting app up and enabling scroll in IOS 7/8

We have an app that is a fixed width and height and does not allow the user to scroll. As part of this app we have a navbar that is fixed to the screen under the status area. This all works great.
The problem is that when a keyboard is shown, it shifts our app window up to make room for the keyboard. At this point its possible to scroll our app and the titlebar which should be fixed to the top is no longer on screen.
Ideally the keyboard would still show, but our app window would resize so its not as tall, but items fixed to the top are still fixed to the top. also, you should not be able to scroll the window at this point.
So as Sani mentioned in a comment the Iconic keyboard plugin does in fact do what I'm looking for:
https://github.com/driftyco/ionic-plugins-keyboard
using:
cordova.plugins.Keyboard.disableScroll(true);
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

IOS keyboard changed its animation

I have an ios app, and it's responsive to keyboard appearance.
Before, the keyboard used to slide in from the bottom up
now it appears from the left corner of the top of the keyboard frame down
What happened to create this change? I cannot find any methods that control how the keyboard becomes visible on the screen

Adjust UIPopover when the iPad keypad splits

I have an iPad app in landscape orientation.
Which has multiple UIButtons on the screen from top to bottom which present a UIPopover with a TextView in it.
When the keyboard appears and covers the button, the popover moves over the keyboard, and comes back nicely when the keyboard is dismissed.
but when the keyboard is suddenly put into split mode and if the popover was for a button below the keyboard then the popover comes back and goes behind one of the halves of the keyboard.
How should such situation be handled gracefully ?
Would creating a transparent view/button that you launch the Popover view from work? Then you could move the button to where ever you want.

Stopping the iPad keyboard from scrolling the webpage too much

It looks like the Safari keyboard works like this on iPads...
If the webpage originally reaches the bottom of the screen, when the keyboard appears it never scrolls past the bottom of the webpage.
If the webpage originally doesn't reach the bottom of the screen and the textfield that has the focus is more than halfway down the screen, it scrolls the webpage so that the current textfield is now halfway down the screen and doesn't care if the area below the original webpage is showing.
Basically I want to have a webpage that doesn't fill the screen vertically and yet I don't want the keyboard to cause the screen to scroll past the bottom of the webpage because that would hide the top part of the webpage and instead show the blank area below the webpage.
In portrait mode on an iPad the following webpage is always showing even when a textfield is active and the keyboard is showing:
http://sky-walker.net/temp/ipad/a
But when you view that webpage in landscape mode and select the bottom textfield, the webpage scrolls so that the bottom textfield is halfway up the screen. I want it to be at the bottom of the screen.
http://sky-walker.net/temp/ipad/b
In landscape mode the previous link fills the entire screen and so if you click on the bottom textfield (after scrolling) the textfield appears at the bottom of the screen when the keyboard is visible rather than the screen scrolling until the textfield is halfway down the screen.
In portrait mode the previous link doesn't originally fill the screen so if you click on the bottom textfield (making the keyboard appear) it scrolls up so that it is halfway up the screen.
http://sky-walker.net/temp/ipad/d
The final link fills the entire screen for portrait mode as well and when the bottom textfield is selected it doesnt scroll past the bottom of the webpage when the keyboard becomes visible.
Maybe what it is doing when the webpage isn't filling the screen is that it is remembering the empty space at the bottom and then it scrolls up (hiding the top) when the keyboard is visible. I want it to forget about the empty space at the bottom when the keyboard appears.
I faced a very similar issue. Here's what I do.
I subscribe to UIKeyboardWillShowNotification to get the keyboard size then when the scroll view scrolls up more than the keyboard height then I set the scroll offset to the keyboard height.

Resources