Quick Start: Build an app using the Brightcove Native SDK for Android

Product(s)
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
Android

In this topic, you will use Android Studio and the Brightcove Player SDK for Android to create an app which plays a video from a Brightcove Video Cloud account, as well as videos from a Brightcove Video Cloud playlist.

In this topic, you will use Android Studio and the Brightcove Player SDK for Android to create an app which plays a single video.

Overview

After completing this Quick Start you should be able to:

  • Create a project and add the Brightcove Player SDK for Android using Gradle.
  • Alter the layout to include a BrightcoveExoPlayerVideoView.

  • Add to the onCreate() method to play videos from different sources.Add to the onCreate() method to play videos.

Audience

Developers who use Android Studio for development and are interested in using the Brightcove Player SDK for Android in an Android app.

Prerequisites

A minimal knowledge of Java and Android app development.

Get ready

Get ready for development by installing Android Studio

  1. Download the Android Studio application.
  2. Follow the directions on the pages to install the application.

Create a project

Create a project in Android Studio and then link to the player SDK using Gradle.

Create a project in Android Studio

  1. Open Android Studio.
    • If this is your first time opening Android Studio, select Start a new Android Studio project.
    • If you are seeing the menus, select File > New > New Project.
  1. Supply values for the Application Name, Company Domain, and Project location. In this quick start the values shown below are used:

    Project name
    Project name
  2. Click Next.
  3. Select the Phone and Tablet platform with the default minimum SDK value.

    Project platform
    Project platform
  4. Click Next.
  5. Choose Empty Activity and click Next.
    Choose Empty Activity
    Choose Empty Activity
  6. Accept the defaults for the activity details and click Finish.

    Finish project creation
    Finish project creation
  7. Android Studio will work for a while and eventually display the initial state of the project.

    Studio project
    Studio project

Utilize Gradle to link to the Brightcove Player SDK for Android

Since Gradle is integrated with Android Studio, you will use it to add the Native SDK for Android to our project.

  1. Expand the Gradle Scripts section and open the second build.gradle file, which is associated with the current module in your PlayVideos project.

    Build gradle file
    Build gradle file
  2. At the bottom of the file, add the repositories section and alter the dependencies section as shown here:

    repositories {
      maven {
          url 'http://repo.brightcove.com/releases'
      }
    }
    
    dependencies {
      compile fileTree(dir: 'libs', include: ['*.jar'])
      testCompile 'junit:junit:4.12'
      compile 'com.android.support:appcompat-v7:23.1.1'
      compile 'com.android.support:design:23.1.1'
      compile 'com.brightcove.player:exoplayer:4.+'
    }

Code the application

Next, you will write the code to layout the app, build the video list, and play the videos

Define the app's layout

Even with the Empty Activity, you will get a simple TextView layout. Replace this with the BrightcoveExoPlayerVideoView, which defines the view for the player.

  1. Open the file app/res/layout/activity_main.xml.
  2. Click Text at the bottom of the file's tab to see the raw XML.

    Layout XML file
    Layout XML file
  3. Remove the existing TextView section and add a BrightcoveExoPlayerVideoView section so the resulting XML appears as follows. Note for later use the id of the view is named brightcove_video_view.

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:context="com.brightcove.playvideos.MainActivity"
        tools:showIn="@layout/activity_main">
    
    <com.brightcove.player.view.BrightcoveExoPlayerVideoView
        android:id="@+id/brightcove_video_view"
        android:layout_width="match_parent"
        android:layout_height="280dp"
        android:layout_gravity="center_horizontal|top"/>
    </RelativeLayout>

Enable the app to use the Internet

  1. Open the app/manifests/AndroidManifest.xml file.
  2. Just after the <application> code block, but above the ending </manifest> tag, insert the following to enable Internet access.

    <uses-permission android:name="android.permission.INTERNET"/>
  3. Sync the project now to re-build it.

