Draw button on top of AVPlayer

Piraba picture Piraba · Apr 2, 2016 · Viewed 13.2k times · Source

I have to draw a label or button on top of video relay next previous , leave comment . List of video have it, once user select one item from the table,it need to play, Once player play finished, those buttons or label should come on top of video

Here is my code :

comPlayerControl = AVPlayerViewController()

if let player = comPlayerControl {

    let videoURL: String = "http://cdnapi.kaltura.com/p/11/sp/11/playManifest/entryId/"+selectedSubmission.transcodeRefId+"/format/applehttp/protocol/http/a.m3u8"
    let playerItem = AVPlayerItem(URL: NSURL(string: videoURL)! )
    commmentPlayer = AVPlayer(playerItem: playerItem)
    player.player = commmentPlayer
    player.view.frame = videoCell.frame
    player.view.sizeToFit()

    player.showsPlaybackControls = true
    NSNotificationCenter.defaultCenter().addObserver(
        self, 
        selector: #selector(CommentsTableViewController.playerDidFinishPlaying(_:)),
        name: AVPlayerItemDidPlayToEndTimeNotification, 
        object: playerItem
    )

    comPlayerControl.delegate = self
    videoCell.addSubview(player.view)
}

func playerDidFinishPlaying(note: NSNotification) {
    print("Video Finished")
    let DynamicView=UIView(frame: CGRectMake(100, 200, 100, 100))
    DynamicView.backgroundColor=UIColor.greenColor()
    DynamicView.layer.cornerRadius=25
    DynamicView.layer.borderWidth=2
    DynamicView.layer.zPosition = 1;
    comPlayerControl.view.addSubview(DynamicView)
}

requirement like this

requirement image

Answer

JAL picture JAL · Apr 4, 2016

You're using an AVPlayerViewController, so there's no reason to access your application's window like in Alessandro Ornano's answer. Why reinvent the wheel? Every AVPlayerViewController has a contentOverlayView property which allows you to place views between the player and the controls.

First, create a new AVPlayerItem and listen for the AVPlayerItemDidPlayToEndTimeNotification notification on that item. Load the item into your player and begin playback.

Once the item completes, the selector your specified to listen for the AVPlayerItemDidPlayToEndTimeNotification notification will be called. In that selector, access the contentOverlayView directly and add your buttons:

In some view controller or other object:

let playerVC = AVPlayerViewController()

// ...

func setupPlayer {

    let playerItem = AVPlayerItem(...)
    playerVC.player?.replaceCurrentItemWithPlayerItem(playerItem)
    NSNotificationCenter.defaultCenter().addObserver(self, selector: #selector(VC.itemFinished), name: AVPlayerItemDidPlayToEndTimeNotification, object: playerItem)
    self.presentViewController(playerVC, animated: true) { 
        self.playerVC.player?.play()
    }
}

func itemFinished() {
    let btn = UIButton(type: .System)
    btn.addTarget(self, action: #selector(VC.buttonTapped), forControlEvents: .TouchUpInside)
    self.playerVC.contentOverlayView?.addSubview(btn)
}

func buttonTapped() {
    print("button was tapped")
    // replay/comment logic here
}

As stated in the comments (and a rejected edit), buttons may not work in the contentOverlayView. For an alternate solution, see Pyro's answer.

You could also subclass AVPlayerViewController and do everything inside an instance of your subclass, but Apple warns against that:

Do not subclass AVPlayerViewController. Overriding this class’s methods is unsupported and results in undefined behavior.