自動調整圖示 (或 AdaptiveIconDrawable
) 可能會根據個別裝置的功能和使用者主題顯示不同的內容。主要用於主畫面的啟動器,但也可能用於捷徑、「設定」應用程式、分享對話方塊及總覽畫面。
自動調整圖示可配合不同用途調整:
不同形狀:自動調整圖示可以在不同裝置型號上顯示各種形狀。舉例來說,它可以在一部 OEM 裝置上顯示圓形,並在另一個裝置上顯示方形 (正方形與圓形之間的形狀)。裝置原始設備製造商 (OEM) 都必須提供遮罩,系統會使用該遮罩算繪所有具有相同形狀的自動調整圖示。
視覺效果:自動調整圖示支援各種引人入勝的視覺效果,當使用者在主畫面上放置或移動圖示,就會看到這些效果。
使用者主題設定:從 Android 13 (API 級別 33) 開始,使用者可以針對自動調整圖示套用主題。如果使用者啟用主題化應用程式圖示,只要在系統設定中開啟「主題化圖示」切換鈕,啟動器支援這項功能,系統就會根據使用者所選桌布和主題的色彩決定色調。
在以下情況中,主畫面不會顯示主題化應用程式圖示,而是顯示自動調整或標準應用程式圖示:
- 如果使用者未啟用主題化應用程式圖示,
- 如果您的應用程式未提供單色應用程式圖示,
- 如果啟動器不支援主題化應用程式圖示。
設計自動調整圖示
為確保自動調整圖示支援不同的形狀、視覺效果和使用者主題設定,設計必須符合下列規定:
您必須為圖示的色彩版本提供兩個圖層:一個用於前景,另一個用於背景。
如要支援使用者對應用程式圖示的主題設定,請提供一個單色圖示版本的圖層。
將所有圖層的大小調整為 108x108 dp。
使用邊緣簡潔的圖示。圖層在圖示輪廓周圍不得有遮罩或背景陰影。
請使用大小至少為 48x48 dp 的標誌。圖示不得超過 66x66 dp,因為圖示的內部 66x66 dp 會顯示在套用遮罩的可視區域中。
圖層四邊的外側 18 dp 則保留給遮罩,用來建立視差或閃爍等視覺效果。
如要瞭解如何使用 Android Studio 建立自動調整圖示,請參閱「Android 應用程式圖示 Figma 範本」或「用於建立啟動器圖示的 Android Studio 說明文件」。另請參閱設計自動調整圖示這篇網誌文章。
在應用程式中新增自動調整圖示
如要為應用程式新增自動調整圖示,請更新應用程式資訊清單中的 android:icon
屬性,指定可繪製資源。您也可以使用 android:roundIcon
屬性定義圖示可繪製資源,但前提是您需要針對圓形遮罩使用不同的圖示素材資源 (例如品牌宣傳必須使用圓形)。
下列程式碼片段說明這兩種屬性,但大多數應用程式只會指定 android:icon
:
<application ... android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" ...> </application>
接下來,在 res/mipmap-anydpi-v26/ic_launcher.xml
中,在應用程式中建立額外可繪製資源,以提供與 Android 8.0 (API 級別 26) 的回溯相容性。使用 <adaptive-icon>
元素,定義圖示的前景、背景和單色圖層可繪項目。<foreground>
、<background>
和 <monochrome>
內部元素支援 android:drawable
屬性。
以下範例說明如何在 <adaptive-icon>
中定義 <foreground>
、<background>
和 <monochrome>
元素:
<?xml version="1.0" encoding="utf-8"?> ... <adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android"> <background android:drawable="@drawable/ic_launcher_background" /> <foreground android:drawable="@drawable/ic_launcher_foreground" /> // Starting with Android 13 (API level 33), you can opt-in to providing a // <monochrome> drawable. <monochrome android:drawable="@drawable/ic_launcher_monochrome" /> </adaptive-icon> ...
您也可以將可繪項目定義為元素,只要在 <foreground>
、<background>
和 <monochrome>
元素中加入可繪項目即可。以下程式碼片段示範如何透過前景可繪項目執行此操作。
<?xml version="1.0" encoding="utf-8"?> ... <foreground> <inset android:insetBottom="18dp" android:insetLeft="18dp" android:insetRight="18dp" android:insetTop="18dp"> <shape android:shape="oval"> <solid android:color="#0000FF" /> </shape> </inset> </foreground> ...
如果您想為捷徑套用與一般自動調整圖示相同的遮罩和視覺效果,請使用下列其中一種技巧:
- 如果是靜態捷徑,請使用
<adaptive-icon>
元素。 - 如果是動態捷徑,請在建立捷徑時呼叫
createWithAdaptiveBitmap()
方法。
如要進一步瞭解如何實作自動調整圖示,請參閱「實作自動調整圖示」。如要進一步瞭解捷徑,請參閱「應用程式捷徑總覽」一文。
其他資源
如要進一步瞭解如何設計及實作自動調整圖示,請參閱下列資源。