支援觸控的接收器應用程式
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
接收器會在可能具備或不具備觸控控制功能的裝置上播放內容。接收器必須立即回應傳送端應用程式中的動作，以及透過觸控控制項進行的動作。
接收端 UI 回饋範例：
必要
A 針對影片和音訊接收器，請建構可適應任何螢幕解析度和長寬比的接收器應用程式。
影片
影片接收器使用者介面
音訊
音訊接收器使用者介面
B 針對影片和音訊接收器，請勿顯示建議觸控手勢的元素。舉例來說，請勿顯示「偷看」元素來表示滑動手勢。
C 針對視訊和音訊接收器，請勿顯示任何會建議觸控互動的元素。
D 對於音訊接收器，請勿顯示任何控制項類型的元素，例如進度列。
請勿：顯示可窺視的元素、看起來像按鈕的圖示，或控制項類型的元素。
E 影片接收器在播放期間 (包括暫停狀態) 不得顯示任何中繼資料或控制項元素，以免與系統顯示的控制項衝突。
請勿：顯示中繼資料和控制項
F 對於音訊接收器，請將所有中繼資料元素放在受保護區域上方，以免與系統顯示的控制項重疊。
最佳做法
- 所有文字都必須清晰可讀，且與顯示器距離 1.5 到 3 公尺。
接收器在前台執行但未播放任何內容時，會顯示閒置畫面。
必要
A 使用應用程式標誌，識別載入的接收端應用程式。
B 將所有元素 (包括任何應用程式標誌) 放在安全區域上方，以免與系統顯示的任何控制項重疊。
最佳做法
- 顯示「Ready to cast」(準備好投放) 文字，確認應用程式已載入。
- 如果接收器閒置 5 分鐘，請停止執行並中斷所有已連線的傳送器應用程式。停止後，裝置會顯示主畫面，以防螢幕烙印。
使用者連線至接收器時，接收器應用程式必須先載入，才能顯示應用程式閒置狀態或開始播放內容。
必要
A 顯示應用程式標誌，識別載入的接收端應用程式。
B 顯示載入動畫微調器，指出接收器應用程式正在載入。
載入內容時，接收器應顯示資訊，指出內容正在載入，直到開始播放為止。
必要
A 顯示內容標題或插圖，指出載入的內容。
B 顯示載入動畫，指出內容正在載入。
最佳做法
繼續播放內容時，請將播放時間倒轉 5 到 10 秒，確保觀眾不會在從傳送者切換到接收者的過程中錯過任何內容。
必要
對於影片接收器，請勿在播放期間顯示任何元素。輕觸螢幕時，系統會顯示播放器控制項。
B 音訊接收器：將所有中繼資料元素放在受保護區域上方，且不顯示任何控制項元素。輕觸螢幕時，系統會顯示播放器控制項。
影片
使用者輕觸螢幕，顯示播放器控制項。
音訊
使用者輕觸螢幕，顯示播放器控制項。
必要
A 對於影片接收器，請勿在暫停狀態下顯示任何元素。系統會顯示播放器控制項和「播放」按鈕，表示播放已暫停。
B 對於音訊接收器，暫停時請勿顯示任何控制項元素。系統會顯示播放器控制項和「播放」按鈕，表示播放已暫停。
最佳做法
- 除非使用者明確要求開始播放內容 (例如繼續播放或略過佇列中的項目)，否則接收器應用程式不應繼續播放內容。
- 如果接收器閒置 20 分鐘，就會停止執行並中斷所有已連線的傳送端應用程式。停止後，裝置會顯示主畫面，以防螢幕烙印。
- 確保與日後導入的背景工作階段一致。
- 如果適用，當接收器因閒置時間而停止時，請儲存暫停的位置，以便使用者稍後從該處繼續播放。
影片
影片已暫停
音訊
音訊已暫停
如果網路延遲或其他因素導致播放延遲，接收器就會緩衝處理。
必要
A 即使緩衝持續數秒，也不要顯示任何元素。使用者可以輕觸螢幕顯示播放器控制項，或滑動返回。
影片
接收器緩衝
音訊
接收器緩衝
如果停止播放或逾時，接收器會顯示接收器閒置使用者介面。
必要
A 顯示應用程式標誌，識別已載入或閒置的接收端應用程式。
B 將所有元素 (包括任何應用程式標誌) 放在安全區域上方，以免與系統顯示的任何控制項重疊。
最佳做法
- 如果閒置 5 分鐘，系統會中斷與接收器應用程式的連線，並停止執行該應用程式。
停止後，接收端會顯示主畫面，避免螢幕烙印。
本設計指南中使用的圖片
由 Blender Foundation 提供，並根據著作權或創用 CC 授權分享。
- Elephant's Dream：(c) copyright 2006, Blender Foundation / Netherlands Media Art Institute /
www.elephantsdream.org
- Sintel：(c) copyright Blender Foundation | www.sintel.org
- 鋼鐵之淚：(CC) Blender Foundation | mango.blender.org
- Big Buck Bunny：(c) copyright 2008, Blender Foundation / www.bigbuckbunny.org
除非另有註明，否則本頁面中的內容是採用創用 CC 姓名標示 4.0 授權，程式碼範例則為阿帕契 2.0 授權。詳情請參閱《Google Developers 網站政策》。Java 是 Oracle 和/或其關聯企業的註冊商標。
上次更新時間：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"]],["上次更新時間：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"]]
