ステップバイステップ：Android用ネイティブSDKを使用したシンプルなビデオアプリ

概要

このクイックスタートを完了すると、以下ができるようになります。

• Gradle を使用して、プロジェクトを作成し、Android 用 Brightcove Player SDK を追加します。
• レイアウトを変更してを含めますBrightcoveExoPlayerVideoView。
• onCreate()動画を再生する方法に追加します。異なるソースから。

Audience

開発に Android Studio を使用し、Android アプリで Android 用 Brightcove Player SDK を使用することに興味がある開発者。

前提条件

JavaとAndroidアプリの開発に関する最小限の知識。

準備しろ

Android Studioをインストールして開発の準備をしてください

1. Androidスタジオアプリケーションをダウンロードします。
2. ページの指示に従って、アプリケーションをインストールします。

プロジェクトを作成する

Android Studioでプロジェクトを作成し、Gradleを使用してプレーヤーSDKにリンクします。

Androidスタジオでプロジェクトを作成する

1. Androidスタジオを開きます。
   • Android Studio を初めて開く場合は、[ 新しい Android Studio プロジェクトを開始する ] を選択します。
   • メニューが表示されている場合は、[ ファイル] [新規作成] [> > 新規プロジェクト ] の順に選択します。
2. [ プロジェクトの選択] ウィンドウで、[ Empty Views Activity ] を選択し、[ 次へ ] をクリックします。このガイドでは Java、XML レイアウト、Groovy の Gradle ファイルを使用し、Compose のアクティビティは使用しません。古い Android Studio では、このテンプレートは Empty Activity と表示されます。

   

3. Name、Package name、Save location、Language、Minimum SDK の値を指定します。Build configuration language は Groovy DSL (build.gradle) に設定してください。ウィザードの既定値は Kotlin DSL ですが、このガイドの Gradle スニペットは Groovy の構文を使用します。このクイックスタートでは、以下の値が使用されます。

   

4. [Finish]をクリックします。

5. Android Studioはしばらく動作し、最終的にプロジェクトの初期状態を表示します。

   

Gradle を使用して Android 用 Brightcove Player SDK を追加する

1. settings.gradle の依存関係リポジトリに Brightcove Maven リポジトリを追加します。

   dependencyResolutionManagement {
       repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
       repositories {
           google()
           mavenCentral()
           maven { url 'https://repo.brightcove.com/releases' }
       }
   }

2. Gradle の実行には JDK 17 を使用します。現在のサンプルは Android Gradle Plugin 8.10.1 と Gradle 8.13 ラッパーを使用します。古い Gradle 7 の構成にダウングレードしないでください。
3. モジュールの build.gradle を、現在のサンプルと同様に設定します。

   android {
       compileSdk 36
       defaultConfig {
           minSdk 21
           targetSdk 36
       }
       compileOptions {
           sourceCompatibility JavaVersion.VERSION_17
           targetCompatibility JavaVersion.VERSION_17
           coreLibraryDesugaringEnabled true
       }
   }
   
   dependencies {
       implementation "com.brightcove.player:exoplayer2:${anpVersion}"
       implementation 'androidx.appcompat:appcompat:1.6.1'
       implementation 'androidx.constraintlayout:constraintlayout:2.1.4'
       coreLibraryDesugaring 'com.android.tools:desugar_jdk_libs:2.1.3'
   }

   exoplayer2 アーティファクトは、コア SDK を推移的依存関係として含みます。SDK 10.0.0 以降、このアーティファクトは名前を維持したまま AndroidX Media3 を使用します。

   ビルドごとにバージョンが変わらないように、+ を含む動的バージョンではなく、特定のリリース済みバージョンを指定してください。

4. gradle.properties に次を設定します。最新のリリースバージョンは SDK の概要で確認できます。

   android.useAndroidX=true
   anpVersion=10.4.32
   org.gradle.jvmargs=-Xmx4g

5. プロジェクトを同期して変更を反映します。

アプリケーションのコード化

次に、アプリをレイアウトし、ビデオリストを作成し、ビデオを再生するコードを記述します

アプリのレイアウトを定義する

Empty Views Activity テンプレートでは、TextView を含む単純なレイアウトが作成されます。これを、プレーヤーのビューを定義する BrightcoveExoPlayerVideoView に置き換えます。

1. ファイルを開きますapp/res/layout/activity_main.xml。

2. ファイルのタブの下部にある [ テキスト ] をクリックして、未処理の XML を表示します。

   

