تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
يظهر مربّع حوار "البث" كلّما تم الضغط على زر "البث". يتيح مربع الحوار "البث" للمستخدمين إمكانية الاتصال بأجهزة استقبال الويب والتحكّم فيها وقطع الاتصال بها.
إذا كنت بصدد تطوير عملية تنفيذ مخصّصة أو إنشاء تطبيق لنظام التشغيل iOS أو Chrome، عليك تنفيذ مربع الحوار هذا بطريقة متّسقة، كي يتعرّف المستخدمون عليه ويثقوا في عمله بشكل متّسق على جميع الأجهزة والتطبيقات والمنصات. يمكنك الرجوع إلى
التطبيقات المرجعية للاطّلاع على أمثلة.
مطلوب (السلوك التلقائي
لـ Android MediaRouter):
أ عندما لا يكون تطبيق المُرسِل متصلاً بجهاز استقبال Cast،
يؤدي النقر على زر "البث" إلى عرض مربّع حوار "البث".
ب يظهر عنوان مربّع حوار "البث"، وهو "البث إلى".
ج يعرض مربّع حوار "البث" قائمة بأجهزة استقبال الويب المتاحة.
د يجب أن يعرض كل جهاز استقبال يبث حاليًا الرسالة "يتم البث من
اسم التطبيق".
يُرجى ملاحظة سيناريوهات المستخدمين المتعدّدين:
عندما يتصل مستخدم آخر بجهاز استقبال يبث حاليًا من التطبيق والحساب نفسيهما، يوفّر تطبيق المرسِل عناصر التحكّم في المحتوى الذي يتم بثه.
عندما يتصل مستخدم آخر بجهاز استقبال يبث حاليًا من تطبيق لا يبث، يتم قطع اتصال تطبيق المرسِل السابق ويتصل تطبيق المرسِل الجديد.
في أجهزة iOS، عند بث المحتوى للمرة الأولى، على المستخدمين الموافقة على السماح بالوصول إلى الشبكة المحلية (LNA) لأجهزة البث. يتم عرض شاشة معلومات بينية للمستخدمين توضّح سبب الحاجة إلى هذا الإذن، يليها مربّع الحوار العادي الخاص بأذونات "الشفافية وتتبُّع التطبيقات" من Apple.
بعد إجراء عملية البث للمرة الأولى، إذا لم يتم العثور على أي أجهزة عند النقر على زر "البث" أثناء اتصال المستخدم بشبكة Wi-Fi، ستظهر شاشة مساعدة توضّح سبب عدم توفّر "أجهزة استقبال الويب" (على سبيل المثال، إذا كان الوصول إلى الشبكة المحلية غير مفعّل أو إذا كانت هناك مشكلة في شبكة Wi-Fi).
مطلوب:
أ الإرسال للمرة الأولى: بعد النقر على زر "الإرسال" للمرة الأولى، يجب عرض إعلان بيني لتوضيح سبب ضرورة السماح للتطبيق بالوصول إلى الأجهزة على الشبكة المحلية. يجب أن يتضمّن الإعلان البيني معلومات حول سبب الحاجة إلى الوصول إلى الشبكة المحلية، وذلك لزيادة احتمالية موافقة المستخدم على منح إذن الوصول إلى الشبكة المحلية.
B أجهزة الاستقبال غير متاحة: يؤدي النقر على زر "البث" إلى عرض شاشة مساعدة توضّح الأسباب المحتملة لعدم تمكّن المستخدم من العثور على أجهزة استقبال الويب، بالإضافة إلى روابط تؤدي إلى "الإعدادات" لحلّ المشاكل المتعلّقة بأذونات الشبكة المحلية.
البثّ لأول مرة (iOS)
البث للمرة الأولى: أذونات الوصول إلى الشبكة المحلية والإعلانات البينية
مطلوب أ عند ربط تطبيق المرسِل بجهاز استقبال ويب،
يؤدي النقر على زر "البث" إلى عرض مربّع حوار "البث"
ب يظهر عنوان مربّع حوار "البث" "اسم جهاز الاستقبال"
ج يعرض مربّع حوار "البث" زرًا لإيقاف البث
مع تصنيف الزر "إيقاف البث" (لمزيد من المعلومات حول قطع الاتصال، يُرجى الاطّلاع على
إيقاف البث من جهاز المرسِل)
مطلوب أ يظهر عنوان مربع الحوار "البث" "اسم الجهاز المستقبِل"
ب يظهر الجهاز المستقبِل أو المحتوى الذي يتم بثه حاليًا أسفل
العنوان
ج يعرض مربع الحوار "البث" زر "إيقاف البث" الذي يوقف
البث (لمزيد من المعلومات، يُرجى الاطّلاع على
إيقاف البث من الجهاز المرسِل)
أفضل الممارسات
لتقديم أفضل تجربة للمستخدم، يجب توفير
عناصر تحكّم ثابتة
بالإضافة إلى عناصر التحكّم في مربّع حوار Google Cast.
Android
مربّع حوار البث أثناء البث
الجهاز المتلقّي يشغّل المحتوى
iOS
مربّع حوار البث أثناء البث
الجهاز المتلقّي يشغّل المحتوى
Chrome
مربّع حوار البث أثناء البث
الجهاز المتلقّي يشغّل المحتوى
الصور المستخدَمة في دليل التصميم هذا
مقدمة من مؤسسة Blender Foundation، وهي تتم مشاركتها بموجب حقوق الطبع والنشر أو رخصة المشاع الإبداعي.
Elephant's Dream: (c) حقوق الطبع والنشر 2006، مؤسسة Blender / معهد هولندا لفنون الإعلام /
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
تاريخ التعديل الأخير: 2025-09-03 (حسب التوقيت العالمي المتفَّق عليه)
[null,null,["تاريخ التعديل الأخير: 2025-09-03 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\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"]]
