[Swift通天遁地]八、媒体与动画-(3)实现视频播放的水印、Overlay、暂停时插入广告等效果
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
➤微信公众号：山青咏芝（shanqingyongzhi）
➤博客园地址：山青咏芝（https://www.cnblogs.com/strengthen/）
➤GitHub地址：https://github.com/strengthen/LeetCode
➤原文地址：https://www.cnblogs.com/strengthen/p/10353810.html
➤如果链接不是山青咏芝的博客园地址，则可能是爬取作者的文章。
➤原文已修改更新！强烈建议点击原文地址阅读！支持作者！支持原创！
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
本文将演示使用第三方类库实现视频视频播放的水印、Overlay、暂停时插入广告等效果。
首先确保在项目中，已经安装了所需的第三方类库，点击查看安装的配置文件。
1 platform :ios, '8.0' 2 use_frameworks! 3 4 target 'DemoApp' do 5 source 'https://github.com/CocoaPods/Specs.git' 6 pod 'MobilePlayer' 7 end
根据配置文件中的相关设置，安装第三方类库。
完成安装之后，双击打开项目文件【DemoApp.xcworkspace】
往项目中导入了一个视频文件，以及一张图片文件，作为视频播放器等水印视图。
第三方类库允许开发者使用配置文件【MovielalaPlayer】,
通过配置文件可以调整播放器等各个细节。
依次创建几个自定义的播放器类文件。
在项目文件夹上点击鼠标右键，弹出右键菜单。
【New File】->【Cocoa Touch】->【Next】->
【Class】：OverlayViewController
【Subclass of】:MobilePlayerOverlayViewController
【Language】：Swift
->【Create】
在类【OverlayViewController.swift】创建一个包含浮动视图的视频播放器
1 import UIKit 2 //引入已经安装的第三方类库 3 import MobilePlayer 4 5 class OverlayViewController: MobilePlayerOverlayViewController { 6 7 override func viewDidLoad() { 8 super.viewDidLoad() 9 10 // Do any additional setup after loading the view. 11 12 //初始化一个指定显示区域的视图对象， 13 //该视图对象将浮动显示在视频播放器的上方。 14 let viewBg = UIView(frame: CGRect(x: 0, y: 0, width: 160, height: 60)) 15 //设置视图对象的背景颜色为橙色 16 viewBg.backgroundColor = UIColor.orange 17 //层的不透明度为0.5 18 viewBg.layer.opacity = 0.5 19 20 //初始化一个指定显示区域的标签控件。 21 let label = UILabel(frame: CGRect(x: 0, y: 0, width: 160, height: 30)) 22 //设置标签的文字内容。 23 label.text = "MobilePlayerOverlay" 24 //设置标签的字体颜色。 25 label.textColor = UIColor.white 26 //设置标签的文字对齐方式为剧中。 27 label.textAlignment = .center 28 //设置标签的字体属性 29 label.font = UIFont(name: "Arial", size: 14) 30 //将标签添加到根视图 31 self.view.addSubview(label) 32 //将浮动视图添加到根视图 33 self.view.addSubview(viewBg) 34 35 //初始化一个按钮控件 36 let btn = UIButton(frame: CGRect(x: 40, y: 35, width: 80, height: 20)) 37 //设置按钮在正常状态下的标题文字 38 btn.setTitle("Message", for: .normal) 39 //设置按钮的背景颜色为紫色 40 btn.backgroundColor = UIColor.purple 41 //设置按钮上的文字的字体属性 42 btn.titleLabel?.font = UIFont(name: "Arial", size: 14) 43 //给按钮绑定点击事件 44 btn.addTarget(self, action: #selector(OverlayViewController.btnPressed(_:)), for: .touchUpInside) 45 46 //将按钮添加到根视图 47 self.view.addSubview(btn) 48 } 49 50 //添加一个方法，用来响应按钮的点击事件 51 @objc func btnPressed(_ btn:UIButton) 52 { 53 print("Button pressed.") 54 } 55 56 override func didReceiveMemoryWarning() { 57 super.didReceiveMemoryWarning() 58 // Dispose of any resources that can be recreated. 59 } 60 }
在项目文件夹上点击鼠标右键，弹出右键菜单。
【New File】->【Cocoa Touch】->【Next】->
【Class】：PauseOverlayViewController
【Subclass of】:MobilePlayerOverlayViewController
【Language】：Swift
->【Create】
在类【PauseOverlayViewController.swift】创建一个包含暂停视图的视频播放器，
当用户点击播放器按钮时，显示该视图。
1 import UIKit 2 //引入已经安装的第三方类库 3 import MobilePlayer 4 5 class PauseOverlayViewController: MobilePlayerOverlayViewController { 6 7 override func viewDidLoad() { 8 super.viewDidLoad() 9 10 // Do any additional setup after loading the view. 11 12 //初始化一个指定显示区域的视图对象 13 let viewBg = UIView(frame: CGRect(x:0, y: 0, width: 280, height: 120)) 14 //设置视图对象的背景颜色为黑色 15 viewBg.backgroundColor = UIColor.black 16 //设置视图对象中心点的位置 17 viewBg.center = CGPoint(x:284, y:100) 18 //设置视图层的不透明度为0.75 19 viewBg.layer.opacity = 0.75 20 21 //初始化一个和视图对象相同显示区域的标签视图 22 let label = UILabel(frame: CGRect(x: 0, y: 0, width: 280, height: 120)) 23 //设置标签的文字内容 24 label.text = "Your Ad here" 25 //设置标签的文字的颜色 26 label.textColor = UIColor.white 27 //将标签放置在和视图对象相同的位置， 28 label.center = CGPoint(x:284, y:100) 29 //并设置标签的文字对齐方式为居中。 30 label.textAlignment = .center 31 //设置标签的字体属性，将标签添加到根视图。 32 label.font = UIFont(name: "Arial", size: 36) 33 //最后将标签对象添加到根视图 34 self.view.addSubview(label) 35 //最后将视图对象添加到根视图 36 self.view.addSubview(viewBg) 37 } 38 39 override func didReceiveMemoryWarning() { 40 super.didReceiveMemoryWarning() 41 // Dispose of any resources that can be recreated. 42 } 43 }
在左侧的项目导航区，打开视图控制器的代码文件【ViewController.swift】
现在开始编写代码，依次实现各种风格的视频控制器。
1 import UIKit 2 //引入已经安装的第三方类库 3 import MobilePlayer 4 5 class ViewController: UIViewController { 6 7 override func viewDidLoad() { 8 super.viewDidLoad() 9 // Do any additional setup after loading the view, typically from a nib. 10 11 //添加一个按钮，当用户点击该按钮时，弹出视频播放器窗口。 12 let btn = UIButton(frame: CGRect(x: 0, y: 0, width: 280, height: 40)) 13 //将按钮添加到根视图的中心位置 14 btn.center = self.view.center 15 //设置按钮的背景颜色为橙色 16 btn.backgroundColor = UIColor.orange 17 //设置按钮在正常状态下的标题文字 18 btn.setTitle("Play", for: .normal) 19 //给按钮控件绑定点击事件 20 btn.addTarget(self, action: #selector(ViewController.playVideo(_:)), for: .touchUpInside) 21 22 //将按钮控件添加到根视图 23 self.view.addSubview(btn) 24 } 25 26 //添加一个方法，用来响应按钮的点击事件 27 @objc func playVideo(_ btn:UIButton) 28 { 29 //当按钮被点击时，将首先创建一个拥有水印的视频播放器 30 watermarkExample() 31 32 //修改方法名称 33 //对视频播放器的外观进行设置 34 AdvancedConfigExample() 35 //创建一个包含悬浮视图的播放器。 36 showingOverlays() 37 //为播放器添加一个自定义的暂停页面 38 pauseOverlay() 39 } 40 41 //添加一个方法，用来创建一个包含水印的视频播放器 42 func watermarkExample() 43 { 44 //获得项目中视频文件的路径 45 let path = Bundle.main.path(forResource: "movie", ofType: "mp4") 46 //将路径转换成网址对象 47 let movieUrl = URL(fileURLWithPath: path!) 48 49 //初始化一个视频播放器视图控制器对象，并设置视频文件的路径， 50 //同时创建一个字典对象，设置播放器的水印图片。 51 let playerVC = MobilePlayerViewController(contentURL: movieUrl, config: MobilePlayerConfig( 52 dictionary: ["watermark": ["image": "coolketang"]]), prerollViewController: nil, pauseOverlayViewController: nil, postrollViewController: nil) 53 //调用播放器对象的填充视频方法，将视频填充播放器的视图 54 playerVC.fillVideo() 55 //设置视频播放器的标题文字 56 playerVC.title = "Strengthen - 1" 57 //设置播放器的视频播放列表 58 playerVC.activityItems = [movieUrl] 59 60 //在当前的视图控制器，打开视图播放器窗口。 61 presentMoviePlayerViewControllerAnimated(playerVC) 62 } 63 64 //添加一个方法，使用配置文件，对视频播放器的外观进行设置。 65 //如包含分享图标。 66 func AdvancedConfigExample() 67 { 68 //获取项目中的视频文件的路径 69 let path = Bundle.main.path(forResource: "movie", ofType: "mp4") 70 //将路径转换成一个网址对象 71 let videoURL = URL(fileURLWithPath: path!) 72 73 //获得项目的主路径 74 let bundle = Bundle.main 75 //加载指定位置的配置文件， 76 //并创建一个视频播放器配置对象。 77 let config = MobilePlayerConfig(fileURL: bundle.url( 78 forResource: "MovielalaPlayer", withExtension: "json")!) 79 //使用配置文件，初始化一个视频播放器视图控制器对象。 80 let playerVC = MobilePlayerViewController( 81 contentURL: videoURL, config: config) 82 83 //设置视频播放器的标题文字 84 playerVC.title = "Strengthen - 2" 85 //设置播放器的视频播放列表 86 playerVC.activityItems = [videoURL] 87 88 //在当前的视图控制器，打开视频播放器窗口 89 presentMoviePlayerViewControllerAnimated(playerVC) 90 } 91 92 //添加一个方法，创建一个包含悬浮视图的播放器。 93 func showingOverlays() 94 { 95 //获得项目中视频文件的路径 96 let path = Bundle.main.path(forResource: "movie", ofType: "mp4") 97 //将路径转换成一个网址对象 98 let videoURL = URL(fileURLWithPath: path!) 99 100 //使用指定的视频路径，初始化一个视频播放器 101 let playerVC = MobilePlayerViewController(contentURL: videoURL) 102 //设置视频播放器的标题文字 103 playerVC.title = "Strengthen - 3" 104 //设置播放器的视频播放列表 105 playerVC.activityItems = [videoURL] 106 //在当前的视图控制器打开视频播放器窗口 107 presentMoviePlayerViewControllerAnimated(playerVC) 108 109 //在视频播放2秒之后，在播放器的上方，显示一个悬浮视图控制器，并持续4秒。 110 playerVC.showOverlayViewController(OverlayViewController(), startingAtTime: 2, forDuration: 4) 111 } 112 113 //添加一个方法，为播放器添加一个自定义的暂停页面。 114 //可以在视频播放的暂停页面，添加一些滚动的广告内容。 115 func pauseOverlay() 116 { 117 //获得项目中视频文件的路径 118 let path = Bundle.main.path(forResource: "movie", ofType: "mp4") 119 //将路径转换成一个网址对象 120 let videoURL = URL(fileURLWithPath: path!) 121 122 //使用指定的视频路径，初始化一个视频播放器， 123 //并设置播放器的暂停页面， 124 //该暂停页面就是自定义的一个视图控制器。 125 let playerVC = MobilePlayerViewController( 126 contentURL: videoURL, 127 pauseOverlayViewController: PauseOverlayViewController()) 128 //设置视频播放器的标题文字 129 playerVC.title = "Strengthen" 130 //设置播放器的视频播放列表 131 playerVC.activityItems = [videoURL] 132 133 //在当前的视图控制器打开视频播放器窗口 134 presentMoviePlayerViewControllerAnimated(playerVC) 135 } 136 137 override func didReceiveMemoryWarning() { 138 super.didReceiveMemoryWarning() 139 // Dispose of any resources that can be recreated. 140 } 141 }
