Add an AirPlay button to an app (iOS v3)

Learn how to add an AirPlay button with the iOS SDK


The JW Player iOS SDK supports playback via AirPlay. To cast via AirPlay, you will minimally need to entitle the app, set the appropriate audio session category, and connect your iOS device to an AirPlay receiver such as an AppleTV. For the first two conditions, AirPlay casting shares the same steps with enabling Background Audio. Connecting to an AirPlay receiver can be done in the Control Center or by adding an AirPlay button in your app. This article concerns the latter option.

🚧

When casting, be aware that VAST ads will not play and WebVTT captions will only appear on the mobile device.

1856

App screen with an AirPlay button in the navigation bar

Use the following code to place an AirPlay button in the navigation bar of the ViewController in which this method is embedded.

- (void)setupAirPlayButton {
	UIView *buttonView = nil;
	CGRect buttonFrame = CGRectMake(0, 0, 44, 44);
	
	// It's highly recommended to use the AVRoutePickerView in order to avoid AirPlay issues after iOS 11.
	if (@available(iOS 11.0, *)) {
		AVRoutePickerView *airplayButton = [[AVRoutePickerView alloc] initWithFrame:buttonFrame];
		airplayButton.activeTintColor = [UIColor blueColor];
		airplayButton.tintColor = [UIColor grayColor];
		buttonView = airplayButton;
	} else {
		// If you still support previous iOS versions, you can use MPVolumeView
		MPVolumeView *airplayButton = [[MPVolumeView alloc] initWithFrame:buttonFrame];
		airplayButton.showsVolumeSlider = NO;
		buttonView = airplayButton;
	}
	
	// If there are no AirPlay devices available, the button will not be displayed.
	UIBarButtonItem *buttonItem = [[UIBarButtonItem alloc] initWithCustomView:buttonView];
	[self.navigationItem setRightBarButtonItem:buttonItem animated:YES];
}
func setupAirPlayButton() {
    var buttonView: UIView? = nil
    let buttonFrame = CGRect(x: 0, y: 0, width: 44, height: 44)

    // It's highly recommended to use the AVRoutePickerView in order to avoid AirPlay issues after iOS 11.
    if #available(iOS 11.0, *) {
        let airplayButton = AVRoutePickerView(frame: buttonFrame)
        airplayButton.activeTintColor = UIColor.blue
        airplayButton.tintColor = UIColor.gray
        buttonView = airplayButton
    } else {
        // If you still support previous iOS versions you can use MPVolumeView
        let airplayButton = MPVolumeView(frame: buttonFrame) // add "import MediaPlayer" to file if needed
        airplayButton.showsVolumeSlider = false
        buttonView = airplayButton
    }

    // If there are no AirPlay devices available, the button will not be displayed.
    let buttonItem = UIBarButtonItem(customView: buttonView!)
    self.navigationItem.setRightBarButton(buttonItem, animated: true)
}

The JWPlayerController API controls the playback of the video being cast. The JWPlayerDelegate provides you the playback callbacks while casting.


πŸ“˜

The JW Player iOS Best Practice Apps repository contains several best practice apps, including an example of the code necessary for a casting experience. The targets containing relevant code are named AirPlay (Swift) and JWAirPlay (Objective-C).



FAQ

Which features are not supported when casting with AirPlay?

The following features are not supported during a casting session with AirPlay:

  • VAST ad playback
  • Side-loaded IMA ads playback (Google does not support this)
  • WebVTT captions. (NOTE: Captions added to an HLS stream are supported.)