模仿QQ背景为视频的登录页

之前看到QQ有一版的登录页背景是视频,当时觉得很炫酷,这周得空儿把苹果的AVFoundation大致看了一下,然后模仿着效果写了一个小的Demo,代码很少,很好理解。先把QQ的原版Gif 放到这让大家看一下



接下来我们就来自己实现以下这个效果。既然是登录页背景播放视频,我们应该首先想到以视频为背景,在视频上添加我们的UI,但是我们无法把UI直接添加到播放器上,所以我们创建一个UIView当做容器,把所有的UI控件都添加到这里。


----------------------------------------------------------------------------------------------------------

接下来我们利用懒加载初始化一个视频播放器 ,并设置一些视频播放器的基础设置,如下图:



代码中都是简单设置了AVPlayer的属性,大家会发现我们把视频播放器插入到了视图层的第0层,这样做是为了不遮挡UI控件,大家可以把下面屏蔽的那句话打开试试遮挡效果。

红框圈起来的代码,用来实现视频的循环播放,这个通知方法是当视频播放结束后,调用playAgain方法,playAgain方法如下图:


在这个方法中我们让播放器从视频的0秒开始播放,达到循环播放的效果。

---------------------------------------------------------------------------------------------------------

接下来就是设置UI的事情了,这就很简单了,就不把代码放上来了,其中有设置页面平移的地方也很简单。

大家直接在GitHub上把代码都下载下来看就可以了。

需要注意的是,我们按Home键将程序退出后台时,再次进入前台时,需要通知让视频播放,否则再次进入前台的时候视频会停止,不会播放的。

最后把下载地址在这里~~~~GitHub链接*^*

Demo效果图:




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值