Orientation does not change in ionic starter template "blank" on iOS

ionic-v1
1

Hello,

I’m having a problem with the basic ionic orientation change functionality on iOS. No iOS app is updating its orientation when the device is flipped to landscape or portrait mode, it is just stuck in the orientation (landscape or portrait) that the app was opened initially. I do neither face this problem on android nor in the basic cordova example app described here, where the helloWorld app is changing its orientation acording to the devices orientation also on iOS.

Here is what I did:

I’ve created a new ionic “blank”-app, added the ios platform and builded it with ionic CLI like so:

ionic start blankionicapp blank
cd blankiconicapp
ionic platform add ios
ionic build

Next I opened the xcodeproj-File from the platforms/ios directory and checked all checkboxes under Deployment Info referring to “Device Orientation”.
image

After that I’ve run the app on both an iphone and an ipad with the same result: No Orientation changes in the ios app.
I’ve also tried adding either

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

or/and

<config-file platform="ios" target="*-Info.plist" parent="UISupportedInterfaceOrientations"> <array> <string>UIInterfaceOrientationPortrait</string> <string>UIInterfaceOrientationLandscapeLeft</string> <string>UIInterfaceOrientationPortraitUpsideDown</string> <string>UIInterfaceOrientationLandscapeRight</string> </array> </config-file> <config-file platform="ios" target="*-Info.plist" parent="UISupportedInterfaceOrientations~ipad"> <array> <string>UIInterfaceOrientationPortrait</string> <string>UIInterfaceOrientationLandscapeLeft</string> <string>UIInterfaceOrientationPortraitUpsideDown</string> <string>UIInterfaceOrientationLandscapeRight</string> </array> </config-file>

in the config.xml without luck.
My system information is:

Cordova CLI: 5.4.0
Ionic Version: 1.1.1
Ionic CLI Version: 1.7.8
Ionic App Lib Version: 0.6.4
ios-deploy version: 1.7.0
ios-sim version: 4.1.1
OS: Mac OS X Yosemite 10.10.5
Node Version: v0.12.7
Xcode version: Xcode 7.1.1 Build version 7B1005

Any help is appreciated.
Thanks!

2

I had a similar issue and posted my solution in this ionic forum post. Give that a try and see if it helps?

3

Dear jwt02180, thanks for your suggestion, but unfortunately I was unable to get it working like that. Where and how did you state the function?

4

It needs to be a global function, so I put it in the javascript file where I defined my angular application module. You should be able to just copy and paste the function, and place it outside any angular functions in that file, in addition the config.xml configuration I showed in that post. You might need to remove the .plist settings you applied as I didn’t need to edit that file at all.

5

Dear jwt02180, many thanks for your help it is working now like you said :+1:.

Just for reference here is what I did to make it fly:

  1. Add the following line in the config.xml
    <preference name="Orientation" value="default" />

  2. Add the following lines into www/js/app.js just below the line with angular.module:
    `/**

  • @param {Number} degree - UIInterfaceOrientationPortrait: 0, UIInterfaceOrientationLandscapeRight: 90, UIInterfaceOrientationLandscapeLeft: -90, UIInterfaceOrientationPortraitUpsideDown: 180
  • @returns {Boolean} Indicating if rotation should be allowed.
    */
    function shouldRotateToOrientation(degrees) {
    return true;
    }`
  1. ionic prepare ios && ionic build ios open the Xcode-File and run it on the device.

PS: I’ve also updated to the latest cordova@5.4.1 not sure if this helped as well.