Android環境

Prev Next

Classic/VPC環境で利用できます。

Android環境では、Android専用プレイヤー開発のための Video Player Enhancement Android SDKの使用方法とプレイヤー適用およびオプション設定方法について説明します。

参考

Android用 Video Player Enhancement SDKを使用するには Standardプランを利用する必要があり、以下の仕様が要求されます。

  • 最小仕様: API 26(Oreo 8.0)以上、gradle 4.2.2以上
  • 開発環境: Android Studio

SDKのインストールと環境設定

SDKをインストールしてフレームワークを追加する方法は、次の通りです。

  1. NAVERクラウドプラットフォームコンソールの Region メニューや Platform メニューから利用中の環境をクリックします。
  2. Services > Media > Video Player Enhancement メニューを順にクリックします。
  3. Video Player Management メニューをクリックします。
  4. プレイヤーリストから SDKをダウンロードするプレイヤーの [SDKアドレス] ボタンをクリックします。
  5. モバイルネイティブ SDKsダウンロード[Android] ボタンをクリックします。
  • 圧縮ファイルがダウンロードされます。
  1. ダウンロードした SDKファイルを root > app > libsのパスに追加します。
  2. appの下の build.gradleファイルの dependenciesに次の項目を追加します。
    dependencies {
        ...
        implementation files('libs/NCPlayerSDK.aar')
        implementation 'com.google.code.gson:gson:2.10.1'
    }
    

プレイヤーの適用と設定

プレイヤーを適用してオプションを設定するためには、次の手順に従います。

1. 初期化

次のように NCPlayerSDKインスタンスを初期化し、Delegateを設定します。

...
import com.sgrsoft.ncp_aos.*
...
class MainActivity : AppCompatActivity() {
    ...
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        ...
        var delegate = PlayerDelegate()
        NCPlayer.delegate = delegate

    }
}

2. プレイヤー設定

プレイヤーを設定する方法は、次の通りです。

  1. NAVERクラウドプラットフォームコンソールの Region メニューや Platform メニューから利用中の環境をクリックします。

  2. Services > Media > Video Player Enhancement メニューを順にクリックします。

  3. Video Player Management メニューをクリックします。

  4. 設定するプレイヤーの [SDKアドレス] ボタンをクリックします。

  5. Player SDKアドレスのポップアップが表示されたら、 SDKアドレス から access_key値を確認します。
    vpe-ios_key_ko

  6. Android Studioで NCPlayerViewを使用する UIViewを作成します。

  7. プレイヤーのオプションを設定します。

    • プレイヤー設定とこのガイドのプレイヤー設定スクリプトをご参照ください。
    import com.sgrsoft.ncp_aos.*
    ...
    class MainActivity : AppCompatActivity() {
        ...
        private lateinit var webView: WebView;
    
        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContentView(R.layout.activity_main)
            ...
    
            webView = findViewById(R.id.webVIew)
    
            //登録済みの APPLICATION_IDを使用、コンソールに登録されたパッケージ IDのみ許可
            var packageId = BuildConfig.APPLICATION_ID
    
            // licenseKey = access_key
            var licenseKey = "{access_key}" 
    
            // 画面録画およびキャプチャ防止機能の使用有無(true: 機能制限)
            var isScreenCaptureDeny = false
    
            // NCPlayerViewを作成
            var player = NCPlayerView()
    
            // NCPlayerViewウェブビューとの関連付け
            player.webView = webView
    
            NCPlayer.prefs.setString("appId",packageId)
            NCPlayer.prefs.setString("licenseKey",licenseKey)
            NCPlayer.prefs.setString("isScreenCaptureDeny", isScreenCaptureDeny.toString())
    
            // プレイヤーオプション(コンソールで作成されたスクリプトコードを使用)
            val playerOptions = 
            """
            {
                "playlist":[
                    {
                        "file":"https://CDNドメイン/example_video_01.mp4",
                        "poster":"https://CDNドメイン/example_video_01.png",
                    }
                ],
                "autostart":true,
            }
    
            """
            // 実行
            player.play(playerOptions,this)
        }
    }
    
  8. 録画防止のため、次のようにコードを作成します。

    import com.sgrsoft.ncp_aos.*
    ...
    class MainActivity : AppCompatActivity() {
        ...
    
        private lateinit var webView: WebView;
        var player = NCPlayerView()
    
        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContentView(R.layout.activity_main)
            ...
            // 画面録画およびキャプチャ防止機能の使用有無(true: 機能制限)
            val isScreenCaptureDeny = false
    
            // NCPlayerに変数を登録
            // ""内の string値は変更禁止
            NCPlayer.prefs.setString("isScreenCaptureDeny", isScreenCaptureDeny.toString())
        }
    }
    
  9. Picture in Picture機能を使用するため、次のようにコードを作成します。

    override fun onUserLeaveHint() {
    // 横の比率を入力したい場合 例) 16,9
    // 縦の比率を入力したい場合 例) 9,16
    player.enterPip(this,9,16)
    }
    
  10. ウェブビューを使用する場合はメモリリーク(Memory Leak)の防止のため、次のようにプレイヤー解除コードを作成します。

    import com.sgrsoft.ncp_aos.*
    ...
    class PlayerDelegate: NCPlayerEventInterface{
    ... 
        player.destroy()
    }
    

