close
当前位置: 物联网在线 > 技术文库 > ios >

iOS端一次视频全屏需求的实现

对于一个带有视频播放功能的app产品来说,视频全屏是一个基本且重要的需求。虽然这个需求看起来很简单,但是在实现上,我们前后迭代了三套技术方案。这篇文章将介绍这三种实现方案中的利弊和坑点,以及实现过程中积累的经验。

需求要点:

在屏幕旋转的动画中,需要保持播放器之外的界面布局(比如“First View”等几行字的布局不应该发生变化)

全屏切换到小屏,小屏需要回到原先位置

iOS端一次视频全屏需求的实现

对于这三种实现方案,我写了个 demo 分别示意。三个方案分别在demo的三个tab中。

原始方案:方案一

从小屏进入全屏时,将播放器所在的view放置到window上,用transform的方式做一个旋转动画,最终让view完全覆盖window。 从全屏回到小屏时,用transform的方式做旋转动画,最终让播放器所在的view回到原先的parentView上

核心代码示例:

- (void)enterFullscreen { if (self.movieView.state != MovieViewStateSmall) { return; } self.movieView.state = MovieViewStateAnimating; /* * 记录进入全屏前的parentView和frame */ self.movieView.movieViewParentView = self.movieView.superview; self.movieView.movieViewFrame = self.movieView.frame; /* * movieView移到window上 */ CGRect rectInWindow = [self.movieView convertRect:self.movieView.bounds toView:[UIApplication sharedApplication].keyWindow]; [self.movieView removeFromSuperview]; self.movieView.frame = rectInWindow; [[UIApplication sharedApplication].keyWindow addSubview:self.movieView]; /* * 执行动画 */ [UIView animateWithDuration:0.5 animations:^{ self.movieView.transform = CGAffineTransformMakeRotation(M_PI_2); self.movieView.bounds = CGRectMake(0, 0, CGRectGetHeight(self.movieView.superview.bounds), CGRectGetWidth(self.movieView.superview.bounds)); self.movieView.center = CGPointMake(CGRectGetMidX(self.movieView.superview.bounds), CGRectGetMidY(self.movieView.superview.bounds)); } completion:^(BOOL finished) { self.movieView.state = MovieViewStateFullscreen; }]; } - (void)exitFullscreen { if (self.movieView.state != MovieViewStateFullscreen) { return; } self.movieView.state = MovieViewStateAnimating; CGRect frame = [self.movieView.movieViewParentView convertRect:self.movieView.movieViewFrame toView:[UIApplication sharedApplication].keyWindow]; [UIView animateWithDuration:0.5 animations:^{ self.movieView.transform = CGAffineTransformIdentity; self.movieView.frame = frame; } completion:^(BOOL finished) { /* * movieView回到小屏位置 */ [self.movieView removeFromSuperview]; self.movieView.frame = self.movieView.movieViewFrame; [self.movieView.movieViewParentView addSubview:self.movieView]; self.movieView.state = MovieViewStateSmall; }]; }

这种方式在实现上相对简单,因为仅仅旋转了播放器所在的view,view controller和device的方向均始终为竖直(portrait)。但最大的问题就是全屏时status bar的方向依然是竖直的,虽然之前通过全屏时隐藏statusBar来掩盖了这个问题,但这同时导致了用户无法在视频全屏时看到时间、网络情况等,体验有待改善。

iOS端一次视频全屏需求的实现

方案二设想

为了解决status bar不能转至横向的问题,我们决定替换视频全屏的实现方式。

业界比较流行的转屏方式应该是通过私有接口设置UIDevice的orientation属性。但直接设置这一属性的实现出来的转屏动画效果有些欠缺。比如旋转过程中会漏出黑色。

由于setStatusBarOrientation等方法已经被标记为depreciated了,使用它可能会带来风险,于是我们暂时也没有考虑这种方式

一个顺理成章的技术方案是:

