Geek Answers Handbook

How to allow only these orientations in the Cordova / Phonegap application?

I created an iOS application (iPhone) using Cordoba and want to allow only the following orientations:

  • Portrait
  • Landscape on the left
  • Landscape on the right

It also means that upside down should not be allowed :

Xcode Screenshot Screen Orientation

I know that I can install this in Xcode, but when I start a new build of Cordova, this parameter is overwritten.

So, I checked the Cordoba docs and found this: http://cordova.apache.org/docs/en/5.1.1/config_ref_index.md.html#The%20config.xml%20File

It says that I can set the orientation in the config.xml file as follows:

<preference name="Orientation" value="landscape" />

But I don’t see how I can set a finer granular setting, as I described above. How can I do that?

Note: I'm on Cordoba 5.1.1

+4
source share
2 answers

You can use config.xml '

 <platform name="ios"> <preference name="Orientation" value="all" /> </platform>

along with the callback shouldRotateToOrientation(degrees) , as stated in the docs as follows:

 onDeviceReady: function() { app.receivedEvent('deviceready'); window.shouldRotateToOrientation = function(degrees) { return degrees !== 180; }; },
+4
source

You can use the after_prepare binding, which will apply the settings after cordova prepare and therefore avoid overwriting them on each cordova build . Put the following code in <your_project>/hooks/after_prepare/some_file.js :

 #!/usr/bin/env node // Set support for all orienations in iOS .plist - workaround for this cordova bug: https://issues.apache.org/jira/browse/CB-8953 var platforms = process.env.CORDOVA_PLATFORMS.split(','); platforms.forEach(function(p) { if (p == "ios") { var fs = require('fs'), plist = require('plist'), xmlParser = new require('xml2js').Parser(), plistPath = '', configPath = 'config.xml'; // Construct plist path. if (fs.existsSync(configPath)) { var configContent = fs.readFileSync(configPath); // Callback is synchronous. xmlParser.parseString(configContent, function (err, result) { var name = result.widget.name; plistPath = 'platforms/ios/' + name + '/' + name + '-Info.plist'; }); } // Change plist and write. if (fs.existsSync(plistPath)) { var pl = plist.parseFileSync(plistPath); configure(pl); fs.writeFileSync(plistPath, plist.build(pl).toString()); } process.exit(); } }); function configure(plist) { var iPhoneOrientations = [ 'UIInterfaceOrientationLandscapeLeft', 'UIInterfaceOrientationLandscapeRight', 'UIInterfaceOrientationPortrait' ]; var iPadOrientations = [ 'UIInterfaceOrientationLandscapeLeft', 'UIInterfaceOrientationLandscapeRight', 'UIInterfaceOrientationPortrait' ]; plist["UISupportedInterfaceOrientations"] = iPhoneOrientations; plist["UISupportedInterfaceOrientations~ipad"] = iPadOrientations; }

Note: you need to install plist and xml2js node if you do not already have them.

+6
source

More articles:


All Articles