支持触控的接收器应用
使用集合让一切井井有条
根据您的偏好保存内容并对其进行分类。
接收器在可能具有或不具有触控功能的设备上播放内容。接收器必须立即响应发送器应用中的操作以及通过触控进行的控制。
接收器界面反馈示例:
必需
A 对于视频和音频接收器,请构建自适应的接收器应用,以便其能够适应任何屏幕分辨率和宽高比。
视频
视频接收器界面
音频
音频接收器界面
B 对于视频和音频接收器,请勿显示暗示触摸手势的元素。例如,请勿显示窥视元素来指示滑动操作。
C 对于视频和音频接收器,请勿显示任何暗示触摸互动的元素。
D 对于音频接收器,不显示任何控制类型元素,例如进度条。
错误做法:显示窥视元素、可能看起来像按钮的图标或控制类型元素。
E 对于视频接收器,在播放期间(包括暂停状态)不得在接收器上显示任何元数据或控制元素,以免与系统显示的控制元素发生冲突。
请勿:显示元数据和控件
F 对于音频接收器,请将所有元数据元素放置在保护区域上方,以免与系统显示的控件重叠。
最佳做法
- 所有文字都应在距离显示屏 5 到 10 英尺的位置清晰可辨。
当接收器位于前台但未播放任何内容时,接收器上会显示空闲界面。
必需
A 使用应用徽标来确定加载了哪个接收器应用。
B 将所有元素(包括所有应用徽标)放置在保护区域上方,以免与系统显示的任何控件重叠。
最佳做法
- 通过显示“准备投放”文本来表明应用已加载。
- 如果接收器空闲 5 分钟,则停止运行接收器并断开所有已连接的发送器应用。停止后,设备会显示主屏幕,有助于防止烧屏。
当用户连接到接收器时,接收器应用必须先加载,然后才能显示应用空闲状态或开始播放内容。
必需
通过显示应用徽标来确定正在加载的接收器应用。
B 通过显示动画加载旋转图标来标识接收器应用正在加载。
在内容加载期间和播放开始之前,接收器应显示信息以指示内容正在加载。
必需
A 通过显示内容标题或封面来标识正在加载的内容。
B 通过显示动画加载微调器来标识内容正在加载。
最佳实践
恢复播放内容时,将播放倒回 5-10 秒,以便观看者在从发送方过渡到接收方的过程中不会错过任何内容。
必需
A 对于视频接收器,在播放期间不显示任何元素。在屏幕上点按时,系统会显示播放器控件。
B 对于音频接收器,请将所有元数据元素放置在保护区域上方,并且不显示任何控制元素。在屏幕上点按时,系统会显示播放器控件。
视频
用户点按屏幕以显示播放器控件。
音频
用户点按屏幕以显示播放器控件。
必需
A 对于视频接收器,在暂停状态下不显示任何元素。系统将显示带有“播放”按钮的播放器控件,以指示播放已暂停。
B 对于音频接收器,在暂停状态下不显示任何控制元素。系统将显示带有播放按钮的播放器控件,以指示播放已暂停。
最佳做法
- 除非用户明确要求开始播放内容(例如恢复播放或跳过队列中的某个项),否则接收器应用不应继续播放内容。
- 如果接收器空闲 20 分钟,则停止运行接收器并断开所有已连接的发送器应用。停止后,设备会显示主屏幕,有助于防止烧屏。
- 确保与未来实施的后台会话保持一致。
- 如果适用,当接收器因空闲时间而停止时,请存储暂停位置,以便用户日后可以从该位置继续播放。
视频
视频已暂停
音频
音频已暂停
当网络延迟或其他因素导致播放延迟时,接收器会进行缓冲。
必需
A 不显示任何元素,即使缓冲持续数秒也是如此。用户可以点按屏幕来显示播放器控件,也可以滑动来返回。
视频
接收器缓冲
音频
接收器缓冲
当播放停止或超时时,接收器将显示接收器空闲界面。
必需
A 通过显示应用徽标来标识哪个接收器应用已加载或处于空闲状态。
B 将所有元素(包括所有应用徽标)放置在保护区域上方,以免与系统显示的任何控件重叠。
最佳做法
- 如果空闲时间达到 5 分钟,则断开与接收器应用的连接并停止运行该应用。
停止后,接收器会显示主屏幕,有助于防止屏幕烧屏。
本设计指南中使用的图片由 Blender Foundation 提供,并根据版权或知识共享许可进行分享。
- Elephant's Dream:(c)版权所有 2006,Blender Foundation / Netherlands Media Art Institute / www.elephantsdream.org
- Sintel:(c) 版权所有 Blender Foundation | www.sintel.org
- 钢铁之泪:(CC) Blender Foundation | mango.blender.org
- 《大雄兔》:(c) 版权所有 2008,Blender Foundation / www.bigbuckbunny.org
如未另行说明,那么本页面中的内容已根据知识共享署名 4.0 许可获得了许可,并且代码示例已根据 Apache 2.0 许可获得了许可。有关详情,请参阅 Google 开发者网站政策。Java 是 Oracle 和/或其关联公司的注册商标。
最后更新时间 (UTC):2025-07-26。
[[["易于理解","easyToUnderstand","thumb-up"],["解决了我的问题","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["没有我需要的信息","missingTheInformationINeed","thumb-down"],["太复杂/步骤太多","tooComplicatedTooManySteps","thumb-down"],["内容需要更新","outOfDate","thumb-down"],["翻译问题","translationIssue","thumb-down"],["示例/代码问题","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["最后更新时间 (UTC):2025-07-26。"],[[["\u003cp\u003eReceiver apps should be adaptive and avoid touch-suggestive elements to ensure compatibility across devices.\u003c/p\u003e\n"],["\u003cp\u003eDuring playback, minimize receiver UI elements to avoid conflicts with system controls, relying on system-provided controls triggered by user interaction.\u003c/p\u003e\n"],["\u003cp\u003eDisplay clear loading indicators and app identification during loading and idle states, placing elements above the protected area.\u003c/p\u003e\n"],["\u003cp\u003eManage idle states effectively to prevent screen burn and enhance user experience by disconnecting and stopping the receiver app after a period of inactivity.\u003c/p\u003e\n"],["\u003cp\u003eWhen buffering or paused, avoid displaying custom elements and leverage system controls for a consistent user experience.\u003c/p\u003e\n"]]],[],null,["# Touch-enabled Receiver App\n\nThe receiver plays content on devices that may or may not have touch control\ncapabilities. The receiver must respond immediately to actions in the sender app as well as\nthrough touch controls.\n\nExamples of receiver UI feedback:\n\n- Playing\n- Paused\n- Playback position / seeking\n- Buffering\n\n### [Receiver UI](#receiver-ui-elements)\n\n\n**Required**\n\n\nA For video and audio receivers, build the receiver app to\nbe adaptive so that it can adapt to any screen resolution and aspect ratio.\n\n\n### Video\n\nVideo Receiver UI \n\n### Audio\n\nAudio Receiver UI \n\n\nB For video and audio receivers, do not display elements\nthat suggest touch gestures. For example, do not display peeking elements to indicate swipe\ngestures. \n\nC For video and audio receivers, do not display any\nelements that would suggest touch interactions.\n\n\nD For audio receivers, do not display any control-type\nelements like progress bars.\n\n\n\u003cbr /\u003e\n\n\n**Don't:** Display peeking elements, icons which can look like\nbuttons, or control-type elements.\n\n\nE For video receivers, do not display any metadata or\ncontrol elements on the receiver during playback including while in a paused state, so that it does\nnot conflict with the controls displayed by the system.\n\n\n\u003cbr /\u003e\n\n\n**Don't:** Display metadata and controls\n\n\nF For audio receivers, place all metadata elements above\nthe protected area so that it does not overlap with the controls displayed by the system.\n\n\n**Best practices**\n\n- All text should be legible from a distance of 5 to 10 feet from the display unit.\n\n### [Receiver app idle](#receiver-ui-idle)\n\nAn idle screen is displayed on the receiver when the receiver is in the foreground but\nno content is playing.\n\n\n**Required**\n\n\nA Identify which receiver app is loaded\nby using the app logo.\n\n\nB Place all elements including any app logos above the\nprotected area so that it does not overlap with any controls displayed by the system.\n\n**Best practices**\n\n- Identify that the app is loaded by displaying \"Ready to cast\" text.\n- Stop the receiver from running if idle for 5 minutes and disconnect any connected sender apps. When stopped, the device home screen appears and will help prevent screen burn.\n\n\n### [Receiver app loading](#receiver-player-loading)\n\nWhen a user connects to a receiver, the receiver app must first load before it can\ndisplay the app idle state or begin playing content.\n\n\n**Required**\n\n\nA Identify which receiver app is loading by displaying\nthe app logo.\n\n\nB Identify that the receiver app is loading by\ndisplaying an animated loading spinner.\n\n\n### [Receiver content loading](#receiver-content-loading)\n\nWhile content is loading and before playback begins, the receiver should display info to\nindicate content is loading.\n\n\n**Required**\n\n\nA Identify what content is being loaded by displaying the\ncontent title or artwork.\n\n\nB Identify that content is loading by displaying\nan animated loading spinner.\n\n\n**Best practices**\n\n\nWhen resuming content, rewind playback 5-10 seconds so the viewer doesn't miss anything\nduring the transition from sender to receiver.\n\n\n### [Receiver playback](#receiver-ui-seek)\n\n\n**Required**\n\n\nA For video receivers, do not display any elements during\nplayback. On screen tap, the system will display the player controls.\n\n\nB For audio receivers, place all metadata elements above\nthe protected area and do not display any control elements. On screen tap, the system will display\nthe player controls. \n\n### Video\n\nUser taps screen to display player controls. \n\n### Audio\n\nUser taps screen to display player controls. \n\n### [Receiver paused](#receiver-ui-pause)\n\n\n**Required**\n\n\nA For video receivers, do not display any elements while in\na paused state. The system will display the player controls with a play button to indicate\nplayback is paused.\n\n\nB For audio receivers, do not display any control elements\nwhile in a paused state. The system will display the player controls with a play button to\nindicate playback is paused.\n\n**Best practices**\n\n- The receiver app should not continue content playback unless there is an explicit request from the user to begin playback such as resume, or skipping an item on the queue.\n- Stop receiver from running if idle for 20 minutes and disconnect any connected sender apps. When stopped, the device home screen appears and will help prevent screen burn.\n- Ensure alignment with future implementation of background sessions.\n- If applicable, when the receiver is stopped due to idle time, store the paused location so that the user can resume playback from that point at a later time.\n\n### Video\n\nVideo paused \n\n### Audio\n\nAudio paused \n\n### [Receiver buffering](#receiver-ui-buffer)\n\nBuffering on the receiver happens when network latency or other factors cause a delay in\nplayback.\n\n\n**Required**\n\n\nA Do not display any elements even if the\nbuffering continues for several seconds. Users can tap on the screen to display the player\ncontrols or swipe to go back. \n\n### Video\n\nReceiver buffering\n\n### Audio\n\nReceiver buffering \n\n### [Receiver stops cast](#receiver-ui-complete)\n\nWhen playback stops or times out, the receiver will display the receiver idle UI.\n\n\n**Required**\n\n\nA Identify which receiver app is loaded or idle by\ndisplaying an app logo.\n\n\nB Place all elements including any app logos above the\nprotected area so that it does not overlap with any controls displayed by the system.\n\n**Best practices**\n\n- Disconnect from the receiver app and stop it from running if idle for 5 minutes. When stopped, the receiver home screen appears and will help prevent screen burn.\n\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"]]