最近、仕事で BrightcovePlayer SDK を触る機会がありました。
その際ネット上の関連サンプルを調べたところ、ほとんど Objective-C で書かれたものだったため、今回は Swift でカスタマイズする方法についてまとめてみました。
SDK の追加
BrightcovePlayer SDK がサポートする iOS バージョンは iOS8 以降です。
SDK を CocoaPods から追加する場合、 CocoaPods のバージョンは 1.0 以降が必要です。
Podfile は以下のように書きます。
source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '8.0'
use_frameworks!
target 'iOS_Customize_Player_UI' do
pod 'Brightcove-Player-SDK/dynamic'
end
動画の再生
こちらのサンプルを参照して、 Swift のソースコードを作成します。
そのコードが以下になります。
import BrightcovePlayerSDK
class ViewController: UIViewController, BCOVPlaybackControllerDelegate, BCOVPUIPlayerViewDelegate {
@IBOutlet weak var videoView: UIView!
var catalogService: BCOVCatalogService!
public var playbackController: BCOVPlaybackController!
var playerView: BCOVPUIPlayerView!
private static let kViewControllerCatalogToken = "YOUR_TOKEN"
private static let kPlaylistID = "YOUR_ID"
override func viewDidLoad() {
super.viewDidLoad()
let manager: BCOVPlayerSDKManager = BCOVPlayerSDKManager.shared()
self.playbackController = manager.createPlaybackController()
self.playbackController.delegate = self
self.playbackController.isAutoAdvance = true
self.playbackController.isAutoPlay = true
self.playbackController.setAllowsExternalPlayback(true)
let options = BCOVPUIPlayerViewOptions.init()
options.presentingViewController = self
options.hideControlsInterval = 120.0
options.hideControlsAnimationDuration = 1.0
let controlView = BCOVPUIBasicControlView.init()
self.playerView = BCOVPUIPlayerView.init(playbackController: nil, options: options, controlsView: controlView)
self.playerView.playbackController = self.playbackController
self.playerView.delegate = self
self.playerView.frame = self.videoView.bounds
self.playerView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
self.videoView.addSubview(self.playerView)
//再生
self.catalogService = BCOVCatalogService.init(token: ViewController.kViewControllerCatalogToken)
self.catalogService.findPlaylist(
withPlaylistID: ViewController.kPlaylistID,
parameters: [:],
completion: { playlist,jsonResponse, error in
guard playlist != nil else {
return
}
self.playbackController.setVideos(playlist)
}
)
}
}
この時点でプレーヤの UI は未設定なので動画画面には何も表示されず、ただ指定した動画だけが流れるようになっています。
デフォルト UI
BrightcovePlayer のデフォルトで 3 種類の layout が用意されています。 そのデフォルトレイアウトは BCOVPUIPlayerView の controlsView プロパティで設定することができます。
let newControlLayout = BCOVPUIControlLayout.basicVOD() self.playerView.controlsView.layout = newControlLayout
デフォルト UI は以下に示す 3 種類の見た目になります。
BCOVPUIControlLayout.basicVOD()
BCOVPUIControlLayout.basicLive()
BCOVPUIControlLayout.basicLiveDVR()
カスタマイズ UI の作成
今回は UIView のコントロール画面を作って、それを動画画面に addSubview で上に載せるという UI を作成しようと思います。 そのために ControlsView.xib というファイルを作りました。
ControlsView の初期化はクラス ControlsView の中で、
static func newInstance() -> ControlsView {
return UINib(nibName: "ControlsView", bundle: nil)
.instantiate(withOwner : nil, options: nil).first as! ControlsView
}
で実現します。
カスタマイズ UI を追加すること自体は難しくないと思いますが、 UI の各ボタンが操作されたときにプレーヤにどうやってその反応を通達するのかという問題があります。 それの解決方法は BCOVPlaybackController#addSessionConsumer : で、カスタマイズ UI のクラスのインスタンスを登録します。
//デフォルト UI を非表示にする let newControlLayout: BCOVPUIControlLayout? = nil self.playerView.controlsView.layout = newControlLayout let controlsView = ControlsView.newInstance() self.videoView.addSubview(controlsView) self.playbackController.add(controlsView)
こうすると、 playbackSession : で始まるものは BCOVPlaybackSession プロトコルに準拠したインスタンスが取れます。
func playbackSession(_ session: BCOVPlaybackSession!, didChangeDuration duration: TimeInterval) {
let player: AVPlayer = session.player
}
ここでなんと！ BCOVPlaybackSession#player で AVPlayer の参照が取れます！ AVPlayer の使い方について言及することはやめておきますが、これで色々とプレーヤに対して指示を出すことができるようになりました。
まとめ
いかがだったでしょうか。 思ったより簡単に使えるライブラリですね。
BrightcovePlayer SDK について興味のある方、ぜひ 以下の公式サイトをご参照ください。 SDK に統合された各プラグインの基本機能を示すサンプルもあります。
