iOS屏幕旋转适配的基本方法

前段时间抽空总结了一下iOS视频播放的基本用法,发现这其中还有一个我们无法绕过的问题,那就是播放界面的旋转与适配。的确,视频播放与游戏类型的App经常会遇到这个的问题。由于至今接手的项目中不常涉及这块知识疏于总结,在搜索了一些资料后也发现都很散乱,所以决定在这里重新整理一下。

主要内容:

  1. 最让人纠结的三种枚举
  2. 两种屏幕旋转的触发方式
  3. 屏幕旋转控制的优先级
  4. 开启屏幕旋转的全局权限
  5. 开启屏幕旋转的局部权限(视图控制器)
  6. 实现需求:项目主要界面竖屏,部分界面横屏
  7. 默认横屏无效的问题
  8. 关于旋转后的适配问题
  9. APP启动即全屏

一、最让人纠结的三种枚举

刚开始接触屏幕旋转这块知识的时候,最让人抓狂的也许就是三种相关的枚举类型了,它们就是:

  1. UIDeviceOrientation
  2. UIInterfaceOrientation
  3. UIInterfaceOrientationMask
1.设备方向UIDeviceOrientation

UIDeviceOrientation

  1. 这是硬件设备(iPhoneiPad等)本身的当前旋转方向,共有7种(包括一种未知的情况);
  2. 设备方向只能取值,不能设置;
  3. 判断设备的方向是以Home键的位置作为参照的;

UIDeviceOrientation在源码中的定义如下:

//Portrait 表示纵向,Landscape 表示横向。
typedef NS_ENUM(NSInteger, UIDeviceOrientation) {

     UIDeviceOrientationUnknown,

     UIDeviceOrientationPortrait,           // Device oriented vertically, home button on the bottom

     UIDeviceOrientationPortraitUpsideDown, // Device oriented vertically, home button on the top

     UIDeviceOrientationLandscapeLeft,      // Device oriented horizontally, home button on the right

     UIDeviceOrientationLandscapeRight,     // Device oriented horizontally, home button on the left

     UIDeviceOrientationFaceUp,             // Device oriented flat, face up

     UIDeviceOrientationFaceDown            // Device oriented flat, face down

   } __TVOS_PROHIBITED;

获取设备当前设备的旋转方向使用:[UIDevice currentDevice].orientation

为了监测设备方向的变化,可以在Appdelegate文件中使用通知如下:

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(onDeviceOrientationDidChange)
                     name:UIDeviceOrientationDidChangeNotification
                                               object:nil];

[[UIDevice currentDevice] beginGeneratingDeviceOrientationNotifications];

 - (BOOL)onDeviceOrientationDidChange{
    //获取当前设备Device
    UIDevice *device = [UIDevice currentDevice] ;
    //识别当前设备的旋转方向
    switch (device.orientation) {
        case UIDeviceOrientationFaceUp:
            NSLog(@"屏幕幕朝上平躺");
            break;

        case UIDeviceOrientationFaceDown:
            NSLog(@"屏幕朝下平躺");
            break;

        case UIDeviceOrientationUnknown:
            //系统当前无法识别设备朝向,可能是倾斜
            NSLog(@"未知方向");
            break;

        case UIDeviceOrientationLandscapeLeft:
            NSLog(@"屏幕向左橫置");
            break;

        case UIDeviceOrientationLandscapeRight:
            NSLog(@"屏幕向右橫置");
            break;

        case UIDeviceOrientationPortrait:
            NSLog(@"屏幕直立");
            break;

        case UIDeviceOrientationPortraitUpsideDown:
            NSLog(@"屏幕直立,上下顛倒");
            break;

        default:
            NSLog(@"無法识别");
            break;
    }
    return YES;
}
2.页面方向UIInterfaceOrientation

UIInterfaceOrientation是开发的程序界面的当前旋转方向,它是可以设置的;

