Quick Start: Create a Simple Video App using Swift

Product(s)
Brightcove Player
Video Cloud
Role(s)
Device SDK Developer
Task(s)
Develop with the Native SDKs
Topic(s)
Code Samples
API(s)
Playback API
SDK
Get Started
iOS

In this topic, you will learn how to build a simple video playback app using the Brightcove Player SDK for iOS. You will build it using the Swift programming language.

Overview

This example plays a video returned from the Brightcove Playback API, which is the latest and recommended API to retrieve content from your Video Cloud library.

For this option, you will need a Policy Key. If you are not familiar with Policy Keys, see Policy API Overview.

Get started

This example plays videos from an internal array of video files.

There are two ways to try out this sample:

Follow the steps below to get familiar with setting up an app project that uses the Brightcove Player SDK for iOS. You can view the complete code for each of the following:

  1. Follow the steps below to get familiar with setting up an app project that uses the Brightcove Player SDK for iOS. You can view the complete code for each of the following:
  2. Download the entire Xcode project for experimentation.
    1. Download the VideoCloudBasicPlayer sample to your local system.
    2. Run the pod install command.
    3. Open and run the newly created workspace.

Create the project

Set up a project in Xcode. Then add the SDK along with any dependencies to the project.

Set up the Xcode project

Create a new Xcode project for the app.

  1. Start the creation of a new iOS project in Xcode. Select Create a new Xcode project.

    Create project
    Create project
  2. Choose Single View Application for the template and select Next.

    Choose the project template
    Choose the project template
  3. Set the project information as follows:

    • Product Name: Simple-Video-Playback
    • Team: none

      The Team field is optional. If you want to distribute your app on the App Store, you will need to select a team that you belong to through the Apple Developer Program. The team name is required for code signing. In this example, we'll select none.

    • Organization Name: your company name
    • Organization Identifier: com.example-company
      This makes the product name unique for the app store.
    • Language: Swift
    Add project information
    Add project information
  4. Choose the location where you want to save your project and create it.

    Save project
    Save project
  5. Now close the project (yes, close it — this is important!)

Add the SDK and its dependencies to your project

The easiest way to add the SDK and its dependencies to your project is to use CocoaPods.

CocoaPods is a dependency manager that adds libraries to your project. It is not required, but makes installation easier. To install CocoaPods, see the instructions on the CocoaPods site.

  1. In your project folder, create a plain text file called Podfile (no file extension).

  2. Using a text editor, add the following lines of code to the Podfile and save it. This code does the following:

    • Line 1: Points to the GitHub location for the Brightcove pod specs.
    • Line 3: Sets Pods to use frameworks instead of static libraries.
    • Line 5: Defines the iOS platform version.
    • Lines 7-9: Install the current version of the Brightcove player SDK.
    source 'https://github.com/brightcove/BrightcoveSpecs.git'
    
    use_frameworks!
    
    platform :ios, '10.0' # (or whatever version you want)
    
    target 'Simple-Video-Playback' do
    	pod 'Brightcove-Player-Core/dynamic'
    end
  3. Open a Terminal session and navigate to your Simple-Video-Playback Xcode project folder.

    Terminal session
    Terminal session
  4. In the Terminal session, type the command

    pod install

    and press Return to run the it. You should see a series of messages in the terminal indicating that the Brightcove Player SDK has been added to your project.

  5. Notice the last line, which is important — from this point on, you must open the Simple-Video-Playback.xcworkspace file in Xcode, not the Simple-Video-Playback.xcodeproj file. The pod install command creates this .xcworkspace file for your project.

Code the video app

Create the code for a simple video playback app.

  1. In Xcode, open the Simple-Video-Playback.xcworkspace file.

Set the audio behavior for the app

The audio session handles audio behavior at the app level. Learn more about the AVAudioSession class.