3. TextView既存の要素を削除し、BrightcoveExoPlayerVideoViewセクションを追加して、結果の XML が次のように表示されるようにします。後で使用するための注意idビューの名前が付けられていますbrightcove_video_view。

   <?xml version="1.0" encoding="utf-8"?>
       <androidx.constraintlayout.widget.ConstraintLayout 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"
           tools:context="com.brightcove.playvideos.MainActivity">
   
       <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"/>
       </androidx.constraintlayout.widget.ConstraintLayout>

アプリがインターネットを使用できるようにする

1. app/manifests/AndroidManifest.xmlファイルを開きます。

2. <application>コードブロックの直後に、</manifest>終了タグの上に、以下を挿入してインターネットアクセスを有効にします。

   <uses-permission android:name="android.permission.INTERNET"/>

3. プロジェクトを同期して再構築し、これらの変更を取り上げます。

ビューを作成してビデオを再生する

1. MainActivity.javaファイルに戻ります。MainActivityクラスの場合は、クラスを拡張しますBrightcovePlayer。これにより、アプリのデフォルトのライフサイクル管理が提供されます。

   public class MainActivity extends BrightcovePlayer {

2. BrightcovePlayerクラスはプロジェクトに自動的にはインポートされません。オプション+リターンキーを押して、importクラスのステートメントを追加します。

   前:

   

   後:

   

   これは、プロジェクトに追加するすべての新しいクラスに対して行います。

3. onCreate()関数を見つけます。関数内の既存のコードの下に、以下を追加します。

   • のインスタンスを作成しBrightcoveExoPlayerVideoView、レイアウトに関連付けます。ほとんどの場合、Explayer ビューを使用します。詳細については、「ビデオビューの選択」ドキュメントを参照してください。

   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);

   BrightcoveExoPlayerVideoViewクラスをインポートすることを忘れないでください。

4. 次に、setAccount()アナリティクスメソッドを使用して Brightcove Player アカウント ID をBrightcoveに送信する必要があります。

   Analytics analytics = brightcoveVideoView.getAnalytics();
   analytics.setAccount("your account Id");

5. オプション:BrightcoveExoPlayerVideoViewクラスを上書きした場合、または Brightcove プレーヤーとカタログを使用しない場合は、Video Cloud パブリッシャー ID を Video Cloud Analytics に送信する必要があります。これは、setAccount()分析メソッドを使用して行うことができます。これにより、このアプリのデータを Video Cloud Analytics で表示できます。

   Analytics analytics = brightcoveVideoView.getAnalytics();
   analytics.setAccount("your account Id");

6. リモートサーバーでホストされているビデオからビデオオブジェクトを作成します。使用するビデオの種類に合わせて、を設定します。DeliveryType

   Video video = Video.createVideo("https://sdks.support.brightcove.com/assets/videos/hls/greatblueheron/greatblueheron.m3u8",
     DeliveryType.HLS);

7. ビデオの再生を開始する前に、ポスター画像として使用するリモート画像をロードします。

   try {
     java.net.URI myposterImage = new java.net.URI("https://solutions.brightcove.com/bcls/assets/images/Great-Blue-Heron.png");
     video.getProperties().put(Video.Fields.STILL_IMAGE_URI, myposterImage);
   } catch (URISyntaxException e) {
     e.printStackTrace();
   }

8. ビデオをビューに追加し、ビデオの再生を開始します。

   brightcoveVideoView.add(video);
   brightcoveVideoView.start();

9. onCreate()メソッドが次のように表示されることを確認します。

   @Override
     protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);
       brightcoveVideoView = (BrightcoveExoPlayerVideoView) findViewById(R.id.brightcove_video_view);
   
       // Optional: For Brightcove Player customers to register their apps
       Analytics analytics = brightcoveVideoView.getAnalytics();
       analytics.setAccount("your account Id");
   
       // Define a video from a remote server
       Video video = Video.createVideo("https://sdks.support.brightcove.com/assets/videos/hls/greatblueheron/greatblueheron.m3u8", DeliveryType.HLS);
   
       // Load a remote poster image
       try {
           java.net.URI myposterImage = new java.net.URI("https://solutions.brightcove.com/bcls/assets/images/Great-Blue-Heron.png");
           video.getProperties().put(Video.Fields.STILL_IMAGE_URI, myposterImage);
       } catch (URISyntaxException e) {
           e.printStackTrace();
       }
   
       // Add video to the view
       brightcoveVideoView.add(video);
       // Start video playback
       brightcoveVideoView.start();
     }

10. アプリケーションを実行またはデバッグして、ビデオの再生を確認します。