Android向けプレイヤー適用

Android SDKのユースケースを実行するには Standardプランを利用する必要があり、以下の環境が要求されます。

Android Studio
外部との通信が可能な環境

プレイヤー適用

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

Android Studioを実行します。

AndroidManifest.xmlに以下のコードを追加します。

<application
...
android:hardwareAccelerated="true"
android:usesCleartextTraffic="true"
tools:replace="android:theme"

>

<activity 
...
android:configChanges="orientation|screenSize"

>

タブメニューをクリックして [Project] タブに変更し、libsにファイルを追加します。
例) ncplayerNativeSdkAosbeta
vpe-example-android_file

appレベルの build.gradleファイルを開き、libsに追加したファイルへの依存関係を宣言した後、syncを実行します。

implementation files('libs/ncplayerNativeSdkAosbeta.aar')
implementation 'com.google.code.gson:gson:2.10.1'

vpe-example-android_demo

プレイヤー設定

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

以下のコードを適用してメソッドを呼び出します。

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)

        // BuildConfig.APPLICATION_IDを appIdに保存
        // demo実行用の packageIdを利用、後に実際の packageIdとの関連付けが必要
        var packageId = "com.sgrsoft.vpe.NCPlayerDemo" // 登録済みの APPLICATION_IDを使用
        var licenseKey = "2c58aba24474208958ea3e50c4bee263" // ライセンスキーを送信するために保存

        // NCPlayerVIewを作成
        var player = NCPlayerView()

        // NCPlayerViewウェブビューとの関連付け
        player.webView = webView

        NCPlayer.prefs.setString("appId",packageId)
        NCPlayer.prefs.setString("licenseKey",licenseKey)

        val playerOptions = """
         {
            "playlist":[
                {
                    "file":"https://pdeubxscnimo10174288.cdn.ntruss.com/hls/uqyCPUeJ1Ne8ml9OtPsizg__/shorts24/j5IXBfIJ83893893_shorts,1080,720,480,p.mp4.smil/master.m3u8",
                    "poster":"https://nnbkegvqsbcu5297614.cdn.ntruss.com/profile/202211/083fff831d8904cd9d9c180e5c10be0b.png",
                    "description":{
                        "title":"NAVERクラウドテスト動画1111",
                        "created_at":"2022.07.13111",
                        "profile_name":"NAVERクラウド",
                        "profile_image":"https://nnbkegvqsbcu5297614.cdn.ntruss.com/profile/202208/d127c8db642716d84b3201f1d152e52a.png"
                    },
                },
                 {
                     "file":"https://pdeubxscnimo10174288.cdn.ntruss.com/hls/uqyCPUeJ1Ne8ml9OtPsizg__/shorts24/j5IXBfIJ83893893_shorts,1080,720,480,p.mp4.smil/master.m3u8",
                     "poster":"https://nnbkegvqsbcu5297614.cdn.ntruss.com/profile/202211/083fff831d8904cd9d9c180e5c10be0b.png",
                     "description":{
                         "title":"NAVERクラウドテスト動画1111",
                         "created_at":"2022.07.13111",
                         "profile_name":"NAVERクラウド",
                         "profile_image":"https://nnbkegvqsbcu5297614.cdn.ntruss.com/profile/202208/d127c8db642716d84b3201f1d152e52a.png"
                     },
                 },
                 {
                     "file":"https://pdeubxscnimo10174288.cdn.ntruss.com/hls/uqyCPUeJ1Ne8ml9OtPsizg__/shorts24/j5IXBfIJ83893893_shorts,1080,720,480,p.mp4.smil/master.m3u8",
                     "poster":"https://nnbkegvqsbcu5297614.cdn.ntruss.com/profile/202211/083fff831d8904cd9d9c180e5c10be0b.png",
                     "description":{
                         "title":"NAVERクラウドテスト動画1111",
                         "created_at":"2022.07.13111",
                         "profile_name":"NAVERクラウド",
                         "profile_image":"https://nnbkegvqsbcu5297614.cdn.ntruss.com/profile/202208/d127c8db642716d84b3201f1d152e52a.png"
                     },
                 }
            ],
            "autostart":true,
            "muted":true,
            "keyboardShortcut":true,
            "controls":true,
            "ui":"pc",
            "controlBtn":{
                "play":true,
                "fullscreen":true,
                "volume":true,
                "times":true,
                "pictureInPicture":true,
                "setting":true,
            },
            "progressBarColor":"#ff0000",
            "controlActiveTime":3000,
            "startMutedInfoNotVisible":false,
            "aspectRatio":"16/9",
            "objectFit":"contain",
            "playRateSetting":[0.5,0.75,1,1.5,2],
            "seekingPreview":true,
            "autoPause":false,
            "repeat":false,
            "touchGestures":true,
            "descriptionNotVisible":false,
            }

         """
        player.play(
            playerOptions,this
        )
    }
}

以下のコードを適用して NCPlayerEventInterfaceを継承する Classを作成します。

class PlayerDelegate: NCPlayerEventInterface{}

以下のコードを適用して onCreatedに delegateを設定します。

override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)

    var delegate = PlayerDelegate()
    NCPlayer.delegate = delegate

}

// 縦横の確認
override fun onConfigurationChanged(newConfig: Configuration) {
    super.onConfigurationChanged(newConfig)
    if (newConfig.orientation == Configuration.ORIENTATION_PORTRAIT)
    {
        NCPlayer.delegate?.NCPlayerIsLandscape(false)
    }
    else if (newConfig.orientation == Configuration.ORIENTATION_LANDSCAPE)
    {
        NCPlayer.delegate?.NCPlayerIsLandscape(true)
    }
}

class PlayerDelegate: NCPlayerEventInterface{
    var TAG:String = "PlayerDelegate"

    // コントロールバーの有効化・無効化の確認
    override fun NCPlayerOnControlbarActive(active: JSONObject?) {
        Log.d(TAG, "NCPlayerOnControlbarActive: $active")
    }
    // 再生が最後まで完了したときに発生するイベント
    override fun NCPlayerOnEnd() {
        Log.d(TAG, "NCPlayerOnEnd: ")
    }
    // フルスクリーン状態の有無
    override fun NCPlayerOnFullscreenState(state: Boolean) {
        Log.d(TAG, "NCPlayerOnFullscreenState: ")
    }
    // 次の動画へ進むときに発生するイベント
    override fun NCPlayerOnNextTrack(data: JSONObject?) {
        Log.d(TAG, "NCPlayerOnNextTrack: $data")
    }
    // 動画が一時停止したときに発生するイベント
    override fun NCPlayerOnPause() {
        Log.d("TAG", "NCPlayerOnPause: ")
    }
    // 動画再生リクエストに成功したときに発生するイベント
    override fun NCPlayerOnPlay() {
        Log.d("TAG", "NCPlayerOnPlay: ")
    }
    // 前の動画へ戻るときに発生するイベント
    override fun NCPlayerOnPrevTrack(data: JSONObject?) {
        Log.d(TAG, "NCPlayerOnPrevTrack: $data")
    }
    // 現在の再生時間が変更されるときに発生するイベント
    override fun NCPlayerOnTimeUpdate(data: JSONObject?) {
        Log.d(TAG, "NCPlayerOnTimeUpdate: $data")
    }
    // 縦横の確認
    override fun NCPlayerIsLandscape(state: Boolean) {
        Log.d(TAG, "NCPlayerIsLandscape: $state")
    }
}

Android向けプレイヤー適用

プレイヤー適用

プレイヤー設定

What's Next