Android 裝置有多種板型規格,例如手機、平板電腦、折疊式裝置和 ChromeOS 裝置,且有多種螢幕大小。Android 支援多種顯示模式,包括多視窗、多螢幕、任意形式和子母畫面。折疊式裝置可處於各種狀態或型態,例如桌面型態或書本型態。
開始設計應用程式時,請考慮不同的用途。例如:
大螢幕裝置可讓使用者有更多空間,以不同方式與媒體應用程式的內容互動。
使用者可能會在多視窗設定中觀看影片時執行多項工作,或利用大螢幕在擷取圖片後進行更複雜的編輯。
使用者可能會使用平板電腦進行視訊通話,與親友保持聯繫,並更清楚地看到對方。應用程式可以在自訂播放疊加層中顯示更豐富的影片或場景相關資訊,或在畫面上提供更多控制選項。
瀏覽檢視畫面中的輪播內容可提供更多變化,提升視覺吸引力,媒體應用程式也可並排顯示可瀏覽的動態消息和播放內容,讓使用者保持參與度。
請注意,媒體應用程式在標準手機、摺疊式裝置、平板電腦和 ChromeOS 裝置上執行的程式碼相同,因此您應在應用程式開發初期就為大螢幕設計。如需更多資訊和視覺化範例,請參閱「大螢幕圖片庫」。
預設讓媒體應用程式提供良好回應
在手機、平板電腦、摺疊式裝置和 ChromeOS 裝置上,讓媒體應用程式的版面配置自動調整大小,避免使用者體驗不佳。
應用程式應配合不同的螢幕大小、螢幕方向和板型規格做出回應。自動調整式版面配置會配合可用的螢幕空間而變化。詳情請參閱「支援不同的螢幕大小」。
依據規範設計
無論螢幕大小、裝置型態或其他裝置專屬考量為何,核心應用程式品質都是所有 Android 應用程式的基礎。開始設計大螢幕專用應用程式前,請先確保應用程式符合這些基本需求。詳情請參閱「核心應用程式品質」。
無論裝置板型規格、螢幕尺寸、顯示模式或型態為何,應用程式都應提供出色的使用者體驗,因此請根據下列第 1、2 和 3 級規範設計應用程式。
這些規範涵蓋了大部分 Android 應用程式適用的品質標準。
第 3 級:
即使是基本層級,應用程式仍須遵守使用者介面和圖形規定。您的應用程式可供大螢幕使用,使用者可以完成重要工作流程,但無法獲得最佳使用者體驗。
應用程式版面配置可能不盡理想,但應用程式可在全螢幕執行,或在多視窗模式下使用整個視窗。應用程式並未顯示上下黑邊,且無法在相容模式下執行。應用程式為外部輸入裝置提供基本支援服務,包括鍵盤、滑鼠和觸控板。詳情請參閱「大螢幕就緒」。
第 2 級:
應用程式針對所有螢幕尺寸和裝置設定實作版面配置最佳化功能,並且加強支援外部輸入裝置。詳情請參閱「大螢幕最佳化」。
第 1 級:
這是最佳支援等級,可為使用者提供最優質的應用程式體驗,因為這項功能會指定進階功能和服務。
在適用情況下,應用程式支援多工處理、折疊型態、拖曳和觸控筆輸入。在此層級,應用程式的差異很大,因此請密切注意多工處理和摺疊模式等方面的指南。詳情請參閱「大型螢幕差異化」。
最佳化版面配置
善用大螢幕的空間,不必擔心出現上下黑邊 (因限制螢幕方向所致) 或延展畫面。針對媒體和社群媒體最佳化應用程式版面配置,可擴大應用程式觸及範圍,並在所有大螢幕板型規格 (平板電腦、折疊式裝置和 ChromeOS 裝置) 上提供更優質的使用者體驗,同時支援所有手機尺寸。
導覽邊欄和導覽匣元件提供現成的導覽功能,讓使用者介面和控制項使用起來更輕鬆。這些元件也會將主要導覽目的地置於觸手可及的範圍內,同時佔用最少的螢幕空間,藉此彌補標準版面配置 (清單/詳細資料、動態消息和輔助窗格) 的不足。
媒體版面配置
導入清單詳細資料、動態消息和支援窗格的媒體專屬版面配置,提升應用程式的可用性。如要瞭解 MDX、Flutter 和 Compose 版面配置,請參閱「版面配置資源」。
清單詳細資料: 設計應用程式時加入互動式媒體瀏覽器,讓使用者在觀看或聆聽內容時,瀏覽不同的媒體。媒體名稱會與正在播放的影片或音訊檔案並排顯示。如果裝置螢幕方向改變,清單詳細資料版面配置會據此回應,保留應用程式狀態。詳情請參閱「清單詳細資料版面配置」。
動態消息: 動態消息版面配置會在可設定格線中,排列對等的內容元素,以便快速檢視大量內容,例如應用程式中的音樂動態消息或電影和電視資訊站。詳情請參閱「動態消息版面配置」。
支援窗格: 應用程式可透過主要和次要顯示區域嵌入支援窗格,提供背景資訊、相關內容或參考資料,例如類似標題的捲動清單、已發布的評論,或是相同藝人或演員的其他作品。 詳情請參閱「支援窗格版面配置」。
如要查看精選媒體版面配置,請參閱媒體庫。
社群媒體版面配置
大螢幕提供更多作業空間,讓社群媒體使用者進行創作、多工處理、在應用程式間拖曳內容,以及分享內容。大螢幕媒體應用程式可運用清單詳細資料、動態消息和支援窗格版面配置,提供小螢幕裝置無法提供的獨特功能。
清單/詳細資料: 很適合用於訊息應用程式、聯絡人管理工具或檔案瀏覽器。舉例來說,應用程式可以並排顯示對話清單和詳細資料,讓您隨時掌握最新訊息。詳情請參閱「清單詳細資料版面配置」。
動態消息: 這類版面配置的常見元件是資訊卡和清單。舉例來說,你可以用美術拼貼手法顯示貼文,或善用方格大小和位置,吸引讀者關注主打貼文。使用者可以快速查看大量內容。詳情請參閱「動態消息版面配置」。
輔助窗格: 搜尋與參考應用程式或生產力應用程式可採用這種版面配置。讓使用者隨時可存取內容創作工具。舉例來說,應用程式可讓使用者調整設定、存取調色盤、套用效果,以及立即查看變更。詳情請參閱「支援窗格版面配置」。
如要查看精選的社群媒體版面配置,請參閱社群媒體圖片庫頁面。
大螢幕媒體應用程式最佳做法
採用大螢幕最佳做法,有助於避免不必要的應用程式重製作業,並從一開始就讓應用程式在更多裝置上更易於使用,尤其是在螢幕方向、鍵盤快速鍵、相機預覽支援和折疊式裝置姿勢方面。
方向和調整大小
如果媒體應用程式宣告了螢幕方向和大小調整限制,Android 會啟用相容性模式。相容模式可確保應用程式運作順利,但會大幅降低可用性,並影響使用者體驗。
舉例來說,如果應用程式在平板電腦上執行,平板電腦會以橫向模式固定在底座上。如果應用程式僅限直向模式,會導致上下留黑邊,這對使用者來說並不理想。應用程式應允許使用者選擇偏好的螢幕方向,因此請在設計中充分運用大螢幕的可用空間。
限制螢幕方向會減少使用者與內容互動或觀看媒體的方式,進而限制應用程式的使用。變更螢幕方向可能會在某種程度上影響大小,但調整大小不一定會變更螢幕方向。
鍵盤快速鍵
在大螢幕上,使用者更有可能使用實體鍵盤的鍵盤快速鍵 (例如開始、停止、暫停、倒轉和快轉),讓使用者體驗與鍵盤操作體驗一致。
使用者希望媒體應用程式提供這些功能。為減少使用者操作不便,建議使用實體鍵盤測試應用程式。這有助於您在設計初期就注意到這些重要快速鍵,並將其納入應用程式。
支援相機預覽
大螢幕可能會導致更多拉伸、裁剪和旋轉問題。因此,您無法假設相機預覽畫面大小就是媒體應用程式實際算繪的 UI。
舉例來說,如果使用者使用平板電腦拍照,但平板電腦螢幕上的相片卻上下顛倒,這就是不理想的體驗。支援在大螢幕上預覽相機畫面。
詳情請參閱「CameraX 預覽」或「Camera2 預覽」。
折疊型態
為大螢幕設計媒體應用程式時,請考量摺疊式裝置的姿勢。舉例來說,應用程式可讓使用者以桌面模式播放媒體,或使用後置螢幕和雙螢幕模式預覽及拍攝。
在開發計畫中納入摺疊式裝置的姿勢,應用程式就能在更多裝置上使用,影響範圍更廣。您可透過其他裝置無法提供的折疊型態,為使用者擴大媒體體驗。詳情請參閱「摺疊式裝置型態」。