[キャスト] ボタンを押すと、常に [キャスト] ダイアログが表示されます。[キャスト] ダイアログでは、ユーザーは Web レシーバーへの接続、Web レシーバーの制御、Web レシーバーからの切断を行うことができます。
カスタム実装を開発する場合や、iOS または Chrome 向けのアプリをビルドする場合は、このダイアログを 一貫した方法で実装する必要があります。これにより、ユーザーはデバイス、アプリ、プラットフォーム間で一貫して機能することを 認識し、信頼することができます。例については、 リファレンス アプリをご覧ください。
[キャスト] ダイアログ(未接続、レシーバーあり)
マルチユーザー シナリオに関する注意事項:
- 別のユーザーが、同じアプリとアカウントから現在キャスト中のレシーバーに接続すると、送信元アプリにキャスト コンテンツのコントロールが表示されます。
- 別のユーザーが、キャストしていないアプリから現在キャスト中のレシーバーに接続すると、以前の送信元アプリ が切断され、新しい送信元アプリが接続されます。
Android
[キャスト] ダイアログ(未接続)
キャストのホーム画面
iOS
[キャスト] ダイアログ(未接続)
キャストのホーム画面
Chrome
[キャスト] ダイアログ(未接続)
キャストのホーム画面
[キャスト] ダイアログ(未接続、iOS のみ)
iOS の場合、初めてキャストするときに、キャスト デバイスへのローカル ネットワーク アクセス(LNA)を許可することに同意する必要があります 。この権限が必要な理由を説明するインタースティシャル情報画面が表示された後、標準の Apple LNA 権限ダイアログが表示されます。
初めてキャストした後、ユーザーが Wi-Fi に接続しているときに [キャスト アイコン] をタップしてもデバイスが見つからない場合は、Web レシーバーが利用できない理由(たとえば、ローカル ネットワーク アクセスが無効になっている、Wi-Fi ネットワークに問題があるなど)を説明するヘルプ画面が表示されます。
必須:
A 初回キャスト: キャスト アイコンを初めてタップした後、アプリがローカル ネットワーク デバイスにアクセスできるようにする必要がある理由を説明するインタースティシャルを表示する必要があります。インタースティシャルには、
ローカル ネットワーク アクセスが必要な理由を含める必要があります。これにより、ユーザーが
ローカル権限アクセスを許可する可能性が高まります。
B レシーバーが利用できない: キャスト アイコンをタップすると、Web レシーバーを検出できない理由を説明するヘルプ画面が表示されます。また、LNA 権限の問題を解決するための [設定] へのリンクも表示されます。
初回キャスト(iOS)
初回キャスト: インタースティシャルとローカル ネットワーク アクセス権限
レシーバーが利用できない
レシーバーが利用できない
[キャスト] ダイアログ(接続済み、キャストしていない)
[必須]
A 送信元アプリが Web レシーバーに接続されているときに [キャスト] ボタンをタップすると、[キャスト] ダイアログが表示されます。
B [キャスト] ダイアログのタイトル「Receiver-Name」が表示されます。
C [キャスト] ダイアログに、キャストを停止するボタンが表示されます。ボタンのラベルは「キャストを停止」です(切断について詳しくは、送信元がキャストを停止するをご覧ください)。
Android
[キャスト] ダイアログ(接続済み、キャストしていない)
レシーバー アプリの読み込み完了 / アイドル状態
iOS
[キャスト] ダイアログ(接続済み、キャストしていない)
レシーバー アプリの読み込み完了 / アイドル状態
[キャスト] ダイアログ(キャスト中)
必須
A [キャスト] ダイアログのタイトル「Receiver-Name」が表示されます。
B 現在キャスト中のレシーバーまたはコンテンツがタイトルの下に表示されます。
C [キャスト] ダイアログに、キャストを停止する [キャストを停止] ボタンが表示されます(詳しくは、送信元がキャストを停止するをご覧ください)。
効果的な手法
- 最高のユーザー エクスペリエンスを実現するため、 永続的なコントロール を [キャスト] ダイアログのコントロールに加えて提供します。
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