読者です 読者をやめる 読者になる 読者になる

江戸一番のジャスタウェイ職人のブログ

江戸一番のジャスタウェイ職人

iOS標準Frameworkで作れるオーバーレイタイプの動画プレイヤーを付けました

AndroidVine Player が好きであのさり気ない感じの動画プレイヤーを Justaway for iOS に組み込みました

Vine Playerの公開とVineの動画をAndroidで再生するお話 - おぼえにくいおぼえがき

サムネイルをタップするとオーバーレイで動画再生ビューが開いてタップすると閉じるというシンプルな仕様です


ソース(新)

2015/9/22 MPMoviePlayerController が非推奨になっていたので更新しました。

参考

//-- SomeViewController.swift

import AVFoundation

    let playerView = AVPlayerView()

    func configureView() {

        // タップされたら動画終了
        playerView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: "hideVideo"))

        // 背景を半透明に
        playerView.backgroundColor = UIColor(red: 0, green: 0, blue: 0, alpha: 0.5)
    }
    
    func configureEvent() {

        // 動画の最後に来たら最初から再生(リピート)
        NSNotificationCenter.defaultCenter().addObserver(self, selector: "endVideo", name: AVPlayerItemDidPlayToEndTimeNotification, object: nil)
    }

    func showVideo(videoURL: NSURL) {
        guard let view = UIApplication.sharedApplication().keyWindow else {
            return
        }

        // 画面いっぱい
        playerView.frame = CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height)

        // このURLの動画プレイヤーを
        playerView.player = AVPlayer(URL: videoURL)
        playerView.player?.actionAtItemEnd = AVPlayerActionAtItemEnd.None

        // アスペクト比を維持しつつ
        playerView.setVideoFillMode(AVLayerVideoGravityResizeAspect)
        view.addSubview(playerView)

        // 再生していく人生
        playerView.player?.play()
    }
    
    // 動画の時代終わり
    func hideVideo() {
        playerView.player?.pause()
        playerView.removeFromSuperview()
    }
    
    // リピート
    func endVideo() {
        playerView.player?.currentItem?.seekToTime(kCMTimeZero)
    }

//-- AVPlayerView.swift

import UIKit
import AVFoundation

class AVPlayerView: UIView {
    
    var player: AVPlayer? {
        get {
            let layer: AVPlayerLayer = self.layer as! AVPlayerLayer
            return layer.player
        }
        set(newValue) {
            let layer: AVPlayerLayer = self.layer as! AVPlayerLayer
            layer.player = newValue
        }
    }
    
    override class func layerClass() -> AnyClass {
        return AVPlayerLayer.self
    }
    
    func setVideoFillMode(mode: String) {
        let layer: AVPlayerLayer = self.layer as! AVPlayerLayer
        layer.videoGravity = mode
    }
}

ソース

import MediaPlayer

    var moviePlayer: MPMoviePlayerController?

    func showVideo(videoURL: NSURL) {
        guard let view = UIApplication.sharedApplication().keyWindow else {
            return
        }
        
        let moviePlayer = MPMoviePlayerController(contentURL: videoURL)
        
        // view playerスタイル(再生コントロールがない)
        moviePlayer.controlStyle = MPMovieControlStyle.None

        // ショートムービーはリピートした方がいい
        moviePlayer.repeatMode = MPMovieRepeatMode.One

        // 画面いっぱい
        moviePlayer.view.frame = CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height)

        // 背景透過
        moviePlayer.backgroundView.backgroundColor = UIColor(red: 0, green: 0, blue: 0, alpha: 0.5)

        // 再帰的にclearColor指定しないと真っ黒
        moviePlayer.view.backgroundColor = UIColor.clearColor()
        for subView in moviePlayer.view.subviews {
            subView.backgroundColor = UIColor.clearColor()
        }

        // タップして閉じるをやっていく
        let screenView = UIView(frame: view.bounds)
        screenView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: "hideVideo"))
        moviePlayer.view.addSubview(screenView)

        // 最前面にaddSubview
        view.addSubview(moviePlayer.view)

        // 自動再生
        moviePlayer.play()

        // インスタンスを保持しておかないと再生できない(viewだけじゃなダメ)
        self.moviePlayer = moviePlayer
    }
    
    func hideVideo() {
        // 停止してから消さないと音が止まらない
        self.moviePlayer?.stop()
        self.moviePlayer?.view.removeFromSuperview()
    }