送信者アプリ

コンテンツがウェブ レシーバーにキャストされているときは、ユーザーが常に送信側アプリからコンテンツをコントロールできる必要があります。

: Google Cast SDK 追加デベロッパー向け利用規約に基づき、キャスト メディア アプリでは、Web Receiver でのメディア再生を制御するには、SDK 用に定義された Play コントロール API(メディア再生メッセージ)を使用する必要があります。

センダー アプリは、以下の領域にキャスト コントロールを提供する必要があります。

センダーアプリのキャスト再生ステータスとこれらの領域のコントロールは、送信側アプリからのものではない場合でも、ウェブ レシーバーで発生する再生変更と同期する必要があります。これにより、マルチセンダー コマンドと、デバイスのリモコンやボタンなどから発生する再生コントロールの両方を適切に処理できるようになります。

Android

ダイアログのキャスト コントロール

ミニ コントローラ

通知管理

画面制御のロック

iOS

ダイアログのキャスト コントロール

ミニ コントローラ

Chrome

ダイアログのキャスト コントロール

ミニ コントローラ

 

  送信者の音量調節

送信側アプリでは、ユーザーが送信側のデバイスのハードウェアの音量ボタンやソフトウェアの音量スライダーを使用して、テレビやスピーカーで再生されるコンテンツの音量を調節できるようにする必要があります。次のいずれかを制御します。

  • Chromecast などの Google Cast デバイスの場合は、テレビに送信されるオーディオ レベル。
  • Google Cast TV、Android TV 搭載テレビ、スマート スピーカーで使用される実際のテレビやスピーカーの音量。

必須
  A  送信側アプリでは、ユーザーが送信側のデバイスのハードウェアの音量ボタンやソフトウェアの音量スライダーを使用して、テレビやスピーカーで再生されるコンテンツの音量を制御できるようにする必要があります。

  • Android: ハードウェア ボタンとソフトウェアの音量スライダーの両方のサポートは必須です。
  • iOS: ソフトウェアの音量スライダーは必須です。
  • ウェブ/Chrome: ソフトウェアの音量スライダーのサポートは必須です。

  B  モバイル デバイスでは、キャスト中に、キャスト ダイアログでソフトウェアの音量スライダーを使用可能にする必要があります。
  C  送信側アプリの音量スライダーは、Web Receiver に接続した後、現在の Web Receiver の音量と同期して同期する必要があります。
  D  送信側アプリの音量スライダーに、他の送信側または Chromecast アプリのリモコンで行った音量の変更を反映させる必要があります。
  E  センダーアプリは、あらかじめ定義されたレベルに音量を設定せず、ユーザーが開始する音量変更のみを渡すようにしてください。
  F   Android のみ: ハードウェア ボタンを使用して Web Receiver の音量レベルを変更する場合は、ハードウェアの音量ボタンを押したときに、視覚的な音量スライダー(左にキャスト アイコン付き)を表示する必要があります。注: Android Gingerbread(バージョン 2.3)の場合、キャスト アイコンは表示されません。

運用のヒント

  • 音量の増分:
    • Android: フレームワークが自動的に音量を上げます。
    • iOS、Chrome: ハードウェアの音量ボタンの場合、オーディオ/ビデオ デバイスではウェブ レシーバー デバイスの最大音量の 5% 以下、音声のみのデバイスの場合はウェブ レシーバー デバイスの最大音量範囲の 2% 以下で増減します。

  送信者拡張コントローラ

センダーアプリは、キャストされるコンテンツ用の拡張コントローラを提供する必要があります。

必須
  A   コンテンツ タイトルまたはアートワークを表示することで、キャストされているコンテンツを識別します。
  B  再生を開始する前に、読み込みインジケーターと、コンテンツ タイトルまたはアートワークを表示します。
  C   コンテンツの開始時に、Web Receiver の状態を特定します。
  D   関連する管理を行います。
  E  シークバーの左端で、現在の再生時間を表示します。
既知の場合、ライブ ストリームでない場合は、右端にストリームの合計時間を表示します。
  F  キャストに関係のないコントロールは表示されません。
  G  ユーザーが拡張コントローラから離れるときにキャストを切断または停止しないでください。
  H   ユーザーが離脱したときに、拡張コントローラに簡単に戻る方法を提供します。

