首先进入的是启动的界面，我们已经在上一篇做好了。第一次启动之后会出现一个宣传的视频，是下面的界面。
我们使用Mark Man标记一下
上面镶嵌视频的图片没有找到，应该是自己画的，或者使用的pdf格式的。经研究pdf格式的会自动生成对应的图片但是不会包含在安装包里面。
既然找不到，我们不如自己做一个简陋的，我们推荐使用PaintCode做这个图片。
我们图片尺寸是基于1242x2208截图。
我们做这个模板的时候可以分成两份，耳朵做成一个图片就固定的大小。下面的模板框设置成代码自动生成。
我们保存图片头部的模板为BVideoHeadTemplate.swift
我们新建一个类BFirstVideoViewController,放置视频头部图片命名为videoHeadImageView的UIImageView。
利用生成的类给videoHeadImageView赋值。
videoHeadImageView.image = BVideoHeadTemplate.imageOfVideoHead(videoHeadFrame: CGRect(x: 0, y: 0, width: KAppScreenWidth, height: 100))
我们想让启动图显示1.0秒之后显示这个视频的界面。
DispatchQueue.main.asyncAfter(deadline: .now() + 1.0) {
let firstVideoViewController = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "BFirstVideoViewController")
UIApplication.shared.windows.first!.rootViewController = firstVideoViewController
}
写上面的代码遇到了一些问题
第一 GCD的代码书写在swift3.0发生了变化我利用dispatch_after根本打不出来，没办法就Google一下，变成了上面的样子。
第二 当我写UIApplication.shared.keyWindow?发现是不存在的，应该是没有用代码执行makeKeyWindow的缘故就直接从数组里面取第一个元素好了。
我们接下来就是绘制视频载体的图片了，这个还是没什么难度的。
我们绘制完成保存文件为BVideoBodyTemplate.swift我们同样在BFirstVideoViewController类新建一个UIImageView对象为videoBodyImageView。
因为视频的载体高度是随着宽度变得，我们声明一个变量videoBodyHeightConstraint指向videoBodyImageView高度的约束
我们在BFirstVideoViewController声明一个计算真实高度的方法名称叫做calculateVideoBodyHeight（）。
/// 计算视频载体真实的高度
///
/// - returns: CGFloat
func calculateVideoBodyHeight() -> CGFloat {
var videoBodyHeight:CGFloat = 0
let videoBodyWidth = KAppScreenWidth - 20 //计算视频载体的宽度
let videoWidth = videoBodyWidth - 24 // 计算视频的宽度
let videoHeight = 360 / 640 * videoWidth // 计算视频的高度
videoBodyHeight += 20 + videoHeight + 12 // 20为上面的空隙 + 视频的高度 + 12下面的空隙
return videoBodyHeight
}
我们给刚才的约束重新赋值，之后给videoBodyImageView赋值绘制的图片。
videoBodyHeightConstraint.constant = calculateVideoBodyHeight()
videoBodyImageView.image = BVideoBodyTemplate.imageOfVideoBody(width: KAppScreenWidth - 20)
我们新建一个UIView防止视频名称叫做videoView父试图是videoBodyImageView约束是下面。
我们防止进入APP主页面的按钮。设置成下面的样子。
本想想用@IBDesignable @IBInspectable两个属性声明圆角可以在StoryBoard修改的,但是一直不成功，查了一下资料只支持子类，不支持扩展。
下面是扩展的代码如下：
import UIKit
@IBDesignable
extension UIView {
@IBInspectable var cornerRadius:CGFloat{
get{
return layer.cornerRadius
}
set{
layer.masksToBounds = true
layer.cornerRadius = newValue
}
}
}
不行我们就在BFirstVideoViewController进行设置。声明按钮的属性为accessButton。
accessButton.layer.masksToBounds = true
accessButton.layer.cornerRadius = 5
看着圆角有点小，我们修改为15。
现在剩下的功能就是自动播放视频了，下一篇继续。
此教程项目进度下载项目下载