Full screen scroll (IOS) - ios

I have made an iOS application using PhoneGap Build, Which works fine. I am having some kind of problem while scrolling a page. When I scroll from bottom or from Top whole screen moves. Is there any way to prevent this,as I know this is iOS feature. Which is very nice but in case of my application I do not want this. So help me out.

Use this in you config file:
<preference name="DisallowOverscroll" value="true" />
<preference name="webviewbounce" value="false" />

Related

Gray background on scroll in a Cordova iOS App

I'm working on a mobile app using Phonegap/Cordova.
I built the ipa file using Phonegap Build and installed it on my iPhone.
I noticed when I scroll up or down at the edges of the view (like iOS bounce scrolling), the whole application view scrolls down (or up) and a gray background color appears.
I tried finding if there's a CSS code for that, but no luck.
I'm guessing maybe its something related to view-port.
Things to Consider:
- I'm using Framework7 v3
- PhoneGap Build cli-6.5.0
- iPhone 6S Plus
Screenshots of the issue:
What can be done to fix this bug?
Add the following to to your config.xml and then run cordova prepare:
<platform name="ios">
<preference name="DisallowOverscroll" value="true" />
<preference name="UIWebViewBounce" value="false" />
</platform>

Cordova 6.1.1 overscroll and UI bounce IOS

I am working on Ionic 2 having Cordova 6.1.1. My app overscrolls for a down scroll at the top of the page and bounces on a text box focus (when keyboard opens).
This seems to be a generic problem and has some solutions for earlier versions of cordova.
The following preferences are set correctly in my config.xml.
<preference name="webviewbounce" value="false"/>
<preference name="UIWebViewBounce" value="false"/>
<preference name="DisallowOverscroll" value="true"/>
They do not work for Cordova 6.1.1 or above (6.2.0) !!
Thanks.

Ionic remove white blank space above keyboard

I am building an app using ionic framework. I got two issues.
I am getting a blank white space above keyboard.
White screen appears after splash screen and before app loading. I have tried the below mentioned code. But no use of it.
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="AutoHideSplashScreen" value="false" />
How to avoid the white screen before app loading and how to avoid the blank space above the keyboard transition.
Thanks,
Raj.

White flash and transition issue on Jquery Mobile & Phonegap 3

I hate to ask a question that has been asked before, but I am suffering from the white flash when transitioning from the splash screen to main page on IOS (no flashes at all on android), and I have tried all the other suggestions listed in other posts (Phonegape 3 white flash after splash screen ), and none of them worked.
In fact, the suggestion of manually adding in the splash screen plugin and using the splashscreen.show / hide actually has made things worse, the white flash now stays present for 3-5 seconds before moving to the main page.
I've also noticed that my app seems to be ignoring the
<preference name="AutoHideSplashScreen" value="false" />
command, as I have this set in the config.xml file, and the splashscreen shows when the app launches, stays up for a few seconds, and then moves on, when the expected behavior is that it would stay up indefinitely (until I tell it to go away via the splashscreen.hide() command).
Would anyone have any other suggestions for removing or drastically reducing the white flash after the splash screen?
thanks!
Have you tried including the following config.xml values if they aren't already there?:
<preference name="FadeSplashScreen" value="true"/>
<preference name="FadeSplashScreenDuration" value="0.7"/>
<feature name="SplashScreen">
<param name="ios-package" value="CDVSplashScreen" />
<param name="onload" value="true" />
</feature>
I had the same problem a few weeks ago and adding these fixed it for me.

How to fix keyboard issues with Cordova 3.1 on iOS?

I just tested Cordova 3.1 with a sample iOS app and experienced several keyboard issues.
App settings:
Xcode 5
Status bar is hidden
Landscape mode
config.xml
Issues:
All versions: when focus on an input field then whole view is pushed up including navbar.
iOS5/6: tap on an input field to open keyboard, then a black gap is briefly displayed at top of screen before keyboard pushes whole view up (is it status bar?)
iOS7: there is no black gap like #2 issue, but there are other issues:
I still see accessories bar before it's removed (hidden).
Keyboard is translucent then I can see darker background in the space where current view is pushed up.
If I changed , things are even worse:
View is still pushed up, and when input field loses focus then a black gap is flickring at the top of screen, even on iOS 7, what doesn't happen if KeyboardShrinksView = false.
Keyboard is no longer translucent on iOS 7.
Below is my config.xml
<preference name="DisallowOverscroll" value="true" />
<preference name="HideKeyboardFormAccessoryBar" value="true" />
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
<preference name="KeyboardShrinksView" value="true" />
<preference name="SuppressesIncrementalRendering" value="false" />
<preference name="TopActivityIndicator" value="gray" />
<preference name="EnableLocation" value="false" />
<preference name="EnableViewportScale" value="false" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />
<preference name="AllowInlineMediaPlayback" value="false" />
<preference name="BackupWebStorage" value="none" />
<preference name="Fullscreen" value="true" />
<preference name="Orientation" value="landscape" />
Check out this thread. A lot of the same issues were reported here. It would be best if you added your information to the Cordova JIRA bug tracking system since that's where all the cordova developers work out of.
https://issues.apache.org/jira/browse/CB-3020?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13769996#comment-13769996
I was able to get the top header from sliding around by adding in a simple animation to the resizing of the webview. Here is the code that was put in the keyboardWillShow function in CDViewController.m
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[self.webView setFrame:(CGRectMake(newFrame.origin.x, newFrame.origin.y, newFrame.size.width, newFrame.size.height))];
[UIView commitAnimations];
I was close to getting the black bar from being hidden but couldn't get it working very well. This post describes what you will need to do. You'll need to hae the webview reizing animation match the keyboard animation.
iOS 7 - Keyboard animation

Resources