Create the View and play a video

  1. Return to the MainActivity.java file. For the MainActivity class, extend the BrightcovePlayer class. This provides default lifecycle management for your app.

    public class MainActivity extends BrightcovePlayer {
    public class MainActivity extends BrightcovePlayer {
  2. Locate the onCreate() function. Below any existing code in the function, add the following:

    • Create an instance of BrightcoveExoPlayerVideoView and associate it with the layout. In most cases, you will use the exoplayer view. For details, see the Choosing a Video View document.

    public class MainActivity extends BrightcovePlayer {
    
      @Override
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
    public class MainActivity extends BrightcovePlayer {
    
    @Override
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
  3. Next, you need to send your Brightcove Player Account ID to Brightcove using the analytics setAccount() method.

    Analytics analytics = brightcoveVideoView.getAnalytics();
    analytics.setAccount("123456789");
  4. Optional: If you override the BrightcoveExoPlayerVideoView class or do not use the Brightcove player and catalog, you need to send your Video Cloud Publisher ID to Video Cloud Analytics. You can do this by using the analytics setAccount() method. This allows you to view data for this app in Video Cloud Analytics.

    Analytics analytics = brightcoveVideoView.getAnalytics();
    analytics.setAccount("123456789");
  5. Now, add the following lines of code to add a video to the view and play it.

    brightcoveVideoView.add(Video.createVideo("http://learning-services-media.brightcove.com/videos/mp4/Wildlife_Tiger.mp4", DeliveryType.MP4));
    brightcoveVideoView.start();
    brightcoveVideoView.add(Video.createVideo("http://learning-services-media.brightcove.com/videos/mp4/Wildlife_Tiger.mp4", DeliveryType.MP4));
    brightcoveVideoView.start();
  6. Check to be sure your onCreate() method appears as follows:

    @Override
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
    
        Analytics analytics = brightcoveVideoView.getAnalytics();
        analytics.setAccount("123456789");
    
        brightcoveVideoView.add(Video.createVideo("http://learning-services-media.brightcove.com/videos/mp4/Wildlife_Tiger.mp4", DeliveryType.MP4));
        brightcoveVideoView.start();
      }
  7. Run or debug the application to see the video playing.

Get and play a video

In this section, you will use the Catalog class to retrieve a single video from the Video Cloud server, then play it.

The com.brightcove.player.edge.Catalog class provides asynchronous methods for retrieving videos and playlists from the Brightcove Playback API. This is the latest and recommended API to retrieve content from your Video Cloud library.

Remove unneeded code

  1. Some code from the previous app is no longer needed. Remove the two lines of code in the onCreate() method that add and start the video.
  2. Confirm your onCreate() method appears as follows:

    public class MainActivity extends BrightcovePlayer {
    
      @Override
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
      }
    }

Retrieve a video from the Catalog

  1. Define the values for your account id, video id and policy key. In your project, create a res/values/strings.xml file as follows:

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
    
        <!-- Application name -->
        <string name="app_name">ExoPlayer Sample App</string>
    
        <!-- A sample Brightcove Edge Account ID -->
        <string name="account">your account id</string>
    
        <!-- A sample Brightcove Edge Policy Key -->
        <string name="policy">your policy key</string>
    
        <!-- A sample Brightcove Video ID -->
        <string name="videoId">your video id</string>
    
    </resources>
  2. Add the following code:

    • Get the event emitter from the SDK
    • Create an instance of com.brightcove.player.edge.Catalog, using your defined values for Account ID and Policy Key from the previous step.

        // Get the event emitter from the SDK and create a catalog request to fetch a video from the
        // Brightcove Edge service, given a video id, an account id and a policy key.
        EventEmitter eventEmitter = brightcoveVideoView.getEventEmitter();
        Catalog catalog = new Catalog(eventEmitter, getString(R.string.account), getString(R.string.policy));
    
  3. From the Video Cloud Studio's Media module select a video and copy the Video ID.
  4. Use the Catalog's findVideoByID() method with your video ID and a VideoListener for the callback.

    catalog.findVideoByID(getString(R.string.videoId), new VideoListener() {
    
      // Add the video found to the queue with add().
      // Start playback of the video with start().
      @Override
        }
    
      @Override
        public void onError(String s) {
        }
    });
  5. In the onVideo() method, add the video to brightcoveVideoView, then start the video.

    // Start playback of the video with start().
      @Override
        public void onVideo(Video video) {
          brightcoveVideoView.add(video);
          brightcoveVideoView.start();
        }
  6. In the onError() method throw the error string.

    @Override
        public void onError(String s) {
          throw new RuntimeException(s);
        }
  7. Check to be sure your onCreate() method appears as follows:

     @Override
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
    
        // Get the event emitter from the SDK and create a catalog request to fetch a video from the
        // Brightcove Edge service, given a video id, an account id and a policy key.
        EventEmitter eventEmitter = brightcoveVideoView.getEventEmitter();
        Catalog catalog = new Catalog(eventEmitter, getString(R.string.account), getString(R.string.policy));
    
        catalog.findVideoByID(getString(R.string.videoId), new VideoListener() {
    
          // Add the video found to the queue with add().
          // Start playback of the video with start().
          @Override
            public void onVideo(Video video) {
              brightcoveVideoView.add(video);
              brightcoveVideoView.start();
            }
    
          @Override
            public void onError(String s) {
              throw new RuntimeException(s);
            }
        });
      }
  8. Run the app to confirm the video plays.

