IOS Airplay - "Game on your TV"

Question

I displayed the broadcast button using this code

var airplayButton: UIBarButtonItem! let airView: MPVolumeView = MPVolumeView() airView.showsRouteButton = true airView.showsVolumeSlider = false airView.sizeToFit() airView.tintColor = UIColor.blackColor() airplayButton = UIBarButtonItem(customView: airView) airplayButton.tintColor = UIColor.whiteColor() 

Now I want to display the screen. Is there any default method in the iOS Airplay framework to display it. Or should I design the screen myself. In addition, delegates are not allowed to check when the device is connected, and the movie starts from AppleTV through the iOS device. I only have a variable to check ie externalPlaybackActive

The problem is that if I use this variable, it will be an ineffective solution, since I can connect the ether to Control during playback. I do not want to start a timer to check every second if the movie is broadcast on AppleTV. Any better ideas?

This video plays on "Apple TV"

Like

Answer 1

This is how I implemented it. It works like a charm!

 //Airplay constants private var observerContextAirplay = 1 private var propertyToObserveAirplay = "externalPlaybackActive" // MARK: AirPlay Key-value Observing func startObservingForAirPlayStatusChanges() { self.player.moviePlayer.addObserver(self, forKeyPath: propertyToObserveAirplay, options: .New, context: &observerContextAirplay) } func stopObservingForAirPlayStatusChanges() { self.player.moviePlayer.removeObserver(self, forKeyPath: propertyToObserveAirplay) } override func observeValueForKeyPath(keyPath: String?, ofObject object: AnyObject?, change: [String : AnyObject]?, context: UnsafeMutablePointer<Void>) { if context == &observerContextAirplay { if self.player.moviePlayer.externalPlaybackActive == true { self.setUpAirPlayView() } else if self.player.moviePlayer.externalPlaybackActive == false { self.resetPlayerView() } } else { super.observeValueForKeyPath(keyPath, ofObject: object, change: change, context: context) } } 

// Set up AirplayView

 func setUpAirPlayView() { //Airplay Button if self.airPlay_PlayBtn == nil { let playImage = UIImage(named: "player_play.png")! if let _ = self.airPlay_PlayBtnFrame { self.airPlay_PlayBtn = UIButton(frame: self.airPlay_PlayBtnFrame) self.airPlay_PlayBtn.setBackgroundImage(playImage, forState: UIControlState.Normal) self.airPlay_PlayBtn.addTarget(self, action: #selector(ICFPlayerViewController.airPlayButtonAction), forControlEvents: UIControlEvents.TouchUpInside) self.airPlay_PlayBtn.setBackgroundImage(UIImage(named: "player_play.png"), forState: .Normal) self.airPlay_PlayBtn.setBackgroundImage(UIImage(named: "player_pause.png"), forState: .Selected) self.airPlay_PlayBtn.center = self.view.center self.view.addSubview(self.airPlay_PlayBtn) if let _ = self.player { self.player.playPauseButton.hidden = true } } } else { self.airPlay_PlayBtn.hidden = false if let _ = self.player { self.player.playPauseButton.hidden = true } } // Airplay Label if self.airPlayLabel == nil { self.airPlayLabel = UILabel() self.airPlayLabel.frame = CGRectMake(0, 0, 280, 20) self.airPlayLabel.text = "Your video is now playing on Apple TV" self.airPlayLabel.textAlignment = NSTextAlignment.Center self.airPlayLabel.backgroundColor = UIColor.blackColor().colorWithAlphaComponent(0.6) self.airPlayLabel.textColor = UIColor.whiteColor() self.airPlayLabel.sizeToFit() self.airPlayLabel.center = self.view.center self.airPlayLabel.center.y = self.view.center.y - self.activityIndicator.frame.size.height*1.5 self.view.addSubview(self.airPlayLabel) } else { self.airPlayLabel.hidden = false } // Thumbnail self.setupContentThumbnailImageView() //Fetch Thumbnail image if let _ = self.thumbnailImage { self.view.addSubview(self.thumbnailImage) } self.view.bringSubviewToFront(bottomToolbar) self.view.bringSubviewToFront(topToolbar) if let _ = self.airPlayLabel { self.view.bringSubviewToFront(self.airPlayLabel) } if let _ = self.airPlay_PlayBtn { self.view.bringSubviewToFront(self.airPlay_PlayBtn) } } 

Answer 2

It looks like you are using an AVPlayerViewController that has a contentOverlayView UIView property that sits between the video player and the controls.

You can start by placing the property observer on an externalPlaybackActive to find out when AirPlay starts playing. Once true, initialize your UIView, add it as the dungeon of your player's contentOverlayView and place it.

 let subview = UIView() // your view you want to show when AirPlay is active subview.frame = CGRect(...) playerVC.contentOverlayView?.addSubview(subview) playerVC.contentOverlayView?.bringSubviewToFront(subview)