Compose ベースの UI のスタートガイド

依存関係を追加する

Media3 ライブラリには、Jetpack Compose ベースの UI モジュールが 2 つ含まれています。Material3 モジュールはコア モジュールに依存しているため、両方を追加する必要はありません。

// Include only one of the following dependencies
implementation("androidx.media3:media3-ui-compose:1.10.0")
implementation("androidx.media3:media3-ui-compose-material3:1.10.0")

// Include only one of the following dependencies
implementation "androidx.media3:media3-ui-compose:1.10.0"
implementation "androidx.media3:media3-ui-compose-material3:1.10.0"

Compose を優先した方法でアプリを開発するか、 ビューの使用から移行することを強くおすすめします。

完全な Compose デモアプリ

media3-ui-compose ライブラリには、すぐに使用できる コンポーザブル（ボタン、インジケーター、画像、ダイアログなど）は含まれていませんが、 Compose で完全に記述されたデモアプリがあり、 PlayerView を AndroidView でラップするなどの相互運用ソリューションを回避します。このデモアプリでは、media3-ui-compose モジュールの UI 状態ホルダー クラスを使用し、Compose Material3 ライブラリを利用しています。

必要なライブラリ

必要なカスタマイズのレベルに応じて、2 つの Media3 Compose ライブラリから選択できます。違いを理解するには、 UI 状態生成パイプラインについて考えるとよいでしょう: Business logic → UI logic → UI。

UI コンポーネントを完全に制御するには、media3-ui-compose を使用します。

このライブラリは、Business logic → UI logic の接続を提供します。基本的なコンポーネントとしてPlayerSurface や ContentFrame、および Player 状態を UI 状態に変換する状態ホルダー クラス（PlayPauseButtonState など）が含まれています。

このライブラリは、すぐに使用できるマテリアル デザイン コンポーネントを提供しません 。独自の UI コンポーネントを構築してスタイルを設定する必要があります。ルックアンドフィールを最大限に制御できるため、高度にカスタマイズされたデザイン システムがある場合に最適です。

マテリアル デザインとの統合を迅速に行うには、media3-ui-compose-material3を使用します。

このライブラリは、パイプラインの最後の UI 部分を提供します。 media3-ui-compose に依存し、 Material3 コンポーネントでスタイル設定された事前構築済みのコンポーザブル関数が含まれています。これには、動画、コントロール、 プログレス バーを備えた包括的なメディア再生エクスペリエンスを提供する Player コンポーザブルが含まれます。独自のボタンやその他の UI 要素をゼロから構築する必要がなくなります。これらのコンポーネントのテーマ、色、アイコンはカスタマイズできますが、コア実装は提供されます。

概要