UIInterfaceOrientation的源码定义如下:

    // Note that UIInterfaceOrientationLandscapeLeft is equal to UIDeviceOrientationLandscapeRight (and vice versa).
    // This is because rotating the device to the left requires rotating the content to the right.
    typedef NS_ENUM(NSInteger, UIInterfaceOrientation) {

        UIInterfaceOrientationUnknown               = UIDeviceOrientationUnknown,

        UIInterfaceOrientationPortrait              = UIDeviceOrientationPortrait,

        UIInterfaceOrientationPortraitUpsideDown    = UIDeviceOrientationPortraitUpsideDown,

        UIInterfaceOrientationLandscapeLeft         = UIDeviceOrientationLandscapeRight,

        UIInterfaceOrientationLandscapeRight        = UIDeviceOrientationLandscapeLeft

    } __TVOS_PROHIBITED;

值得注意的两个枚举:

UIInterfaceOrientationLandscapeLeft = UIDeviceOrientationLandscapeRight, 
UIInterfaceOrientationLandscapeRight = UIDeviceOrientationLandscapeLeft

我们可以发现设备方向页面方向的枚举值大多是可以对应上的。只有左右旋转的时候是UIInterfaceOrientationLandscapeLeftUIDeviceOrientationLandscapeRight相等,反之亦然,这是因为向左旋转设备需要旋转程序界面右边的内容。

3.页面方向UIInterfaceOrientationMask

UIInterfaceOrientationMaskiOS6之后增加的一种枚举,其源码如下:

typedef NS_OPTIONS(NSUInteger, UIInterfaceOrientationMask) {

    UIInterfaceOrientationMaskPortrait = (1 << UIInterfaceOrientationPortrait),

    UIInterfaceOrientationMaskLandscapeLeft = (1 << UIInterfaceOrientationLandscapeLeft),

    UIInterfaceOrientationMaskLandscapeRight = (1 << UIInterfaceOrientationLandscapeRight),

    UIInterfaceOrientationMaskPortraitUpsideDown = (1 << UIInterfaceOrientationPortraitUpsideDown),

    UIInterfaceOrientationMaskLandscape = (UIInterfaceOrientationMaskLandscapeLeft | UIInterfaceOrientationMaskLandscapeRight),

    UIInterfaceOrientationMaskAll = (UIInterfaceOrientationMaskPortrait | UIInterfaceOrientationMaskLandscapeLeft | UIInterfaceOrientationMaskLandscapeRight | UIInterfaceOrientationMaskPortraitUpsideDown),

    UIInterfaceOrientationMaskAllButUpsideDown = (UIInterfaceOrientationMaskPortrait | UIInterfaceOrientationMaskLandscapeLeft | UIInterfaceOrientationMaskLandscapeRight),

} __TVOS_PROHIBITED;

我们已经知道UIDeviceOrientationUIInterfaceOrientation的区别在于:前者是真实的设备方向,后者是页面方向;

UIInterfaceOrientationUIInterfaceOrientationMask的区别是什么呢?其实观察源码,我们就会发现,这是一种为了支持多种UIInterfaceOrientation而定义的类型

下面的示例将很好的说明这点:

iOS6之后,控制单个界面的旋转我们通常是下面三个方法来控制:

//方法1
- (BOOL)shouldAutorotate NS_AVAILABLE_IOS(6_0) __TVOS_PROHIBITED;
//方法2
- (UIInterfaceOrientationMask)supportedInterfaceOrientations NS_AVAILABLE_IOS(6_0) __TVOS_PROHIBITED;
// Returns interface orientation masks.
//方法3
- (UIInterfaceOrientation)preferredInterfaceOrientationForPresentation NS_AVAILABLE_IOS(6_0) __TVOS_PROHIBITED;

方法2:用于设置当前界面支持的所有方向,所以返回值是UIInterfaceOrientationMask,更加方便的表达支持多方向旋转的情况;

方法3:用于设置进入界面默认支持的方向,使用了返回值类型UIInterfaceOrientation,默认进入界面的方向是个确定的方向,所以使用UIInterfaceOrientation更适合;

二、两种屏幕旋转的触发方式

我们开发的App的,大多情况都是大多界面支持竖屏,几个特别的界面支持旋转横屏,两种界面相互切换,触发其旋转有两种情况:

情况1:系统没有关闭自动旋转屏幕功能,

这种情况,支持旋转的界面跟随用户手持设备旋转方向自动旋转。我们需要在当前视图控制器中添加如下方法:

//1.决定当前界面是否开启自动转屏,如果返回NO,后面两个方法也不会被调用,只是会支持默认的方向
- (BOOL)shouldAutorotate {
      return YES;
}

