決定應用程式工作的範本順序後,即可自訂各個範本的內容和應用程式的部分樣式。
如要瞭解可以自訂整體視覺設計的哪些方面可以自訂,請參閱自訂視覺設計,包括應用程式自訂範例。若是應用程式的 AAOS 版本,請注意車輛原始設備製造商 (OEM) 可根據其車輛調整樣式,如車輛原始設備製造商 (OEM) 自訂範例所示。
如要瞭解特定範本的自訂選項,請參閱範本。
自訂視覺設計
雖然應用程式程式庫會決定範本版面配置和預設樣式,但應用程式設計人員和車輛原始設備製造商 (OEM) 都會參與視覺設計的自訂方面。
UI 的面向 | 程式庫決定的內容 | 應用程式決定或自訂的內容 | 車輛原始設備製造商 (OEM) 可自訂的項目 |
---|---|---|---|
圖片和圖像 | 標準元素的圖示,例如返回按鈕和載入旋轉圖示 | 應用程式會提供所有圖片和圖像 (請參閱 Material Design 圖示 和 Google Play 圖示規格), 除非另有註明, | |
版面配置、大小和形狀 | 預設版面配置,以及所有元素的大小和形狀 (在 Android Auto 版應用程式中,預設採用標準版面配置) | 在 AAOS 版本中,針對範本元素的大小、形狀、按鈕位置和比例進行調整 (例如車輛中「大」和「小」圖片和圖示的確切大小調整) | |
字體排版和文字長度 | Android Auto 版本應用程式中的字型系列和大小 (請參閱字體排版) | 為因應不同車輛螢幕上的空間大小變化,在某些情況下,文字字串的變化版本較長及更短 | AAOS 應用程式版本中的字型系列和大小 |
顏色 | Android Auto 應用程式版本中的預設顏色 (應用程式提供的預設顏色除外,如右側所示) | 地點清單標記、部分文字元素和部分背景顏色的顏色 (詳情請參閱下一節「自訂顏色」)。 | 視需要調整預設顏色和應用程式提供的顏色,以便與 AAOS 版本應用程式中的車輛使用者介面混合 |
自訂顏色
應用程式可以為特定範本的元素提供顏色,如以下清單所示。對於應用程式的 AAOS 版本,車輛原始設備製造商 (OEM) 可以進行某些調整,
應用程式可自訂下列項目:
- 清單列次要行中的文字顏色 (汽車製造商用於控制 AAOS 主要線的顏色)
- 按鈕文字顏色
- 按鈕背景顏色 (動作列和地圖動作列除外)
- 地點清單標記顏色
- 路線規劃資訊卡元素:行程預估的背景顏色、圖片和顏色值 (在導覽範本規定內)
- 即時路線導航通知 (背景顏色)
如需自訂範本元件的範例,請參閱「應用程式自訂範例」和「車輛原始設備製造商 (OEM) 自訂範例。
選擇應用程式的顏色
針對大部分的自訂樣式 (除了上一節註明的例外狀況以外),應用程式提供下列顏色選項:
- 最多提供 2 種自訂強調色 (適用於淺色和深色子類、Android Auto 適當套用,或由車輛原始設備製造商 (OEM) 的應用程式套用 AAOS 版本)
- 有 4 種車輛專用 Android 標準可供選擇 (目前目前顯示的版本如下,日後可能會變更)
標準顏色 | 強調色範例 |
---|---|
![]() |
![]() |
巧妙運用色彩有助於聚焦設計意圖。如果顏色沒有功能性,請特別注意
應用程式自訂範例
車輛原始設備製造商 (OEM) 自訂範例
這些範例說明車輛原始設備製造商 (OEM) 可能適用於應用程式 AAOS 版本的其他樣式自訂設定。雖然路線卡的顏色來自應用程式,但車輛原始設備製造商 (OEM) 會自訂路線卡、按鈕和預計到達時間資訊卡的字型、主題設定和形狀。也可以調整按鈕寬度,如下方的自訂按鈕所示。
日間導覽檢視畫面
![原始設備製造商 (OEM) 為日間導航的自訂範例](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/images/oem-daytime-navigation.png?authuser=6&hl=zh-tw)
夜間導航檢視畫面
![原始設備製造商 (OEM) 為夜間導覽的自訂範例](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/images/oem-nighttime-navigation.png?authuser=6&hl=zh-tw)
自訂按鈕寬度、顏色和形狀
這些範例說明原始設備製造商 (OEM) 如何在應用程式的 AAOS 版本中自訂按鈕寬度、顏色和形狀。
針對指定為主要按鈕的按鈕,原始設備製造商 (OEM) 可決定要使用應用程式強調色還是強調色。也可以配合各種情況 (例如有右側駕駛的車輛),將主要按鈕放在左側或右側。
左側主要按鈕,標準顏色 | 右側主要按鈕,自訂顏色 |
---|---|
![]() |
![]() |