3. イベント設定

Player Event APIを通じて Video Player Enhancementプレイヤーで発生するイベントバインドして活用できます。方法は次の通りです。

  1. NCPlayerNetworkStatus メソッドを利用してデバイスのネットワーク接続状態を確認します。
    import com.sgrsoft.ncp_aos.*
    ...
    class PlayerDelegate: NCPlayerEventInterface{
        ...
        override fun NCPlayerNetworkStatus(state: String) {
            // state: ONLINE = 異常なし(ONLINE)
            // state: OFFLINE = 問題発生(OFFLINEまたは通信障害発生)
        }
    }
    
  2. 設定したいイベントに応じて設定方法を確認します。

横向きモード有効化イベント

デバイスを横向きに切り替える際にイベントを発生させるには、NCPlayerIsLandscape メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    override fun NCPlayerIsLandscape(state: Boolean) {
    
    }
}

TimeUpdateイベント

再生時間変化検知時にイベントを発生させるには、NCPlayerOnTimeUpdate メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    override fun NCPlayerOnTimeUpdate(data: JSONObject?) {
        // data = {"sourceType":"vod","currentTime":1,"duration":7715,"percent":0.008898181834278056,"viewingTime":1}
    }
}
参考

各プロパティの詳しい説明は、timeupdateスクリプトをご参照ください。

PrevTrackイベント

プレイリストの前の動画へ移動する際にイベントを発生させるには、NCPlayerOnPrevTrack メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    override fun NCPlayerOnPrevTrack(data: JSONObject?) {
        // {"file":"","poster":"","description":{"title":"title","created_at":"","profile_name":"string","profile_image":"string"}}
    }
}
参考

各プロパティの詳しい説明は、prevTrackスクリプトをご参照ください。

NextTrackイベント

プレイリストの次の動画へ移動する際にイベントを発生させるには、NCPlayerOnNextTrack メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    override fun NCPlayerOnNextTrack(data: JSONObject?) {
        // {"file":"","poster":"","description":{"title":"title","created_at":"","profile_name":"string","profile_image":"string"}}
    }
}
参考

各プロパティの詳しい説明は、nextTrackスクリプトをご参照ください。

コントロールバー有効化イベント

プレイヤーでコントロールバーを有効/無効にする際にイベントを発生させるには、NCPlayerOnControlbarActive メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    override fun NCPlayerOnControlbarActive(active: JSONObject?) {
        // active: true, false
    }
}

再生イベント

プレイヤーで動画を再生する際にイベントを発生させるには、NCPlayerOnPlay メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    override fun NCPlayerOnPlay() {
    
    }
}

一時停止イベント

プレイヤーで動画を一時停止する際にイベントを発生させるには、NCPlayerOnPause メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    override fun NCPlayerOnPause() {
    
    }
}

再生完了イベント

プレイヤーで動画再生が完了する際にイベントを発生させるには、NCPlayerOnEnd メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    override fun NCPlayerOnEnd() {
    
    }
}

フルスクリーンイベント

フルスクリーンへの切り替え時にイベントを発生させることができ、デバイス回転時にフルスクリーンに自動切り替えするように設定できます。

フルスクリーンイベント

プレイヤーをフルスクリーンに切り替える際にイベントを発生させるには、NCPlayerOnFullscreen メソッドを利用して次のように設定します。

import com.sgrsoft.ncp_aos.*
...
class PlayerDelegate: NCPlayerEventInterface{
    ...
    
    val delegate = PlayerDelegate()
    NCPlayer.delegate = delegate
    
    override fun NCPlayerOnFullscreenState(state: Boolean) {
        // fullscreen true / false
    }
    
    // フルスクリーンが解除した時に発生するイベント
    override fun NCPlayerOnFullscreenOff() {
    
    }
    
    // フルスクリーンに切り替わった時に発生するイベント
    override fun NCPlayerOnFullscreenOn() {
    
    }
}

フルスクリーンに自動切り替え

デバイス回転時にフルスクリーンに自動切り替えする機能を提供するには、次のように設定します。

override fun onConfigurationChanged(newConfig: Configuration) {
    super.onConfigurationChanged(newConfig)

    if (newConfig.orientation == Configuration.ORIENTATION_PORTRAIT)
    {
        NCPlayer.delegate?.NCPlayerIsLandscape(false)
        player.fullscreenOff()
    }
    else if (newConfig.orientation == Configuration.ORIENTATION_LANDSCAPE)
    {
        NCPlayer.delegate?.NCPlayerIsLandscape(true)
        player.fullscreenOn()
    }
}