//2.返回支持的旋转方向
//iPad设备上,默认返回值UIInterfaceOrientationMaskAllButUpSideDwon
//iPad设备上,默认返回值是UIInterfaceOrientationMaskAll
- (UIInterfaceOrientationMask)supportedInterfaceOrientations{
     return UIInterfaceOrientationMaskAll;
}

//3.返回进入界面默认显示方向
- (UIInterfaceOrientation)preferredInterfaceOrientationForPresentation {
     return UIInterfaceOrientationPortrait;
}
情况2:单个界面强制旋转

在程序界面,通过点击等方式切换到横屏(尤其是视频播放的情况),有以下两种方法:

// 方法1:
- (void)setInterfaceOrientation:(UIDeviceOrientation)orientation {
      if ([[UIDevice currentDevice]   respondsToSelector:@selector(setOrientation:)]) {
          [[UIDevice currentDevice] setValue:[NSNumber numberWithInteger:orientation]     
                                       forKey:@"orientation"];
        }
    }

// 方法2:
- (void)setInterfaceOrientation:(UIInterfaceOrientation)orientation {
   if ([[UIDevice currentDevice] respondsToSelector:@selector(setOrientation:)]) {
            SEL selector = NSSelectorFromString(@"setOrientation:");
            NSInvocation *invocation = [NSInvocation invocationWithMethodSignature:[UIDevice     
        instanceMethodSignatureForSelector:selector]];
            [invocation setSelector:selector];
            [invocation setTarget:[UIDevice currentDevice]];
            int val = orientation;
            [invocation setArgument:&val atIndex:2];
            [invocation invoke];
        }
    }

注意:使用这两个方法的时候,也要确保shouldAutorotate方法返回YES,这样这两个方法才会生效。还要注意两者使用的参数类型不同;

三、屏幕旋转控制的优先级

事实上,如果我们只用上面的方法来控制旋转的开启与关闭,并不能符合我们的需求,而且方法无效。这是因为我们忽略了旋转权限优先级的问题;

屏幕旋转的设置有3个地方:

  1. XcodeGeneral设置;
  2. info.plist的设置;
  3. 通过代码设置;

这么多的设置很是繁杂,但是这些其实都是在不同级别上实现旋转的设置,我们会遇到设置后无效的情况,这就很可能是被上一级别控制的原因;

这里先有个大致的了解,控制屏幕旋转优先级为:工程Target属性配置(全局权限) = Appdelegate&&Window > 根视图控制器> 普通视图控制器。

四、开启屏幕旋转的全局权限

这里我使用全局权限来描述这个问题可能不太准确,其实是设置我们的设备能够支持的方向有哪些,这也是实现旋转的前提;

开启屏幕旋转的全局权限有三种方法,包括通过Xcode直接配置的两种方法和代码控制的一种方法。

这三种方法作用相同,但是由于代码的控制在程序启动之后,所以也是最有效的。下面分别对三种方法的用法介绍:

1.Device Orientation属性配置

我们创建了新工程,Xcode就默认替我们选择了支持旋转的几个方向,这就是Device Orientation属性的默认配置。在Xcode中依次打开:【General】—>【Deployment Info】—>【Device Orientation】,我们可以看到默认支持的设备方向如下:

可以发现,UpsideDown没有被默认支持,因为对于iPhone即使勾选也没有UpSideDown的旋转效果。我们可以在这里勾选或者取消以修改支持的旋转方向。如果是iPad设备勾选之后会同时支持四个方向;

特殊情况:对于iPhone,如果四个属性我们都选或者都不选,效果和默认的情况一样。

2.Info.Plist设置

其实我们设置了Device Orientation之后,再到info.plist中查看Supported interface orientation,我们会看到:

没错,此时Supported interface orientation里的设置和UIDevice Orientation的值一致的,并且我们在这里增加或者删除其中的值,UIDevice Orientation的值也会随之变化,两者属于同一种设置;

3.Appdelegate&&Window中设置

正常情况下,我们的AppAppdelegate中启动,而Appdelegate所持有唯一的Window对象是全局的,所以在Appdelegate文件中设置屏幕旋转也是全局有效的。

下面的代码设置了只支持竖屏和右旋转:

