I'm developing iOS app with PhoneGap (Cordova) and my problem is that status bar is overlaying my webview/application:
I've added preferences in my config.xml file but these are not working:
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarBackgroundColor" value="#0ff000" />
<preference name="StatusBarStyle" value="default" />
How can i solve that?
Installation Command for Status bar Plugin
cordova plugin add cordova-plugin-statusbar
StatusBarOverlaysWebView (boolean, defaults to true). On iOS 7, make the statusbar overlay or not overlay the WebView at startup.
Add this line in your config.xml
<preference name="StatusBarOverlaysWebView" value="false" />
Please read official documentation for better understanding
Solved this way:
With cordova-plugin-statusbar installed, added this line to config.xml:
<gap:plugin name="com.phonegap.plugin.statusbar" />
and then in index.html:
<script type="text/javascript">
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady(){
StatusBar.overlaysWebView(false);
}
</script>
Check out Step 3: at the bottom of the page at this link...
https://ccoenraets.github.io/cordova-tutorial/handlebars-templates.html
It actually looks pretty identical to what you did, but also involves a node plugin for the status bar issue.
cordova plugin add cordova-plugin-statusbar
Hopefully it helps.
Related
I have a Cordova app (built with react) which renders 3d (.glb) models on my iPhone (using three.js).
It's old, and used Cordova's iOS#5 platform. I updated it to Cordova's newer ios#6 platform, and the .glb files no longer load on the iPhone.
They load fine locally, when run in the browser. but they do not load in the iPhone. If I use the older ios 5, it works fine.
Is there a known reason three.js no longer works in ios6? a plugin that needs to be added? a build setting that must now be added that didn't before?
It's most probably because you were running UIWebView which has been deprecated. Now WKVebView does not allow to load files like UIWebView used to.
You could give a try to this plugin https://github.com/globules-io/cordova-plugin-ios-xhr and then set your preferences to
<preference name="AllowUntrustedCerts" value="true" />
<preference name="InterceptRemoteRequests" value="all" />
<preference name="allowFileAccessFromFileURLs" value="true" />
<preference name="allowUniversalAccessFromFileURLs" value="true" />
Note that this is for iOS 6+
Iam working on a iOS project.
I want to setup my statusbar, but it doesn't work.
I added in my config.xml:
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarBackgroundColor" value="#000000" />
And added the Plugin to my Project:
cordova plugin add cordova-plugin-statusbar
But it doesn't work.
My version is cordova 6.3.1
Any ideas?
The solution is, I forgot to insert the cordova.js file into index.html.
In your xcode project, find the projects .plist file (which folows the naming convention projectName-Info.plist) and add the two following key value pairs to the file:
Status bar is initially hidden: YES
View controller-based status bar appearance: NO
Tested with Cordova 6.3.1 on iOS 10.0.2
In my app(ionic + cordova) i set orientation for portrait, but when i open xcode to build, the option updside down is enable. how can i disable upside down in my config.xml?
my config.xml
<preference name="orientation" value="portrait" />
thank you
So it's a combination of the config.xml file and XCODE settings.
In the config.xml file you'll need to add the following line right before the closing </widget> tag
<preference name="Orientation" value="default" />
Then inside of Xcode need to disable the Upside Down option under the Device Orientation settings.
Then you will have to delete the platforms directory then rebuild the apps so that the change will take.
Try changing your config.xml to: <preference name="orientation" value="default" />
Then at the platform level for iOS change your preference value to "portrait" via: <preference name="orientation" value="default" />
Config Ref
Default: default
Allowed values:
default, landscape, portrait.
This allows you to lock orientation and prevent the interface from rotating in response to changes in orientation.
NOTE: The default value means Cordova will strip the orientation preference entry from the platform's manifest/configuration file allowing the platform to fallback to its default behavior. For iOS, to specify both portrait & landscape mode you would use the platform specific value 'all'.
I had the opposite problem then solved it by changing this. I hope this helps!
You can't untick iOS "up-side-down" by config file.
But you can use screen-orientation plugin to control it.
(website)
I found a solution that is working for my projects.
With the installed Cordova plugin cordova-custom-config you can overwrite the UISupportedInterfaceOrientations-Setting with the following code inside of the <platform name="ios">:
<custom-config-file mode="replace" parent="UISupportedInterfaceOrientations" platform="ios" target="*-Info.plist">
<array>
<string>UIInterfaceOrientationPortrait</string>
</array>
</custom-config-file>
Important is the parameter mode="replace"
The Key is of type Array and will be merged by default.
Outside the platform-tags you can set the default <preference name="orientation" value="portrait" />. This will be used for Android and woont allow upside down there.
The only and better way to do that is, simply install cordova-plugin-screen-orientation plugin in your project.
And in the ionic.Platform.ready(function() {}) use the following code:
if (window.cordova && cordova.plugins) {
cordova.plugins.screenorientation.setOrientation('portrait-primary');
}
I also had the same issue, which was causing iPhone SE to change orientation upside-down, and this code fixed it for me.
Can anyone explain this odd padding that exists outside the entire webview?
Our app has been denied by Apple because of this issue.
I have Googled it for days with no success.
Try setting this in your config.xml:
<platform name="ios">
<preference name="target-device" value="universal" />
</platform>
Universal is the default value, so make sure you are not setting target-device to something else ;)
Hey guys i'm using phonegap and jquery mobile to build an app for an android phone. Is there any possibility to disable the screen rotation of the app. I am very new to jquery mobile. Sorry if I am asking inappropriate question.
Yes it's possible but you must set it in cordova/phonegap parameter not in your app/www
in your app folder there is config.xml
<preference name="orientation" value="default" />
<!-- all: default means both landscape and portrait are enabled -->
Do you want to do it only using Jquery? Can you think of using Android's Manifest file to fix an orientation for the activity?
Change the following attributes in manifest file:
android:screenOrientation="portrait" or android:screenOrientation="landscape" in the AndroidManifest.xml:
<activity android:name=".MyActivity"a
android:label="#string/app_name"
android:screenOrientation="portrait">
Include the following code in your 'config.xml'
<preference name="Orientation" value="landscape" />
or
<preference name="Orientation" value="portrait" />