For this sample, we will use AVAudioSessionCategoryPlayback. This plays audio even when the screen is locked and with the Ring/Silent switch set to silent. To keep it simple, we will put the code for this in the App Delegate.

  1. In your project, open the App Delegate file (AppDelegate.swift).

  2. In the didFinishLaunchingWithOptions function, add code to set the audio session category. Make sure you import the AVFoundation framework.

    • We need the code below in order to ensure that audio plays back when we expect it to. For example, without setting this code, we won't hear the video when the mute switch is on.
    • For simplicity in the sample, we are putting this in the app delegate. For more information about how to use this in your own app, see the Audio Session Programming Guide.
    //
    //  AppDelegate.swift
    //  Simple-Video-Playback
    //
    //  Created by on 9/28/17.
    //  Copyright © 2017 Brightcove. All rights reserved.
    //
    
    import UIKit
    import AVFoundation
    
    @UIApplicationMain
    class AppDelegate: UIResponder, UIApplicationDelegate {
    
    	var window: UIWindow?
    
    	func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
    		// Override point for customization after application launch.
    
           var categoryError :NSError?
    		var success: Bool
    		do {
    			try AVAudioSession.sharedInstance().setCategory(AVAudioSessionCategoryPlayback)
    			success = true
    		} catch let error as NSError {
    			categoryError = error
    			success = false
    		}
    
    		if !success {
    			print("AppDelegate Debug - Error setting AVAudioSession category.  Because of this, there may be no sound. \(categoryError!)")
    		}
    
    		return true
    	}
    
    	func applicationWillResignActive(_ application: UIApplication) {
    		// Sent when the application is about to move from active to inactive state. This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message) or when the user quits the application and it begins the transition to the background state.
    		// Use this method to pause ongoing tasks, disable timers, and invalidate graphics rendering callbacks. Games should use this method to pause the game.
    	}
    
    	func applicationDidEnterBackground(_ application: UIApplication) {
    		// Use this method to release shared resources, save user data, invalidate timers, and store enough application state information to restore your application to its current state in case it is terminated later.
    		// If your application supports background execution, this method is called instead of applicationWillTerminate: when the user quits.
    	}
    
    	func applicationWillEnterForeground(_ application: UIApplication) {
    		// Called as part of the transition from the background to the active state; here you can undo many of the changes made on entering the background.
    	}
    
    	func applicationDidBecomeActive(_ application: UIApplication) {
    		// Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface.
    	}
    
    	func applicationWillTerminate(_ application: UIApplication) {
    		// Called when the application is about to terminate. Save data if appropriate. See also applicationDidEnterBackground:.
    	}
    
    }

Build the View Controller

Update the View Controller class to play a video from the Brightcove catalog service.

  1. In your project, open the View Controller file (ViewController.swift).

Import the Native SDK

Although the Brightcove Native Player SDK for iOS is written in Obj-C, we can simply import the framework modules into our Swift project.

  1. Below the existing import directive, add the following to import the Brightcove Native Player SDK:

    import BrightcovePlayerSDK

Customize the project with your values

Add values to access your Video Cloud account.

  1. Below the import directives, add your own values for the following:

    • Line 12: Defines your Brightcove Playback API Policy Key
    • Line 13: Defines your Video Cloud Account ID
    • Line 14: Defines your Video Cloud Video ID
    // ** Customize these values with your own account information **
    let kViewControllerPlaybackServicePolicyKey = "BCpkADawqM2NZcfpTGYMHaafJU597X9J0XTvw8CXZcMITep7BFNYHFKGz3XJQfYzudYCp9GWn3u18OQdlqJxSKFrIipF4Ndx9umqQ5EtUaAn_oTXaQgIs1lAe4-FciLISBFDCTAA3j2qALp8"
    let kViewControllerAccountID = "3636334163001"
    let kViewControllerVideoID = "3637773814001"

Set the class delegates