- (UIInterfaceOrientationMask)application:(UIApplication *)application supportedInterfaceOrientationsForWindow:(UIWindow *)window {

    return  UIInterfaceOrientationMaskPortrait | UIInterfaceOrientationMaskLandscapeLeft;

}

需要注意:如果我们实现了Appdelegate的这一方法,那么我们的App的全局旋转设置将以这里的为准,即使前两种方法的设置与这里的不同。

五、开启屏幕旋转的局部权限(视图控制器)

在设置了全局所支持的旋转方向后,接着就开始设置具体的控制器界面了。我们在上面已经说明了关于旋转的优先级了。而这里主要涉及了三种视图控制器:

  1. UITabbarViewController
  2. UINavigationBarController
  3. UIViewController

自全局权限开启之后,接下来具有最高权限的就是Window的根视图控制器rootViewController了。如果我们要具体控制单个界面UIViewController的旋转就必须先看一下根视图控制器的配置情况了;

当然,在一般情况下,我们的项目都是用UITabbarViewController作为Window的根视图控制器,然后管理着若干个导航控制器UINavigationBarController,再由导航栏控制器去管理普通的视图控制器UIViewController

若以此为例的话,关于旋转的优先级从高到低就是UITabbarViewController>UINavigationBarController >UIViewController了。如果具有高优先级的控制器关闭了旋转设置,那么低优先级的控制器是无法做到旋转的

比如说我们设置要单个视图控制器可以自动旋转,这需要在视图控制器中增加shouldAutorotate方法返回YES或者NO来控制。但如果存在上层根视图控制器,而我们只在这个视图控制器中实现方法,会发现这个方法是不走的,因为这个方法被上层根视图控制器拦截了;

理解这个原理后,我们有两种方法实现自动可控的旋转设置:

方法1:逐级设置各视图控制器,高优先级的视图控制器影响低优先级控制器,

解决上述的问题我们需要设置UITabbarViewController如下:

//是否自动旋转
-(BOOL)shouldAutorotate{
    return self.selectedViewController.shouldAutorotate;
}

//支持哪些屏幕方向
- (UIInterfaceOrientationMask)supportedInterfaceOrientations {
    return [self.selectedViewController supportedInterfaceOrientations];
}

//默认方向
- (UIInterfaceOrientation)preferredInterfaceOrientationForPresentation{
    return [self.selectedViewController preferredInterfaceOrientationForPresentation];
}

设置导航控制器UINavigationController如下:

//是否自动旋转
//返回导航控制器的顶层视图控制器的自动旋转属性,因为导航控制器是以栈的原因叠加VC的
//topViewController是其最顶层的视图控制器,
-(BOOL)shouldAutorotate{
    return self.topViewController.shouldAutorotate;
}

//支持哪些屏幕方向
- (UIInterfaceOrientationMask)supportedInterfaceOrientations {
    return [self.topViewController supportedInterfaceOrientations];
}

//默认方向
- (UIInterfaceOrientation)preferredInterfaceOrientationForPresentation{
    return [self.topViewController preferredInterfaceOrientationForPresentation];
}

到这里,我们就应该明白了,其实就是高优先级的视图控制器要跟随低优先级控制器的旋转配置。这样就能够达到目的;

方法2: 另辟蹊径,使用模态视图

使用模态视图可以不受这种根视图控制器优先级的限制。这个也很容易理解,模态弹出的视图控制器是隔离出来的,不受根视图控制的影响。具体的设置和普通视图器代码相同,这里就不累述了;

六、实现需求:项目主要界面竖屏,部分界面横屏

这其实也是一个我们做屏幕旋转最常见的需求,在根据上面的讲述之后,我们实现这个需求会很容易,但是具体的实现却有着不同的思路,我在这里总结了两种方法:

方法1:使用基类控制器逐级控制

具体步骤:

  1. 开启全局权限设置项目支持的旋转方向;
  2. 根据第五节中的方法1,自定义标签控制器和导航控制器来设置屏幕的自动旋转;
  3. 自定义基类控制器设置不支持自动转屏,并默认只支持竖屏;
  4. 对项目中需要转屏幕的控制器开启自动转屏、设置支持的旋转方向并设置默认方向;

Demo1链接: https://github.com/DreamcoffeeZS/Demo_TestRotatesOne.git

方法2:Appdelegate增设旋转属性

