請著重在系統體驗、應用程式體驗,以及設計直向參考體驗的其他功能。
直向參考設計以主畫面為基礎,其中包含下列永久系統 UI 元素:
主畫面
主畫面提供全包式服務,讓駕駛人輕鬆存取所有控制選項。這項服務可滿足大多數駕駛的需求,因此駕駛只需專心導航,不必切換應用程式。
駕駛人無須離開這個畫面,即可存取:
- 頂端的狀態列,提供快速控制選項和設定檔選取器
- 畫面主體的「基本層」,通常是執行導航應用程式
- 底部的控制項和系統導覽列
![主畫面檢視畫面](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/home-screen.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/home-screen.png?authuser=3&hl=zh-tw)
控制列
控制列代管媒體 (影片和音樂)、Podcast、藍牙、電台和進行中通話的控制項。
如果是媒體和手機應用程式,控制列位於螢幕下半部的導覽列上方。當使用者接聽來電時,控制項會從媒體變更為進行中的通話。
媒體控制選項
媒體控制選項可用於播放、暫停、倒轉及快轉內容。而且他們也能將喜愛的項目加入收藏,並存取其他自訂控制項 (如有)。
![標準媒體控制項](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/media-controls-1.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/media-controls-1.png?authuser=3&hl=zh-tw)
![展開的媒體控制項](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/media-controls-2.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/media-controls-2.png?authuser=3&hl=zh-tw)
有效通話控制
手機控制選項提供將喇叭設為靜音、切換至藍牙和取消通話的功能。
狀態列
狀態列會顯示在螢幕頂端,並代管設定檔選取器、快速控制項,以及時間和天氣資訊。
- 快速控制選項:
- 藍牙:藍牙狀態
- 連線能力:Wi-Fi、行動網路和無線基地台
- 亮度:允許使用者調整螢幕亮度
- 時鐘:以數位方式顯示目前時間
- 天氣資訊:顯示外部溫度
- 設定檔選取器:顯示目前使用中的使用者個人資料,並視需要允許使用者選取其他設定檔
狀態列的元素會以相同的順序顯示左駕車和右駕車。
使用者可以在「設定」中開啟或關閉天氣顯示功能。
如需自訂狀態列的最佳做法和指引,請參閱狀態列最佳做法。
快速控制項
狀態列上的快速控制項可讓您輕鬆存取藍牙、連線和螢幕亮度。
![藍牙控制選項](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/quick-controls-1.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/quick-controls-1.png?authuser=3&hl=zh-tw)
![連線控制](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/quick-controls-2.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/quick-controls-2.png?authuser=3&hl=zh-tw)
![顯示設定](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/quick-controls-3.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/quick-controls-3.png?authuser=3&hl=zh-tw)
付款資料選擇工具
透過狀態列上的設定檔選取器,您可以快速選取設定檔,並透過捷徑存取設定檔設定。
![個人資料選取器與設定檔選單](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/profile-selector.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/profile-selector.png?authuser=3&hl=zh-tw)
狀態列最佳做法
應用程式開發人員適用的最佳做法:
- 使用透明度,避免遮擋應用程式內容:如果應用程式固定在狀態列後方,而不是完全位於狀態列,應用程式開發人員應將狀態列保持透明。
- 策略性套用顏色:如果應用程式完全在狀態列下方,則應用程式開發人員應為狀態列選擇顏色。
系統導覽列
系統導覽列代管應用程式啟動器、數位助理、通知中心和舒適控制選項的控制項。
系統導覽列位於畫面底部,並顯示下列控制項:
- 車內溫度:車內溫度
- 應用程式啟動器:提供給驅動程式的應用程式
- 數位助理:存取指定數位助理,例如 Google 助理
- 通知中心:存取通知中心
- 溫控系統:存取車輛中的氣候控制系統
如需自訂系統導覽列的指南,請參閱「自訂系統導覽列」一文。
應用程式啟動器
應用程式啟動器會顯示在標準應用程式啟動器格狀檢視畫面中的主要應用程式空間中。應用程式的排列順序為 A 到 Z。使用者可以依據自己的偏好重新排序應用程式。
![應用程式啟動器](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/app-launcher.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/app-launcher.png?authuser=3&hl=zh-tw)
數位助理
使用者輕觸後,此預設用途會叫用目前啟用的數位助理,進行語音通訊。
通知中心
通知中心會將使用者導向所有已儲存的通知訊息 (包括已讀取和未讀取)。
![通知中心](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/notification-center.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/notification-center.png?authuser=3&hl=zh-tw)
溫控系統
透過「空調控制」圖示,你可以輕鬆使用車輛的氣候控制系統。
![擴大氣候控制措施](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/climate-controls.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/climate-controls.png?authuser=3&hl=zh-tw)
其他功能
直向參考設計中的額外功能適用於系統體驗和應用程式體驗,包括語音層和主題。
語音層
語音層是透明層,位於所有圖層上方、控制項和系統導覽列上方。
它可以執行與系統整合的任何數位助理,例如 Google 助理。
主題
根據光源條件,我們提供兩種主題。
![深色主題](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/dark-theme.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/dark-theme.png?authuser=3&hl=zh-tw)
![淺色主題](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/light-theme.png?authuser=3&hl=zh-tw)
![](https://developers.google.cn/static/cars/design/automotive-os/product-experience/system-ui/portrait-reference/images/light-theme.png?authuser=3&hl=zh-tw)
在夜晚或低光源環境下使用深色主題,減少炫光。進一步瞭解夜間的美化功能。
使用淺色主題,協助駕駛和乘客在陽光直射中查看車輛螢幕。為配合硬體設計,系統操作流程可能仍為黑色。