屏幕旋轉(zhuǎn)是在視頻直播類 App 中常見的場景，在即構(gòu)科技之前發(fā)布的 Roomkit SDK 中也有屏幕跟隨手機自動旋轉(zhuǎn)的場景。
在 Roomkit SDK 自身開發(fā)和客戶接入的過程中我們也會發(fā)現(xiàn)，實現(xiàn)屏幕旋轉(zhuǎn)的需求往往沒有那么順利，經(jīng)常會出現(xiàn)無法旋轉(zhuǎn)、旋轉(zhuǎn)后布局適配等問題。
本篇文章根據(jù)我們以往的開發(fā)經(jīng)驗整理了屏幕旋轉(zhuǎn)實現(xiàn)的相關(guān)實踐方法，解析在實現(xiàn)過程中遇到的常見問題。
一、快速實現(xiàn)旋轉(zhuǎn)
IOS 屏幕旋轉(zhuǎn)的實現(xiàn)涉及到一堆枚舉值和回調(diào)方法，對于沒有做過旋轉(zhuǎn)相關(guān)需求的開發(fā)來說，可能一上來就暈了，所以我們先動手，讓屏幕轉(zhuǎn)起來吧。
實現(xiàn)旋轉(zhuǎn)的方式主要有兩種，跟隨手機感應(yīng)旋轉(zhuǎn)和手動旋轉(zhuǎn)，接下來對這兩種方式進行逐一介紹。
方式一：跟隨手機感應(yīng)器旋轉(zhuǎn)
要實現(xiàn)自動跟隨手機旋轉(zhuǎn)，首先要讓當(dāng)前的視圖控制器實現(xiàn)以下三個方法:
/// 是否自動旋轉(zhuǎn)
- (BOOL)shouldAutorotate {
return YES;
}
/// 當(dāng)前 VC支持的屏幕方向
- (UIInterfaceOrientationMask)supportedInterfaceOrientations {
return UIInterfaceOrientationMaskLandscapeRight | UIInterfaceOrientationMaskPortrAIt | UIInterfaceOrientationMaskLandscapeLeft;
}
/// 優(yōu)先的屏幕方向
- (UIInterfaceOrientation)preferredInterfaceOrientationForPresentation {
return UIInterfaceOrientationPortrait;
}
這種方法需要注意以下幾點：
- shouldAutorotate 返回 YES 表示跟隨系統(tǒng)旋轉(zhuǎn)，但是受 supportedInterfaceOrientations 方法的返回值影響，只支持跟隨手機傳感器旋轉(zhuǎn)到支持的方向。
- preferredInterfaceOrientationForPresentation 需要返回 supportedInterfaceOrientations中支持的方向，不然會發(fā)生 'UIApplicationInvalidInterfaceOrientation'崩潰。
方式二：手動旋轉(zhuǎn)
這種方式在很多視頻軟件中都很常見，點擊按鈕后旋轉(zhuǎn)至橫屏。
這時需要在 shouldAutorotate 中返回 yes，然后再在此方法中 UIInterfaceOrientation 傳入你需要旋轉(zhuǎn)到的方向。注意這是私有方法，是否使用請自行斟酌。
- (void)changeVCToOrientation:(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];
}
}
場景應(yīng)用
自動旋轉(zhuǎn)
如果你的 iphone 沒有關(guān)閉系統(tǒng)屏幕旋轉(zhuǎn)，你就能發(fā)現(xiàn)系統(tǒng)相冊 APP 的頁面是可以跟著手機轉(zhuǎn)動方向旋轉(zhuǎn)的。
如果你想實現(xiàn)和它一樣的效果，只需要按照前面方式一（跟隨手機感應(yīng)器旋轉(zhuǎn)）去配置你的視圖控制器的方法，之后控制器就可以在 supportedInterfaceOrientations 返回的方向內(nèi)實現(xiàn)自由旋轉(zhuǎn)了。
只能手動旋轉(zhuǎn)
這種場景比較少見，在視頻直播類 APP 中常見的場景是自動和手動旋轉(zhuǎn)相結(jié)合的方式。
如果你要實現(xiàn)只能通過像點擊按鈕去旋轉(zhuǎn)的方式，首先需要在 supportedInterfaceOrientations 方法中返回你需要支持的方向，這里重點是shouldAutorotate 方法的返回值。
上面方式二中（手動旋轉(zhuǎn)）說明了手動旋轉(zhuǎn)需要 shouldAutorotate 返回 YES，但是這也會讓控制器支持自動旋轉(zhuǎn)，不符合這個需求，所以我們按以下方法處理：
- (BOOL)shouldAutorotate {
if (self.isRotationNeeded) {
return YES;
} else {
return NO;
}
}
屬性 isRotationNeeded 作為是否需要旋轉(zhuǎn)的標(biāo)記，isRotationNeeded 默認(rèn)為 NO，此時就算你旋轉(zhuǎn)設(shè)備，回調(diào) shouldAutorotate 方法時也不會返回 YES，所以屏幕也不會自動旋轉(zhuǎn)。
剩下的只需要你在點擊旋轉(zhuǎn)的按鈕后將 isRotationNeeded 置為 YES 并調(diào)用手動旋轉(zhuǎn)的方法，這樣處理后只能手動旋轉(zhuǎn)的效果就實現(xiàn)了。
二、旋轉(zhuǎn)后的 UI 布局更新
通常情況下，應(yīng)用旋轉(zhuǎn)到橫豎屏后，因為不同的寬高比會有不同 UI，所以在屏幕旋轉(zhuǎn)的場景中我們又需要解決旋轉(zhuǎn)后 UI 適配的問題。
手機旋轉(zhuǎn)時，正常情況下若 shouldAutorotate 返回 YES , 當(dāng)視圖控制器需要旋轉(zhuǎn)就會觸發(fā) viewWillTransitionToSize 方法，這樣我們就找到了去更新橫豎屏 UI 的時機了，也就是在 completion block 里去完成旋轉(zhuǎn)后的適配邏輯。
/*
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 {
[super viewWillTransitionToSize:size withTransitionCoordinator:coordinator];
[coordinator animateAlongsideTransition:nil completion:^(id<UIViewControllerTransitionCoordinatorContext> _Nonnull context) {
//橫屏：size.width > size.height
//豎屏: size.width < size.height
NSLog(@"旋轉(zhuǎn)完成，更新布局");
}];
}
三、相關(guān)問題
在開發(fā)旋轉(zhuǎn)場景的需求的時候，由于復(fù)雜的多級配置和數(shù)目繁多的枚舉類型，難免會遇到一些崩潰和無法旋轉(zhuǎn)的問題，下面我們就來總結(jié)一下此類問題。
問題一：無法自動旋轉(zhuǎn)
首先檢查下系統(tǒng)屏幕旋轉(zhuǎn)開關(guān)是否被鎖定。系統(tǒng)屏幕鎖定開關(guān)打開后，應(yīng)用內(nèi)無法自動旋轉(zhuǎn)，但是可以調(diào)用上文提到的的方法進行手動旋轉(zhuǎn)。
問題二：多級屏幕旋轉(zhuǎn)控制設(shè)置錯誤
以下方法都可以設(shè)置屏幕旋轉(zhuǎn)的全局權(quán)限：
Device Orientation 屬性配置：“TARGETS > General > Deployment Info > Device Orientation”，圖中是 xcode 默認(rèn)的配置，值得注意的是 iPhone 不支持旋轉(zhuǎn)到 Upside Down 方向。
Appdelegate的 supportedInterfaceOrientationsForWindow 方法：
// 返回需要支持的方向
// 如果我們實現(xiàn)了Appdelegate的這一方法，那么我們的App的全局旋轉(zhuǎn)設(shè)置將以這里的為準(zhǔn)
- (UIInterfaceOrientationMask)application:(UIApplication *)applicatio supportedInterfaceOrientationsForWindow:(nullable UIWindow *)window {
return UIInterfaceOrientationMaskLandscapeRight | UIInterfaceOrientationMaskLandscapeLeft | UIInterfaceOrientationMaskPortrait;
}
以上兩種方式優(yōu)先級：Appdelegate方法 > Target配置，這兩種方式的配置和控制器的 supportedInterfaceOrientations 方法都會影響最終視圖控制器最終支持的方向。
以 iOS 14 中以 present 打開控制器的方式為例，當(dāng)前控制器最終支持的屏幕方向，取決于上面兩種方式中的優(yōu)先級最高的方式的值，與控制器 supportedInterfaceOrientations 的交集。
總結(jié)起來有以下幾種情況：
如果交集為空，且在控制器的 shouldAutorotate 方法中返回為 YES，則會發(fā)生UIApplicationInvalidInterfaceOrientation 的崩潰。
如果交集為空，且在控制器的 shouldAutorotate 方法中返回為 NO，控制器的supportedInterfaceOrientations 方法與 preferredInterfaceOrientationForPresentation 方法返回值不沖突（前者返回值包含有后者返回值），則顯示為控制器配置的方向。
如果交集為空，且在控制器的 shouldAutorotate 方法中返回為 NO，控制器的supportedInterfaceOrientations 方法與 preferredInterfaceOrientationForPresentation 方法返回值沖突（前者返回值未包含有后者返回值），則會發(fā)生 UIApplicationInvalidInterfaceOrientation 的崩潰。
如果交集不為空，控制器的 supportedInterfaceOrientations 方法與 preferredInterfaceOrientationForPresentation 方法返回值沖突，則會發(fā)生 UIApplicationInvalidInterfaceOrientation 的崩潰。
如果交集不為空，控制器的 supportedInterfaceOrientations 方法與 preferredInterfaceOrientationForPresentation 方法返回值不沖突，當(dāng)前控制器則根據(jù) shouldAutorotate 返回值決定是否在交集的方向內(nèi)自動旋轉(zhuǎn)。
這里建議如果沒有全局配置的需求，就不要變更 Target 屬性配置或?qū)崿F(xiàn) Appdelegate 方法，只需在要實現(xiàn)旋轉(zhuǎn)效果的 ViewController 中按前面所說的方式去實現(xiàn)代碼。
問題三：橫屏?xí)r打開系統(tǒng)鎖定屏幕開關(guān)，視圖被強制恢復(fù)到豎屏
由于 iOS 閉源，蘋果為什么會這樣操作當(dāng)然我們也無從得知，但是我們可以通過一些手段來規(guī)避這個問題。好在產(chǎn)生這樣的旋轉(zhuǎn)時，系統(tǒng)也會觸發(fā)和普通旋轉(zhuǎn)時一樣的方法調(diào)用。
以 iPhone X 為例，當(dāng)下拉打開控制頁面時，我們會收到 UIApplicationWillResignActiveNotification 的系統(tǒng)通知，收起控制頁面后會收到 UIApplicationDidBecomeActiveNotification 通知，通過這兩個通知來記錄一下狀態(tài)，在 shouldAutorotate 通過判斷是否是 Active 狀態(tài) 返回 YES/NO。
(void)setupNotification {
[[NSNotificationCenter defaultCenter] addObserver:self
selector:@selector(applicationWillResignActive:)
name:UIApplicationWillResignActiveNotification object:nil];
[[NSNotificationCenter defaultCenter] addObserver:self
selector:@selector(applicationDidBecomeActive:)
name:UIApplicationDidBecomeActiveNotification object:nil];
}
- (BOOL)shouldAutorotate {
if (!self.isApplicationActive) {
return NO;
} else {
return YES;
}
}
}
問題四：屏幕旋轉(zhuǎn)與 ZegoExpressEngine 的適配
有很多小伙伴已經(jīng)接入了我們的 ZegoExpressEngine 實時音視頻引擎，那么在旋轉(zhuǎn)的場景中你就要考慮到旋轉(zhuǎn)對推拉流的影響，以 RoomKit SDK 的使用場景為例，大致有以下幾種情況：
當(dāng)前頁面固定一個方向顯示，只需要設(shè)置與當(dāng)前方向符合的視頻分辨率（引擎默認(rèn)值為 “360 × 640”,根據(jù)自己需求確定），再調(diào)用引擎的 setAppOrientation 接口設(shè)置當(dāng)前方向，以下代碼以左橫屏方向為例：
ZegoVideoConfig *videoConfig = [[ZegoVideoConfig alloc] init];
// 左橫屏分辨率設(shè)置如下：
videoConfig.encodeResolution = CGSizeMake(1280, 720);
[[ZegoExpressEngine sharedEngine] setVideoConfig:videoConfig];
// 調(diào)用 setAppOrientation 接口設(shè)置視頻的朝向
[[ZegoExpressEngine sharedEngine] setAppOrientation:UIInterfaceOrientationLandscapeLeft];
當(dāng)前頁面有旋轉(zhuǎn)的場景，這時就需要在旋轉(zhuǎn)完成后去更新 ZegoExpressEngine 引擎的方向和視頻分辨率，注意這里的當(dāng)前方向取的是當(dāng)前狀態(tài)欄的方向。
// 根據(jù)當(dāng)前方向設(shè)置分辨率
ZegoVideoConfig *videoConfig = [ZegoVideoConfig defaultConfig];
if (isCurPortrait) {
videoConfig.captureResolution = CGSizeMake(720, 1280);
} else {
videoConfig.captureResolution = CGSizeMake(1280, 720);
}
// 調(diào)用 setAppOrientation 接口設(shè)置視頻的朝向
[[ZegoExpressEngine sharedEngine] setAppOrientation:[UIApplication sharedApplication].statusBarOrientation];
上面的 ZegoExpressEngine 音視頻引擎屏幕旋轉(zhuǎn)后的適配邏輯，處理時機都在視圖控制器旋轉(zhuǎn)完成后，也就是 viewWillTransitionToSize 方法的 completion block 里面，這時拿到的 [UIApplication sharedApplication].statusBarOrientation 方向與當(dāng)前控制器方向符合。
（更多 ZegoExpressEngine 音視頻引擎屏幕旋轉(zhuǎn)問題可以參考： iOS 實時音視頻SDK視頻旋轉(zhuǎn)功能- 開發(fā)者中心 - ZEGO即構(gòu)科技）
四、相關(guān)枚舉值
在前面的講述中，我們也認(rèn)識了一些與屏幕旋轉(zhuǎn)相關(guān)的枚舉值。乍一看這塊內(nèi)容確實會感覺多得讓人眼花繚亂，但是我們看清楚他們名稱中的關(guān)鍵詞如：Device、Interface，并在各個枚舉類型用到的地方去理解它的意思，也是能理清這里面的邏輯的。
1、 設(shè)備方向：UIDeviceOrientation
UIDeviceOrientation 是以 home 鍵的位置作為參照，受傳感器影響，和當(dāng)前屏幕顯示的方向無關(guān)，所以只能取值不能設(shè)值。
typedef NS_ENUM(NSInteger, UIInterfaceOrientation) {
UIInterfaceOrientationUnknown = UIDeviceOrientationUnknown,
UIInterfaceOrientationPortrait = UIDeviceOrientationPortrait,
UIInterfaceOrientationPortraitUpsideDown = UIDeviceOrientationPortraitUpsideDown,
UIInterfaceOrientationLandscapeLeft = UIDeviceOrientationLandscapeRight,
UIInterfaceOrientationLandscapeRight = UIDeviceOrientationLandscapeLeft
} API_UNAVAILABLE(tvos);
前面講述的屏幕旋轉(zhuǎn)方法中不會直接用到這個枚舉，但是如果你有監(jiān)聽設(shè)備當(dāng)前方向的需求時，它就變得有用了?？梢酝ㄟ^ [UIDevice currentDevice].orientation 獲取當(dāng)前設(shè)備的方向，若要監(jiān)聽設(shè)備的方向變化，可以用以下代碼實現(xiàn)：
[[UIDevice currentDevice] beginGeneratingDeviceOrientationNotifications];
[[NSNotificationCenter defaultCenter] addObserver:observer
selector:@selector(onDeviceOrientationChange:)
name:UIDeviceOrientationDidChangeNotification
object:nil];
2、 頁面方向：UIInterfaceOrientation
UIInterfaceOrientation 是當(dāng)前視圖控制器的方向，區(qū)別于設(shè)備方向，它是屏幕正在顯示的方向，preferredInterfaceOrientationForPresentation 方法的返回值就是這個枚舉類型。
/// 優(yōu)先的屏幕方向
- (UIInterfaceOrientation)preferredInterfaceOrientationForPresentation {
return UIInterfaceOrientationPortrait;
}
注意 UIInterfaceOrientationLandscapeLeft 與 UIDeviceOrientationLandscapeRight 是對應(yīng)的，這兩個枚舉類型左右相反。
typedef NS_ENUM(NSInteger, UIInterfaceOrientation) {
UIInterfaceOrientationUnknown = UIDeviceOrientationUnknown,
UIInterfaceOrientationPortrait = UIDeviceOrientationPortrait,
UIInterfaceOrientationPortraitUpsideDown = UIDeviceOrientationPortraitUpsideDown,
UIInterfaceOrientationLandscapeLeft = UIDeviceOrientationLandscapeRight,
UIInterfaceOrientationLandscapeRight = UIDeviceOrientationLandscapeLeft
} API_UNAVAILABLE(tvos);
3、 頁面方向：UIInterfaceOrientationMask
觀察 UIInterfaceOrientationMask 枚舉的值，我們就會發(fā)現(xiàn)這是一種為了支持多種 UIInterfaceOrientation 而定義的類型，它用來作為 supportedInterfaceOrientations 方法的返回值，比如我們在該方法中返回 UIInterfaceOrientationMaskAll 就可以支持所有方向了。
/// 當(dāng)前 VC支持的屏幕方向
- (UIInterfaceOrientationMask)supportedInterfaceOrientations {
return UIInterfaceOrientationMaskAll;
}
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),
} API_UNAVAILABLE(tvos);
五、結(jié)語
ZEGO RoomKit SDK 目前已經(jīng)支持屏幕旋轉(zhuǎn)場景，并且在 2.0.0 版本中以 JSON 配置的形式，支持更靈活更便捷的實現(xiàn)自定義的屏幕旋轉(zhuǎn)場景。
在視頻直播類的 APP 中屏幕旋轉(zhuǎn)往往是繞不開的一環(huán)，梳理清楚以上三個枚舉的含義，以及旋轉(zhuǎn)方法的調(diào)用時機，并在恰當(dāng)?shù)臅r間去刷新旋轉(zhuǎn)后的布局，iOS旋轉(zhuǎn)適配就不再困難。
以上就是關(guān)于在 iOS 上實現(xiàn)屏幕旋轉(zhuǎn)的技術(shù)解讀，也歡迎大家使用 RoomKit SDK 體驗 demo
