iPhone screen orientation doesn't change in cordova 3.5.0

Question

When I rotate screen in my App using iPhone it always stays in portrait and nothing changes. However it works fine for iPad. I can rotate it and orientation changes.

How to make my App change screen orientation in iPhone when I turn it?

In config.xml I have:

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

The only solution I could find is changing method shouldAutorotateToInterfaceOrientation in MainViewController.m inside cordova code:

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
    // Return YES for supported orientations
--    return [super shouldAutorotateToInterfaceOrientation:interfaceOrientation];
++    return true;
}

But this seems like an ugly solution to me and I would really like to find normal way of doing this.

Ideally, it would be good to have all orientations for iPad and for iPhone all except portraitUpsideDown, but I don't know if I'm even allowed to dream about it.

Does anybody else has similar problem with iPhone and cordova? I've been googling for days now and couldn't find anything except this hack in cordova code.

Here's a Javascript solution for that: http://stackoverflow.com/a/28203969/533454 — Greg, Jan 28 '15 at 23:04

score 4 · Answer 1 · answered Oct 13 '14 at 18:50

After searching far and wide for a solution to this, I've unfortunately come to the conclusion that this is a Cordova issue. The

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

code should actually change your platform UISupportedInterfaceOrientations key in the iOS config file (/platform/ios/~app_name~/~app_name~.plist) to include the following values:

"UIInterfaceOrientationLandscapeLeft";
"UIInterfaceOrientationLandscapeRight";
"UIInterfaceOrientationPortrait"; and (I think)
"UIInterfaceOrientationPortraitUpsideDown"

Unfortunately changing the config.xml file doesn't alter the plist file, which is rather annoying. Hopefully this will get sorted soon, judging by threads found online it's wasted a lot of peoples time searching for a solution.

The easiest solution I've found is to change the ~app_name~.plist file manually to include the values above. I've been doing it in Xcode which makes very easy to do.

Hope this helps. If there is a better solution or Cordova fix this oversight please let me know.

Just as a side note it would be worth noting down what other other config.xml option don't work. Please post if there are others to avoid wasting more time...... — FrodmanG, Oct 13 '14 at 18:53
I like not to modify the Cordova-generated code. Here's a Javascript solution for that. http://stackoverflow.com/a/28203969/533454 — Greg, Jan 28 '15 at 23:04

score 2 · Answer 2 · edited May 23 '17 at 11:45

I created a Build Phase in XCode that uses PListBuddy so that way whenever you run cordova build ios, it runs the build phase and updates the PList file. The nice thing about this is if you change config.xml and it changes the PList, the Build Phase steps in and ensures the values are there.

I got the idea from the accepted answer here: Is there a way of automatically writing custom values to the bundle's .plist during a build phase?

#Grabs info from plist
plist=$SRCROOT"/"$INFOPLIST_FILE
orientations=`/usr/libexec/PlistBuddy -c "Print :UISupportedInterfaceOrientations" "$plist"`

#And changes it before writing out the plist again
if [ "$orientations" ]
then
/usr/libexec/PlistBuddy -c "Delete :UISupportedInterfaceOrientations array" "$plist"
fi
/usr/libexec/PlistBuddy -c "Add :UISupportedInterfaceOrientations array" "$plist"
/usr/libexec/PlistBuddy -c "Add :UISupportedInterfaceOrientations:0 string \"UIInterfaceOrientationPortrait\"" "$plist"
/usr/libexec/PlistBuddy -c "Add :UISupportedInterfaceOrientations:0 string \"UIInterfaceOrientationPortraitUpsideDown\"" "$plist"
/usr/libexec/PlistBuddy -c "Add :UISupportedInterfaceOrientations:0 string \"UIInterfaceOrientationLandscapeLeft\"" "$plist"
/usr/libexec/PlistBuddy -c "Add :UISupportedInterfaceOrientations:0 string \"UIInterfaceOrientationLandscapeRight\"" "$plist"

As a side note, we shouldn't have to jump through hoops to have our cake and eat it too, but whatever.

This is really cool, thanks. I was doing some annoying string replacements to automate my build as much as possible, but this works better — standup75, Jul 10 '15 at 02:29

score 0 · Answer 3 · edited May 23 '17 at 12:01

I created a hook file referencing from here: https://stackoverflow.com/a/27063466/4519033

#!/usr/bin/env node

var fs = require('fs');
var plist = 'platforms/ios/<app-name>/<app-name>-Info.plist';

var iphoneModes = [
    "UIInterfaceOrientationLandscapeLeft",
    "UIInterfaceOrientationLandscapeRight",
    "UIInterfaceOrientationPortrait"
];

var ipadModes = [
    "UIInterfaceOrientationLandscapeLeft",
    "UIInterfaceOrientationLandscapeRight"
];

function getOrientationModeStr(modes) {
    var s = "<key>$1</key>\n\t<array>\n\t";
    modes.forEach(function(mode, index) {
        s += "\t<string>"+mode+"</string>\n\t";
    });
    return s;
}

if (fs.existsSync(plist)) {
    var p = fs.readFileSync(plist, 'utf8');
    // replace iphone modes
    p = p.replace(
        /<key>(UISupportedInterfaceOrientations)<\/key>[\r\n ]*<array>[\s\S]*?(?=<\/array>)/ig,
        getOrientationModeStr(iphoneModes)
    );
    // replace ipad modes
    p = p.replace(
        /<key>(UISupportedInterfaceOrientations~ipad)<\/key>[\r\n ]*<array>[\s\S]*?(?=<\/array>)/ig,
        getOrientationModeStr(ipadModes)
    );
    fs.writeFileSync(plist, p, "utf8");
}

hopefully it helps.

iPhone screen orientation doesn't change in cordova 3.5.0

3 Answers3