Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Dialog Cast ditampilkan setiap kali tombol Cast ditekan. Dialog Cast memungkinkan pengguna
menghubungkan, mengontrol, dan memutuskan sambungan dari Penerima Web.
Jika Anda mengembangkan penerapan kustom atau membuat aplikasi untuk iOS atau Chrome, Anda harus
menerapkan dialog ini secara konsisten, sehingga pengguna mengenali dan memercayainya berfungsi
secara konsisten di seluruh perangkat, aplikasi, dan platform. Lihat
Aplikasi referensi untuk contoh.
Wajib (perilaku default
Android MediaRouter):
A Saat aplikasi pengirim tidak terhubung ke penerima Cast,
mengetuk tombol Cast akan menampilkan dialog Cast
B Judul dialog Cast, "Transmisikan ke" akan muncul
C Dialog Cast menampilkan daftar Penerima Web yang tersedia
D Setiap penerima yang saat ini melakukan transmisi akan menampilkan, "Mentransmisikan
nama aplikasi"
Perhatikan skenario multi-pengguna:
Saat pengguna lain terhubung ke penerima yang saat ini melakukan transmisi
dari aplikasi dan akun yang sama, aplikasi pengirim menyediakan kontrol untuk
konten transmisi.
Saat pengguna lain terhubung ke penerima yang saat ini melakukan transmisi
dari aplikasi yang tidak melakukan transmisi, aplikasi pengirim sebelumnya
akan terputus dan aplikasi pengirim baru akan terhubung.
Untuk iOS, saat melakukan transmisi untuk pertama kalinya, pengguna harus menyetujui untuk mengizinkan akses jaringan lokal (LNA) ke perangkat Cast. Layar informasi interstisial ditampilkan
kepada pengguna yang menjelaskan alasan izin ini diperlukan, diikuti dengan dialog izin
LNA Apple standar.
Setelah melakukan transmisi untuk pertama kalinya, jika tidak ada perangkat yang ditemukan saat tombol Cast diketuk saat pengguna terhubung ke Wi-Fi, layar bantuan akan ditampilkan yang menjelaskan mengapa Penerima Web mungkin tidak tersedia (misalnya, akses jaringan lokal dinonaktifkan, atau ada masalah dengan jaringan Wi-Fi).
Wajib:
A Transmisi pertama kali: Setelah mengetuk tombol Cast untuk pertama kalinya, iklan Interstisial harus ditampilkan untuk menjelaskan kepada pengguna alasan mereka harus mengizinkan aplikasi mengakses perangkat jaringan lokal. Interstisial harus menyertakan informasi tentang
alasan akses jaringan lokal diperlukan, untuk meningkatkan kemungkinan pengguna menyetujui
akses izin lokal.
B Penerima tidak tersedia: Mengetuk tombol Transmisikan akan menampilkan layar bantuan yang menjelaskan kemungkinan alasan pengguna tidak dapat menemukan Penerima Web, beserta link ke Setelan untuk memperbaiki masalah izin LNA.
Transmisi pertama kali (iOS)
Transmisi pertama kali: izin akses jaringan lokal dan interstisial
Wajib A Saat aplikasi pengirim terhubung ke Penerima Web,
mengetuk tombol Cast akan menampilkan dialog Cast
B Judul dialog Cast "Receiver-Name" muncul
C Dialog Cast menampilkan tombol untuk menghentikan transmisi
dengan label tombol "HENTIKAN TRANSMISI" (untuk mengetahui informasi selengkapnya tentang cara menghentikan koneksi, lihat
Pengirim menghentikan transmisi)
Android
Dialog Cast, terhubung tetapi tidak melakukan transmisi
Aplikasi penerima dimuat / tidak aktif
iOS
Dialog Cast, terhubung tetapi tidak melakukan transmisi
Wajib A Judul dialog Transmisi "Receiver-Name" muncul
B Penerima atau konten yang saat ini ditransmisikan ditampilkan di bawah
judul
C Dialog Transmisi menampilkan tombol "HENTIKAN TRANSMISI" yang menghentikan
transmisi (untuk informasi selengkapnya, lihat
Pengirim menghentikan transmisi)
Praktik terbaik
Untuk pengalaman pengguna terbaik, berikan
kontrol persisten
selain kontrol dalam dialog Cast.
Android
Dialog transmisi, saat melakukan transmisi
Penerima memutar konten
iOS
Dialog transmisi, saat melakukan transmisi
Penerima memutar konten
Chrome
Dialog transmisi, saat melakukan transmisi
Penerima memutar konten
Gambar yang digunakan dalam panduan desain ini
adalah milik Blender Foundation, yang dibagikan berdasarkan lisensi hak cipta atau Creative Commons.
Elephant's Dream: (c) hak cipta 2006, Blender Foundation / Netherlands Media Art Institute /
www.elephantsdream.org
Sintel: (c) hak cipta Blender Foundation | www.sintel.org
Tears of Steel: (CC) Blender Foundation | mango.blender.org
Big Buck Bunny: (c) hak cipta 2008, Blender Foundation / www.bigbuckbunny.org
[null,null,["Terakhir diperbarui pada 2025-09-04 UTC."],[[["\u003cp\u003eThe Cast dialog enables users to connect to, manage, and disconnect from Web Receivers and should be implemented consistently across platforms.\u003c/p\u003e\n"],["\u003cp\u003eOn iOS, users must grant local network access permission for initial casting and may encounter a help screen if no devices are found.\u003c/p\u003e\n"],["\u003cp\u003eWhen connected, the Cast dialog displays the receiver name and a "STOP CASTING" button, offering controls for the casting session.\u003c/p\u003e\n"],["\u003cp\u003eFor optimal user experience, it's recommended to include persistent controls alongside those within the Cast dialog, enhancing user interaction.\u003c/p\u003e\n"],["\u003cp\u003eAndroid apps can leverage the MediaRouter component for built-in Cast dialog UX, simplifying implementation.\u003c/p\u003e\n"]]],[],null,["# Cast Dialog\n\nThe Cast dialog is shown whenever the Cast button is pressed. The Cast dialog lets users\nconnect, control, and disconnect from Web Receivers.\n| **Note:** For Android apps, use the `MediaRouter` component from the MediaRouter Support Library to implement the Cast dialog. It has all of the UX requirements built right in.\n| **Note:** For iOS senders, a special Local Network Access interstitial dialog must be displayed the first time a user attempts to cast.\n\nIf you're developing a custom implementation or building an app for iOS or Chrome, you must\nimplement this dialog in a consistent way, so that users recognize and trust it to function\nconsistently across devices, apps and platforms. Refer to the\n[Reference apps](/cast/docs/sample_apps#reference_apps) for examples.\n\n### [Cast dialog, not connected (receivers available)](#sender-cast-menu-available)\n\n\n**Required** (default behavior of [Android MediaRouter](https://developer.android.com/reference/androidx/mediarouter/media/MediaRouter)):\n\n\nA When the sender app is not connected to a Cast receiver,\ntapping the Cast button shows the Cast dialog\n\n\nB The Cast dialog title, \"Cast to\" appears\n\n\nC The Cast dialog shows a list of available Web Receivers\n\n\nD Each receiver currently casting should display, \"Casting\n*app name*\"\n\n**Note the multi-user scenarios:**\n\n- When another user connects to a receiver currently casting from the same app and account, the sender app provides the controls for the cast content.\n- When another user connects to a receiver currently casting from an app that is not casting, the previous sender app disconnects and the new sender app connects.\n\n### Android\n\nCast dialog, not connected \nCast home screen \n\n### iOS\n\nCast dialog, not connected \nCast home screen \n\n### Chrome\n\nCast dialog, not connected \nCast home screen \n\n### [Cast dialog, not connected (iOS only)](#sender-cast-menu-available)\n\n\nFor iOS, when casting for the first time, users must consent to allow local network access (LNA) to\nCast devices. An interstitial information screen is presented\nto users explaining why this permission is needed, followed by the standard Apple LNA\npermissions dialog.\n\n\nAfter casting for the first time, if no devices are found when the Cast button is tapped while the\nuser is on Wi-Fi, a help screen is presented\nexplaining why Web Receivers might not be available (for example,\nlocal network access is disabled, or there is a problem with the Wi-Fi network).\n\n\n**Required** :\n\n\nA First-time casting: After tapping on the Cast button\nfor the first time,\nan Interstitial must be shown to explain to the user why they should allow\nthe app to access local network devices. The interstitial should include information on\nwhy local network access is needed, to increase the likelihood of the user accepting\nlocal permission access.\n\n\nB Receivers unavailable: Tapping the Cast button\ndisplays a help screen explaining possible reasons the user\nis unable to discover Web Receivers, along with links to Settings to fix LNA permissions issues. \n\n### First-time casting (iOS)\n\nFirst-time casting: interstitial and local network access permissions \n\n### Receivers unavailable\n\nReceivers unavailable \n\n### [Cast dialog, connected but not casting](#sender-cast-menu-connected)\n\n\n**Required**\n\n\nA When the sender app is connected to a Web Receiver,\ntapping the Cast button shows the Cast dialog\n\n\nB The Cast dialog title \"Receiver-Name\" appears\n\n\nC The Cast dialog shows a button to stop casting\nwith button label \"STOP CASTING\" (for more information about disconnecting, see\n[Sender stops cast](/cast/docs/design_checklist/sender#sender-control-end)) \n\n### Android\n\nCast dialog, connected but not casting \nReceiver app loaded / idle \n\n### iOS\n\nCast dialog, connected but not casting \nReceiver app loaded / idle \n\n### [Cast dialog, while casting](#sender-cast-menu-casting)\n\n\n**Required**\n\n\nA The Cast dialog title \"Receiver-Name\" appears\n\n\nB The receiver or content currently casting is shown below\nthe title\n\n\nC The Cast dialog shows a \"STOP CASTING\" button that stops\ncasting (for more information see\n[Sender stops cast](/cast/docs/design_checklist/sender#sender-control-end))\n\n**Best practice**\n\n- For the best user experience, provide [persistent controls](/cast/docs/design_checklist/sender#sender-mini-controller) in addition to the controls in the Cast dialog.\n\n### Android\n\nCast dialog, while casting \nReceiver playing content \n\n### iOS\n\nCast dialog, while casting \nReceiver playing content \n\n### Chrome\n\nCast dialog, while casting \nReceiver playing content \n\n**Images used in this design guide**\nare courtesy of the Blender Foundation, shared under copyright or Creative Commons license.\n\n- Elephant's Dream: (c) copyright 2006, Blender Foundation / Netherlands Media Art Institute / www.elephantsdream.org\n- Sintel: (c) copyright Blender Foundation \\| www.sintel.org\n- Tears of Steel: (CC) Blender Foundation \\| mango.blender.org\n- Big Buck Bunny: (c) copyright 2008, Blender Foundation / www.bigbuckbunny.org"]]