運用のヒント

  • メディア ストリームの再生位置スライダーを提供します。
  • その他の有用なコンテンツ関連のアートワークやメタデータを表示します。
  • メディア ストリームの経過時間とコンテンツの長さを特定する。

Android

送信者のコンテンツを読み込んでいます

送信者のコンテンツを読み込んでいます

レシーバーのコンテンツを読み込んでいます

送信者のコンテンツを再生中

コンテンツを再生するウェブ レシーバー

iOS

送信者のコンテンツを読み込んでいます

Web Receiver のコンテンツを読み込んでいます

送信者のコンテンツを再生中

コンテンツを再生するウェブ レシーバー

Chrome

送信者のコンテンツを読み込んでいます

Web Receiver のコンテンツを読み込んでいます

送信者のコンテンツを再生中

コンテンツを再生するウェブ レシーバー

 

  センダー ミニ コントローラ

キャスト中にユーザーが現在のコンテンツ ページまたは拡張コントローラからセンダーアプリ内の別のビューに移動すると、ミニ コントローラと呼ばれる永続的な小さなコントロールが表示されます。ミニ コントローラは現在のキャストのリマインダーを表示し、すぐにアクセスできます。

必須
A 送信側アプリの下部付近に、キャストしているものを表示するバーまたはボックスが表示されます。これらのコントロールは、ユーザーがアプリの他のコンテンツやセクションをブラウジングしている間も維持されます。
B このコントロールは、シンプルで、キャストしている内容を伝えるのが最適に動作します。
  C   アプリのすべての画面(拡張コントローラ ページを除く)で利用できます。
  D   コンテンツ領域をタップすると、拡張コントローラが開きます。
  E  即時の対応に関連するその他のコントロールを提供します。

おすすめの方法
最適なユーザー エクスペリエンスを実現するには、ミニ コントローラに加えて、キャスト ダイアログでコントロールを提供します。

Android

センダー ミニ コントローラ

Web Receiver のコンテンツを一時停止しました

iOS

センダー ミニ コントローラ

Web Receiver のコンテンツを一時停止しました

Chrome

センダー ミニ コントローラ

Web Receiver のコンテンツを一時停止しました

 

  送信者への通知

必須(Android のみ)
  A  ステータスバーの通知には、(キャスト アイコンではなく)アプリアイコンを使用します。
  B  キャストしているコンテンツを特定します。たとえば、コンテンツのタイトルやアートワークを表示します。
  C  キャストしているウェブ レシーバーを特定します。
  D   基本的なコンテンツ コントロールを提供する。
  E   アクションの行に「X」を表示して、キャストを停止し、ウェブ レシーバーから切断します。
  F  アプリのロゴ、コンテンツ タイトル、またはアートワークをタップすると、送信側アプリの拡張コントローラが開きます。

メモ

  • Android のみ: iOS または Chrome には通知を実装できません。
  • Android Gingerbread(バージョン 2.3)では、通知にはアプリのアイコンとテキストのみが表示され、再生/一時停止や停止は表示されません。
  • 詳しくは、通知へのメディア コントロールの追加をご覧ください。

Android

送信者通知アイコン

コンテンツを再生するウェブ レシーバー

送信者への通知の管理

コンテンツを再生するウェブ レシーバー

 

  送信者のロック画面

必須(Android のみ)
  A   コンテンツ タイトルまたはアートワークでキャストされているコンテンツを特定します。
  B  キャストしているウェブ レシーバーを特定します。Music アプリの場合、これは必須ではありません。
  C   再生コントロールを提供します。
  D   ハードウェア ボタンで音量コントロールにアクセスできるようにします。

Android 4.4 KitKat 以降のバージョンで必須:

  • アプリアイコン
  • アートワーク(アルバムカバーなど)
  • キャストしているコンテンツをテキストで識別する(「Tears of Steel」など)
  • キャストしているウェブ レシーバーを特定する(「リビングルーム」など)

Android 4.3 Jelly Bean では必須です。

  • アートワーク(アルバムカバーなど)
  • キャストしているコンテンツをテキストで識別する(「Tears of Steel」など)
  • キャストしているウェブ レシーバーを特定する(「リビングルーム」など)

