キャスト ボタンが押されるたびに、キャスト ダイアログが表示されます。キャスト ダイアログでは、ユーザーが Web レシーバに接続したり、Web レシーバを操作したり、Web レシーバから切断したりできます。
カスタム実装を開発している場合や、iOS または Chrome 向けアプリを構築している場合は、このダイアログを整合性のある方法で実装する必要があります。これにより、ユーザーはデバイス、アプリ、プラットフォーム間で一貫して機能することを認識し、信頼することができます。例については、リファレンス アプリをご覧ください。
キャスト ダイアログ、未接続(レシーバーあり)
必須(
Android MediaRouter のデフォルトの動作):
A 送信側アプリがキャスト レシーバーに接続されていない場合、キャスト アイコンをタップするとキャスト ダイアログが表示されます。
B キャスト ダイアログのタイトル「キャスト先」が表示されます。
C キャスト ダイアログに、利用可能なウェブ レシーバーのリストが表示されます。
D 現在キャスト中の各レシーバーに「アプリ名をキャスト中」と表示されます。
マルチユーザー シナリオに注意してください。
- 別のユーザーが、現在同じアプリとアカウントからキャストしているレシーバーに接続すると、送信側アプリはキャスト コンテンツのコントロールを提供します。
- キャストしていないアプリからキャスト中のレシーバーに別のユーザーが接続すると、以前の送信側アプリが切断され、新しい送信側アプリが接続されます。
Android
キャスト ダイアログ、未接続

ホーム画面をキャストする

iOS
キャスト ダイアログ、未接続

ホーム画面をキャストする

Chrome
キャスト ダイアログ、未接続

ホーム画面をキャストする

接続されていないキャスト ダイアログ(iOS のみ)
iOS の場合、初めてキャストする際に、ユーザーはキャスト デバイスへのローカル ネットワーク アクセス(LNA)を許可することに同意する必要があります。ユーザーに、この権限が必要な理由を説明するインタースティシャル情報画面が表示され、その後に標準の Apple LNA 権限ダイアログが表示されます。
初回キャスト後、ユーザーが Wi-Fi に接続している状態でキャスト アイコンをタップしたときにデバイスが見つからない場合は、ウェブ レシーバが利用できない理由(ローカル ネットワークへのアクセスが無効になっている、Wi-Fi ネットワークに問題があるなど)を説明するヘルプ画面が表示されます。
必須:
初回キャスト: キャストボタンを初めてタップした後、アプリがローカル ネットワーク デバイスにアクセスすることを許可する必要がある理由をユーザーに説明するインタースティシャルを表示する必要があります。ユーザーがローカル権限へのアクセスを許可する可能性を高めるため、ローカル ネットワークへのアクセスが必要な理由に関する情報をインタースティシャルに含める必要があります。
B レシーバーが利用できない: [キャスト] ボタンをタップすると、ユーザーがウェブ レシーバーを見つけられない理由と、LNA 権限の問題を解決するための設定へのリンクが記載されたヘルプ画面が表示されます。
初めてのキャスト(iOS)
初回キャスト: インタースティシャルとローカル ネットワーク アクセス権限

レシーバが利用できない
レシーバが利用できない

キャスト ダイアログ、接続済みだがキャストしていない
必須
A 送信側アプリがウェブ レシーバーに接続されている場合、キャスト ボタンをタップするとキャスト ダイアログが表示されます。
B キャスト ダイアログのタイトルに「Receiver-Name」と表示されます。
C キャスト ダイアログに、キャストを停止するボタンが表示されます。ボタンのラベルは「キャストを停止」です(切断について詳しくは、送信側がキャストを停止するをご覧ください)。
Android
キャスト ダイアログ、接続済みだがキャストされていない

レシーバー アプリが読み込まれた / アイドル状態

iOS
キャスト ダイアログ、接続済みだがキャストされていない

レシーバー アプリが読み込まれた / アイドル状態

キャスト中のキャスト ダイアログ
必須
A キャスト ダイアログのタイトル「Receiver-Name」が表示される
B 現在キャスト中のレシーバまたはコンテンツがタイトルの下に表示される
C キャスト ダイアログに、キャストを停止する [キャストを停止] ボタンが表示される(詳しくは、送信側がキャストを停止するを参照)
ベスト プラクティス
- 最適なユーザー エクスペリエンスを提供するため、Cast ダイアログのコントロールに加えて、永続的なコントロールを提供します。
Android
キャスト ダイアログ(キャスト中)

レシーバーがコンテンツを再生している

iOS
キャスト ダイアログ(キャスト中)

レシーバーがコンテンツを再生している

Chrome
キャスト ダイアログ(キャスト中)

レシーバーがコンテンツを再生している

このデザイン ガイドで使用されている画像は、Blender Foundation の提供によるもので、著作権またはクリエイティブ・コモンズ ライセンスに基づいて共有されています。
- Elephant's Dream: (c) copyright 2006, Blender Foundation / Netherlands Media Art Institute / www.elephantsdream.org
- Sintel: (c) コピーライト: 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