This allows your app to listen and respond to video playback events and player control events.

  1. Update the View Controller class as follows:

    class ViewController: UIViewController, BCOVPlaybackControllerDelegate {
    

Declare constants and set the view

  1. In the ViewController class, add the following :

    • Line 18: Defines a constant, which initializes the Brightcove playback service with your Account ID and Policy Key. The BCOVPlaybackService class provides asynchronous methods for retrieving data from the Playback API.
    • Line 19: Defines a constant for the playback controller. The BCOVPlaybackController has methods to control playback functionality.
    • Line 20: Defines a variable for the view.

    class ViewController: UIViewController, BCOVPlaybackControllerDelegate {
    	let playbackService = BCOVPlaybackService(accountId: kViewControllerAccountID, policyKey: kViewControllerPlaybackServicePolicyKey)!
    	let playbackController :BCOVPlaybackController
    	@IBOutlet weak var videoContainer: UIView!

Create an init function

  1. Below the code in the previous step, create an init() function as follows:
    • Line 23: Initializes a shared manager. The BCOVPlayerSDKManager class is a singleton that allows you to create other objects in the SDK ecosystem.
    • Line 24: Uses the shared manager to create a playback controller.
    • Line 25: Optional: Sends your Video Cloud Account ID to analytics. This is only needed if you override the BCOVVideo class or do not use the Brightcove Playback service or catalog.

    • Lines 30-32: set the delegate and turn on the auto-advance and autoplay features.

     required init?(coder aDecoder: NSCoder) {
    	let manager = BCOVPlayerSDKManager.shared()!
    	playbackController = manager.createPlaybackController()
    
    	super.init(coder: aDecoder)
    
    	playbackController.analytics.account = kViewControllerAccountID
    
    	playbackController.delegate = self
    	playbackController.isAutoAdvance = true
    	playbackController.isAutoPlay = true
    }

Configure the player

  1. In the viewDidLoad() function, add the following:

    • Lines 40-41: Create and set the options for the player view.
    • Lines 44-45: Create and set the Brightcove player controls.
    • Lines 47-49: Configure the playback controller's view.
    • Line 51: Adds the player view as a subview of the main view.
    • Line 53: Calls the requestContentFromPlaybackService function, which you will define in the next step.
    override func viewDidLoad() {
    	super.viewDidLoad()
    	// Do any additional setup after loading the view, typically from a nib.
    
    	// Create and set options
    	let options = BCOVPUIPlayerViewOptions()
    	options.presentingViewController = self
    
    	// Create and configure Control View
    	let controlsView = BCOVPUIBasicControlView.withVODLayout()
    	let playerView = BCOVPUIPlayerView.init(playbackController: playbackController, options: options, controlsView: controlsView)!
    
    	playerView.delegate = self
    	playerView.frame = videoContainer.bounds
    	playerView.autoresizingMask = [.flexibleHeight, .flexibleWidth]
    
    	videoContainer.addSubview(playerView)
    
    	requestContentFromPlaybackService()
    }

Request content from the Brightcove library

In order to play back video content, you will request a playlist from the catalog service

  1. Below the viewDidLoad() function, create a function named requestContentFromPlaybackService() as follows:

    • Line 57: Returns a video object from the Playback API based on the given video id.
    • Line 60: Adds the video to the playback controller.
    • Line 64: Writes an error message if a playlist is not returned.
     func requestContentFromPlaybackService() {
    	playbackService.findVideo(withVideoID: kViewControllerVideoID, parameters: nil) {
    		(video: BCOVVideo?, dict: [AnyHashable:Any]?, error: Error?) in
    		if let v = video {
    			self.playbackController.setVideos([v] as NSFastEnumeration!)
    		} else {
    			print("ViewController Debug - Error retrieving video: %@", error!)
    		}
    	}
    }

View the code

The View Controller is now complete. Here is the full code:

//  ViewController.swift
//  Simple-Video-Playback
//
//  Created by on 9/28/17.
//  Copyright © 2017 Brightcove. All rights reserved.
//

import UIKit
import BrightcovePlayerSDK

// ** Customize these values with your own account information **
let kViewControllerPlaybackServicePolicyKey = "BCpkADawqM2NZcfpTGYMHaafJU597X9J0XTvw8CXZcMITep7BFNYHFKGz3XJQfYzudYCp9GWn3u18OQdlqJxSKFrIipF4Ndx9umqQ5EtUaAn_oTXaQgIs1lAe4-FciLISBFDCTAA3j2qALp8"
let kViewControllerAccountID = "3636334163001"
let kViewControllerVideoID = "3637773814001"

class ViewController: UIViewController, BCOVPlaybackControllerDelegate {

	let playbackService = BCOVPlaybackService(accountId: kViewControllerAccountID, policyKey: kViewControllerPlaybackServicePolicyKey)!
	let playbackController :BCOVPlaybackController
	@IBOutlet weak var videoContainer: UIView!

	required init?(coder aDecoder: NSCoder) {
		let manager = BCOVPlayerSDKManager.shared()!
		playbackController = manager.createPlaybackController()

		super.init(coder: aDecoder)

		playbackController.analytics.account = kViewControllerAccountID

		playbackController.delegate = self
		playbackController.isAutoAdvance = true
		playbackController.isAutoPlay = true
	}

	override func viewDidLoad() {
		super.viewDidLoad()
		// Do any additional setup after loading the view, typically from a nib.

		// Create and set options
		let options = BCOVPUIPlayerViewOptions()
		options.presentingViewController = self

		// Create and configure Control View
		let controlsView = BCOVPUIBasicControlView.withVODLayout()
		let playerView = BCOVPUIPlayerView.init(playbackController: playbackController, options: options, controlsView: controlsView)!

		playerView.delegate = self
		playerView.frame = videoContainer.bounds
		playerView.autoresizingMask = [.flexibleHeight, .flexibleWidth]

		videoContainer.addSubview(playerView)

		requestContentFromPlaybackService()
	}

	func requestContentFromPlaybackService() {

		playbackService.findVideo(withVideoID: kViewControllerVideoID, parameters: nil) {
			(video: BCOVVideo?, dict: [AnyHashable:Any]?, error: Error?) in
			if let v = video {
				self.playbackController.setVideos([v] as NSFastEnumeration!)
			} else {
				print("ViewController Debug - Error retrieving video: %@", error!)
			}
		}
	}

	override func didReceiveMemoryWarning() {
		super.didReceiveMemoryWarning()
		// Dispose of any resources that can be recreated.
	}

}

Import the Native SDK

Although the Brightcove Native Player SDK for iOS is written in Obj-C, we can simply import the framework modules into our Swift project.

  1. Below the existing import directive, add the following to import the Brightcove Native Player SDK:

    	import BrightcovePlayerSDK
    	

Customize the project with your values

Set the value of your Account Id, which will be sent to Brightcove in a later step.

  1. Below the #import directives, add your own value for your Brightcove Account Id.

    let kViewControllerAccountID = "123456789" // for analytics

Set the class delegates

This allows your app to listen and respond to video playback events and player control events.

  1. Update the View Controller class as follows:

    class ViewController: UIViewController, BCOVPlaybackControllerDelegate {

Declare constants and set the view

  1. In the ViewController class, add the following :

    • Line 14: defines a constant for the playback controller. The BCOVPlaybackController has methods to control playback functionality.
    • Line 15: defines a variable for the view.

    class ViewController: UIViewController, BCOVPlaybackControllerDelegate {
    
    	let playbackController :BCOVPlaybackController
    	@IBOutlet weak var videoContainer: UIView!

Create an init function

  1. Below the code in the previous step, create an init() function as follows:
    • Line 18: initializes a shared manager. The BCOVPlayerSDKManager class is a singleton that allows you to create other objects in the SDK ecosystem.
    • Line 19: uses the shared manager to create a playback controller with the default view strategy.
    • Line 23: Sends your Video Cloud Publisher ID to analytics.

    • Lines 25-27: set the delegate and turn on the auto-advance and autoplay features.

    required init?(coder aDecoder: NSCoder) {
    	let manager = BCOVPlayerSDKManager.shared()!
    	playbackController = manager.createPlaybackController()
    
    	super.init(coder: aDecoder)
    
    	playbackController.analytics.account = kViewControllerAccountID
    
    	playbackController.delegate = self
    	playbackController.isAutoAdvance = true
    	playbackController.isAutoPlay = true
    }

Configure the player

  1. In the viewDidLoad() function, add the following:

    • Lines 33-35: create an array of video sources using url paths.
    • Lines 37-38: configure the playback controller's view.
    • Line 39: adds the player view as a subview of the main view.
    • Line 41: adds the video array to the controller's playback queue.
    • Line 42: starts playback of the first video.
    override func viewDidLoad() {
    	super.viewDidLoad()
    	// Do any additional setup after loading the view, typically from a nib.
    
    	// create an array of videos
    	var videoArray = [AnyObject]()
    	videoArray = [videoWithURL(url: NSURL(string: "http://cf9c36303a9981e3e8cc-31a5eb2af178214dc2ca6ce50f208bb5.r97.cf1.rackcdn.com/bigger_badminton_600.mp4")!),
    			videoWithURL(url: NSURL(string: "http://devimages.apple.com/iphone/samples/bipbop/bipbopall.m3u8")!)]
    
    	// Create and set options
    	let options = BCOVPUIPlayerViewOptions()
    	options.presentingViewController = self
    
    	// Create and configure Control View
    	let controlsView = BCOVPUIBasicControlView.withVODLayout()
    	let playerView = BCOVPUIPlayerView.init(playbackController: playbackController, options: options, controlsView: controlsView)!
    
    	playerView.delegate = self
    	playerView.frame = videoContainer.bounds
    	playerView.autoresizingMask = [.flexibleHeight, .flexibleWidth]
    
    	videoContainer.addSubview(playerView)
    
    	playbackController.setVideos(videoArray as NSFastEnumeration!)
    	playbackController.play();
    }

Set the delivery method for video sources

  1. Below the viewDidLoad() function, create a function that sets the delivery method for BCOVSources that belong to a video.

    func videoWithURL(url: NSURL) -> BCOVVideo {
    	// set the delivery method for BCOVSources that belong to a video
    	let source:BCOVSource = BCOVSource(url: url as URL!, deliveryMethod: kBCOVSourceDeliveryHLS, properties: nil)
    	let video = BCOVVideo.init(source: source, cuePoints: BCOVCuePointCollection.init(array: []), properties: [NSObject:AnyObject]())
    	return video!
    }

The rest

  1. Below the videoWithURL() function, create a function to handle when the playback session advances.

    private func playbackController(controller: BCOVPlaybackController!, didAdvanceToPlaybackSession session: BCOVPlaybackSession!) {
    		print("ViewController Debug - Advanced to new session.")
    }

View the code

The View Controller is now complete. Here is the full code:

//
//  ViewController.swift
//  Simple Video Playback - Perform
//
//  Copyright © 2017 Brightcove. All rights reserved.

import UIKit
import BrightcovePlayerSDK

let kViewControllerAccountID = "123456789" // for analytics

class ViewController: UIViewController, BCOVPlaybackControllerDelegate {

	let playbackController :BCOVPlaybackController
	@IBOutlet weak var videoContainer: UIView!

	required init?(coder aDecoder: NSCoder) {
	let manager = BCOVPlayerSDKManager.shared()!
	playbackController = manager.createPlaybackController()

	super.init(coder: aDecoder)

	playbackController.analytics.account = kViewControllerAccountID

	playbackController.delegate = self
	playbackController.isAutoAdvance = true
	playbackController.isAutoPlay = true
	}

	override func viewDidLoad() {
		super.viewDidLoad()

		// Load an array of videos
		var videoArray = [AnyObject]()
		videoArray = [videoWithURL(url: NSURL(string: "http://cf9c36303a9981e3e8cc-31a5eb2af178214dc2ca6ce50f208bb5.r97.cf1.rackcdn.com/bigger_badminton_600.mp4")!),
				videoWithURL(url: NSURL(string: "http://devimages.apple.com/iphone/samples/bipbop/bipbopall.m3u8")!)]

		// Create and set options
		let options = BCOVPUIPlayerViewOptions()
		options.presentingViewController = self

		// Create and configure Control View
		let controlsView = BCOVPUIBasicControlView.withVODLayout()
		let playerView = BCOVPUIPlayerView.init(playbackController: playbackController, options: options, controlsView: controlsView)!

		playerView.delegate = self
		playerView.frame = videoContainer.bounds
		playerView.autoresizingMask = [.flexibleHeight, .flexibleWidth]

		videoContainer.addSubview(playerView)

		playbackController.setVideos(videoArray as NSFastEnumeration!)
		playbackController.play();
	}

	func videoWithURL(url: NSURL) -> BCOVVideo {
		// set the delivery method for BCOVSources that belong to a video
		let source:BCOVSource = BCOVSource(url: url as URL!, deliveryMethod: kBCOVSourceDeliveryHLS, properties: nil)
		let video = BCOVVideo.init(source: source, cuePoints: BCOVCuePointCollection.init(array: []), properties: [NSObject:AnyObject]())
		return video!
	}

	private func playbackController(controller: BCOVPlaybackController!, didAdvanceToPlaybackSession session: BCOVPlaybackSession!) {
		print("ViewController Debug - Advanced to new session.")
	}

	override func didReceiveMemoryWarning() {
		super.didReceiveMemoryWarning()
		// Dispose of any resources that can be recreated.
	}

}

Connect the storyboard view

Connect the Main.storyboard view with the videoContainer property.

  1. In the Xcode, open the Main.storyboard file.

  2. In the companion view, expand the View Controller Scene and then the View Controller menu to expose the View object.

    Storyboard view
    Storyboard view
  3. Show the Assistant Editor, and open the ViewController.swift file.

    Assistant editor
    Assistant editor
  4. Select the open circle next to the @IBOutlet for the videoContainerView, and drag it to the View object to connect these components.

    Connect the view
    Connect the view

Manage Media Security

App Transport Security (ATS) enforces secure connections between your app and web services. With Apple's release of the iOS 9 SDK, a new feature called App Transport Security (ATS) was added.

  1. One of the following situations will apply to your app:

    • By default the Brightcove Native SDK for iOS uses a source selection policy to choose HTTPS over HTTP sources, so you can build your apps with ATS enabled.

      That's it, you are ready to run your app.


    • If you are using HTTP sources or have other HTTP calls in your app, you may encounter the following error message:

      App Transport Security has blocked a cleartext HTTP (http://) resource load since it is insecure.
      Temporary exceptions can be configured via your app's Info.plist file.

      This means that ATS is enabled, but your system is not configured to meet the ATS requirements. To fix this situation, see the Working with App Transport Security (ATS) document.

Run the app

The app is ready to build and run on an iPhone, iPad or the iOS Simulator. You should be able to play the videos from your playlist.

iPhone sample
iPhone sample

The app is ready to build and run on an iPhone, iPad or the iOS Simulator. You should be able to play the videos defined in your array.

iPhone sample
iPhone sample