メモ

  • Android のみ: iOS または Chrome には通知を実装できません。
  • Android 4.1 以降のバージョンでは、ロック画面のコントロールが必須です。
  • Android オペレーティング システムのバージョンによってさまざまなコントロールが利用可能であり、ロック画面にはテキスト フィールドのみを表示できます。一般に、グラフィックやアイコンの画像は、テキストよりもコンテンツをわかりやすく表現します。
  • スマートフォンがロックされているときは、音量調節ハードウェア ボタンで送信側アプリの音量を調整する必要があります。
  • コントロールではフレームワーク コンポーネント MediaSession または MediaSessionCompat(バージョン 4.4 と 4.3 の場合)、または Notification(5.0 以降の場合)を使用する必要があります。

Android

送信者のロック画面のコントロール

コンテンツを再生するウェブ レシーバー

 

  送信者がキャストを再開する

接続済みのセンダーアプリは、暗黙的に切断された(ネットワークの切断、デバイスがスリープ状態になった、バッテリーが切れたなど)後に、接続状態を復元する必要があります。

必須
  A   送信側アプリが暗黙的に切断した場合(ユーザーが明示的にキャストを停止または切断しなかった場合)、キャスト コンテンツは引き続きウェブ レシーバーで再生されます。アプリまたは接続が再起動された場合、送信側アプリは、Web Receiver セッションが最新である限り、ウェブ レシーバーへの接続を復元する必要があります。
  B  キャスト アイコンが接続状態に戻ります。
  C  センダーが再接続する前にユーザーがキャスト アイコンをタップすると、ウェブ レシーバー デバイスのリストが表示されます。ユーザーがキャスト中のウェブ レシーバーを選択すると、送信側アプリにミニまたは拡張コントローラが表示されます。


停電やその他のコンテキスト外の中断が原因で、Web Receiver アプリが切断したり、実行を停止したりする場合があります。これは、センダーがキャストを停止するで説明されているように、通常のセッション終了として扱われます。

Android

アプリの選択

コンテンツを再生するウェブ レシーバー

キャスト接続を復元しました

コンテンツを再生するウェブ レシーバー

iOS

アプリの選択

コンテンツを再生するウェブ レシーバー

キャスト接続を復元しました

コンテンツを再生するウェブ レシーバー

 

  送信者がキャストを停止する

テレビにキャストされたコンテンツは、ユーザーが [キャストを停止] を選択するか、センダーが新しいものをキャストするまで再生を続けます。同じウェブ レシーバーに複数のセンダーが接続されている場合、各センダー アプリのキャスト ダイアログに [キャストを停止] ボタンではなく、[接続を解除] ボタンが表示されます。

必須
  A   1 つのウェブ レシーバーに複数のセンダーが接続されている場合、[1 つのセンダーアプリからのキャストを停止] を押しても、ウェブ レシーバーには何も反応せず、そのセンダー デバイスからキャスト コントロールと通知が削除されます。接続されている残りの送信側デバイスは、キャスト コントロールを利用できる状態で引き続き接続されます。
  B  送信側アプリが暗黙的に切断された場合(送信側デバイスのバッテリーが切れた場合や、送信側デバイスのウェブ レシーバーへのネットワーク接続が切断された場合など)、ウェブ レシーバーに対しては何も行われず、送信側デバイスからキャスト コントロールと通知が削除されます。送信側アプリは暗黙的に切断された接続を追跡し、送信側アプリを再度開いたときにウェブ レシーバーへの再接続を試みる必要があります。

Android

キャスト ダイアログ、接続解除ボタン

コンテンツを再生するウェブ レシーバー

iOS

キャスト ダイアログ、接続解除ボタン

コンテンツを再生するウェブ レシーバー

Chrome

キャスト ダイアログ、接続解除ボタン

コンテンツを再生するウェブ レシーバー

 

 

このデザインガイドで使用されている画像は、Blender Foundation により著作権またはクリエイティブ・コモンズ ライセンスに基づいて共有されているものです。

  • Elephant's Dream: (c)copyright 2006、Blender Foundation / Netherlands Media Art Institute / www.elephantsdream.org
  • Sintel: (c)copyright Blender Foundation | www.sintel.org
  • Tears of Steel: (CC)Blender Foundation | mango.blender.org
  • Big Buck Bunny: (c)copyright 2008、Blender Foundation / www.bigbuckbunny.org