Get and play a playlist

In this section, you will use the Catalog class to retrieve a playlist from the Video Cloud server, then play the videos in the playlist.

The com.brightcove.player.edge.Catalog class provides asynchronous methods for retrieving videos and playlists from the Brightcove Playback API. This is the latest and recommended API to retrieve content from your Video Cloud library.

Remove unneeded code

  1. Some code from the previous app is no longer needed. Remove the call to the Catalog's findVideoByID() method, and the associated VideoListener anonymous callback function.

    catalog.findVideoByID(getString(R.string.videoId), new VideoListener() {
    
        // Add the video found to the queue with add().
        // Start playback of the video with start().
        @Override
          public void onVideo(Video video) {
            brightcoveVideoView.add(video);
            brightcoveVideoView.start();
          }
    
        @Override
          public void onError(String s) {
            throw new RuntimeException(s);
          }
      });

Retrieve a playlist from the Catalog

  1. The existing catalog instance will work for retrieving a playlist, so no changes are necessary to these lines of code:

    EventEmitter eventEmitter = brightcoveVideoView.getEventEmitter();
    Catalog catalog = new Catalog(eventEmitter, getString(R.string.account), getString(R.string.policy));
    
  2. In Video Cloud Studio's Media module, select a playlist and copy the Playlist ID.
  3. Use the Catalog's findPlaylistByID() method using your playlist ID and a PlaylistListener for the callback.

    catalog.findPlaylistByID("2764931905001", new PlaylistListener() {
      @Override
      public void onPlaylist(Playlist playlist) {
      }
    
      @Override
      public void onError(String s) {
      }
    });
  4. In the onPlaylist() method, retrieve the videos from the playlist, add all of the videos to brightcoveVideoView, then start the first video.

    @Override
      public void onPlaylist(Playlist playlist) {
        brightcoveVideoView.addAll(playlist.getVideos());
        brightcoveVideoView.start();
      }
  5. In the onError() method throw the error string.

     @Override
      public void onError(String s) {
        throw new RuntimeException(s);
      }
  6. Check to be sure your onCreate() method appears as follows:

    @Override
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
    
        // Get the event emitter from the SDK and create a catalog request to fetch a video from the
        // Brightcove Edge service, given a video id, an account id and a policy key.
        EventEmitter eventEmitter = brightcoveVideoView.getEventEmitter();
        Catalog catalog = new Catalog(eventEmitter, getString(R.string.account), getString(R.string.policy));
    
        catalog.findPlaylistByID("2764931905001", new PlaylistListener() {
          @Override
          public void onPlaylist(Playlist playlist) {
            brightcoveVideoView.addAll(playlist.getVideos());
            brightcoveVideoView.start();
          }
    
          @Override
          public void onError(String s) {
            throw new RuntimeException(s);
          }
        });
      }
  7. Run the app to confirm multiple videos from the playlist play.

You're done! Thanks for working through the Android SDK Quick Start.