具体步骤:

  1. Applegate文件中增加一个用于记录当前屏幕是否横屏的属性;
  2. 需要横屏的界面,进入界面后强制横屏,离开界面时恢复竖屏;

Demo2链接: https://github.com/DreamcoffeeZS/Demo_TestRotatesTwo.git

七、默认横屏无效的问题

在上面的项目中,我们可能会遇到一个关于默认横屏的问题,把它拿出来细说一下。

我们项目中有支持竖屏的界面A,也有支持横竖屏的界面B,而且界面B需要进入时就显示横屏。从界面A界面B中,如果我们使用第五节中的方法1会遇到无法显示默认横屏的情况,因为没有旋转设备,shouldAutorotate就没被调用,也就没法显示我们需要的横屏。这里有两个解决方法:

方法1:在自定义导航控制器中增加以下方法
#pragma mark -UINavigationControllerDelegate
//不要忘记设置delegate
- (void)navigationController:(UINavigationController *)navigationController didShowViewController:(UIViewController *)viewController animated:(BOOL)animated {
    [self presentViewController:[UIViewController new] animated:NO completion:^{
        [self dismissViewControllerAnimated:NO completion:nil];
    }];
}

这个方法的缺点是,原理上利用弹出模态视图来调用转屏,造成切换界面的时候有闪烁效果,体验不佳。所以这里也只是提供一种思路,不推荐使用;

方法2:在需要默认横屏的界面里设置,进入时强制横屏,离开时强制竖屏

关于这种使用,这个具体可以参考第五节中的demo2

注意:两种方法不可同时使用

八、关于旋转后的适配问题

屏幕旋转的实现会带来相应的UI适配问题,我们需要针对不同方向下的界面重新调整视图布局。首先我们要能够监测到屏幕旋转事件,这里分为两种情况:

1.视图控制器UIViewController里的监测

当发生转屏事件的时候,下面的UIViewControoller方法会监测到视图View的大小变化,从而帮助我们适配

/*
This method is called when the view controller's view's size is
changed by its parent (i.e. for the root view controller when its window rotates or is resized).

If you override this method, you should either call super to
propagate the change to children or manually forward the 
change to children.
 */
- (void)viewWillTransitionToSize:(CGSize)size 
withTransitionCoordinator:(id <UIViewControllerTransitionCoordinator>)coordinator NS_AVAILABLE_IOS(8_0);

从注释里可以看出此方法在屏幕旋转的时候被调用,我们使用时候也应该首先调用super方法,具体代码使用示例如下:

//屏幕旋转之后,屏幕的宽高互换,我们借此判断重新布局
//横屏:size.width > size.height
//竖屏: size.width < size.height
- (void)viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator{
    [super viewWillTransitionToSize:size withTransitionCoordinator:coordinator];
    if (size.width > size.height) {
        //横屏设置,为防止遮挡键盘,调整输入视图的高度
        self.textView_height.constant = 50;
    }else{
        //竖屏设置
        self.textView_height.constant = 200;
    }
}
2.子视图横竖屏监测

如果是类似于表视图的单元格,要监测到屏幕变化实现适配,我们需要用到layoutSubviews方法,因为屏幕切换横竖屏时会触发此方法,然后我们根据状态栏的位置就可以判断横竖屏了,代码示例如下:

- (void)layoutSubviews {
    [super layoutSubviews];
     //通过状态栏电池图标判断横竖屏
    if ([UIApplication sharedApplication].statusBarOrientation == UIInterfaceOrientationMaskPortrait) {
        //竖屏布局
    } else {
        //横屏布局
    }
}

九、APP启动即全屏

有时项目需要从App启动就默认是横屏,这里有个很方便的方法,就是我们在Device Orientation属性配置里设置如下:

但是只这样处理的话,会让项目只支持横屏,所以我们可以在Appdelegate里再次调整我们所支持的方向,方法已经说过,这里就不累述了;

最后总结:

关于屏幕旋转的使用大致总结到这里了,如果存在疏漏与错误欢迎路过的朋友指正!谢谢~

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
禁止转载,如需转载请通过简信或评论联系作者。
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,126评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,254评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,445评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,185评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,178评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,970评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,276评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,927评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,400评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,883评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,997评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,646评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,213评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,204评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,423评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,423评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,722评论 2 345