在一个只支持Portrait的ViewController上,present一个只支持Landscape的ViewController,通过改写ViewController之间的转场动画,既能高度自定义全屏动画,也能让StatusBar在视频全屏时横向显示。

这个方案没有用任何私有接口或hack的方式,完全符合苹果的要求,理想中它应该会是一个稳定可靠的方案。

于是我们选用了present一个ViewController的方式作为方案二进行了下去。

核心设计为:

新增一个ViewController的子类,demo中为FullscreenViewController,重写这个类的supportedInterfaceOrientations方法,返回UIInterfaceOrientationMaskLandscape。

全屏时,present这个FullscreenViewController,系统会自动将statusBar转至Landscape方向。 同时自定义这个FullscreenViewController的转场动画,形成一个符合产品需求的动画效果。

方案二坑点&解决

在方案二的实现过程中,我们遇到了不少问题。

业务上的坑点

兼容viewWillDisppear等生命周期方法


(责任编辑:ioter)

用户喜欢...

一次连接世界一辆汽车

联网的车辆终于进入了自己的市场。今天,约有35%的新车连接到互联网。他们挤满了监测驾驶,安全和车辆健康状况的传感器技术。预计到2020年,支持互联网的车辆将成为应用商店的顶级下载...


在Digilent Nexys Video板卡上实现HDMI I/O视频处理系统的软件配置介绍

作者:Adam Taylor,编译:kenshin 嵌入式视觉是当今科技最激动人心的领域之一。 关于使用Zynq SoC的嵌入式视觉应用,热心群众们说的太多,我就不赘述了。今天我们换一个新的视角,来看看如...


在Digilent Nexys Video Artix-7板卡上实现HDMI I/O视频处理系统

嵌入式视觉是当今科技最激动人心的领域之一。 关于使用Zynq SoC的嵌入式视觉应用,热心群众们说的太多,我就不赘述了。今天我们换一个新的视角,来看看如何使用纯FPGA来实现嵌入式视觉...


阐述使用FPGA和AD9361/AD9364解决方案实现高清无线视频传输的关键参数

摘要 集成式射频 (RF) 捷变收发器不仅广泛用于蜂窝电话基站的软件定义无线电 (SDR)1架构,如多业务分布式接入系统 (MDAS) 和小基 站单元等,也适用于工业、商业以及军事应用中的无线高清视频...


充电、上网一次搞定,福特Ford智能长椅伦敦街头现身

福特Ford与智慧城市新创公司正在建置智能长椅–以太阳能Wi-Fi充电站为概念,为行人在城市中休憩时提供免费的太阳...


兆芯开先KX-5000系列国产x86处理器闪耀2017工博会

第19届中国国际工业博览会在上海国家会展中心正式开幕。继参展上届工博会取得强烈反响之后,上海兆芯集成电路有...


罗德与施瓦茨的干扰定位产品MNT100在移动通信网络的干扰排查方面带来了一次技术革命

在现在的移动通信网络中,各种不合规范的发射源渗透在每个角落。这导致网络容量变差,用户体验大幅度下降,所...


华虹半导体与晟矽微电联合宣布:基于95纳米OTP工艺平台的首颗MCU开发成功

物联网生态多点开花,对低功耗的要求也愈发严苛,华虹半导体顺时而造,推出绿色低功耗95纳米CE 5V OTP MCU工艺平台...


[原创] ADI ADV7282A四路过取样SDTV视频译码解决方案

ADI公司的ADV7282A是10位四路过取样SDTV视频译码器,差分输入,支持NTSC/PAL/SECAM彩色解调,视频输入每路支持CVBS, Y/C和YPrPb模...


美光提升面向视频监控领域的边缘存储能力,并宣布新合作伙伴以促进市场导入

美光科技有限公司(纳斯达克股票代码:MU)今日宣布面向视频监控领域推出全系列的边缘存储解决方案,将实现新的...