Adaptacyjne ikony

Ikona adaptacyjna (AdaptiveIconDrawable) może wyświetlać się różnie w zależności od możliwości urządzenia i motywu użytkownika. Ikony adaptacyjne są używane głównie w programie uruchamiającym na ekranie głównym, ale można ich też używać w skrótach, aplikacji Ustawienia, oknach udostępniania i ekranie przeglądu. Adaptacyjne ikony są używane we wszystkich formatach Androida.

W przeciwieństwie do obrazów bitmapowych ikony adaptacyjne dostosowują się do różnych przypadków użycia:

• Różne kształty: ikona adaptacyjna może przybierać różne kształty na różnych modelach urządzeń. Na przykład na jednym urządzeniu OEM może wyświetlić się okrągły kształt, a na drugim – zaokrąglony kształt. Każdy producent oryginalnego urządzenia musi dostarczyć maskę, której system używa do renderowania wszystkich ikon adaptacyjnych o tym samym kształcie.

  

• Efekty wizualne: ikona adaptacyjna obsługuje różne ciekawe efekty wizualne, które pojawiają się, gdy użytkownik umieści lub przesuwa ikonę po ekranie głównym.

  

• Tworzenie tematów użytkowników: od Androida 13 (poziom interfejsu API 33) użytkownicy mogą tworzyć motywy dostosowane do swoich ikon adaptacyjnych. Jeśli użytkownik włączy ikony aplikacji z motywem, włączając przełącznik Ikony z motywem w ustawieniach systemu, a program uruchamiający obsługuje tę funkcję, system określa kolor odcienia na podstawie kolorów wybranej przez niego tapety i motywu.

  

  W tych przypadkach na ekranie głównym nie pojawia się ikona aplikacji z motywem, tylko ikona aplikacji adaptacyjnej lub standardowej:

  • Jeśli użytkownik nie włączy tematycznych ikon aplikacji.
  • Jeśli aplikacja nie ma monochromatycznej ikony:
  • Jeśli launcher nie obsługuje tematycznych ikon aplikacji:

Projektowanie adaptacyjnych ikon

Aby ikona adaptacyjna obsługiwała różne kształty, efekty wizualne i motywy użytkowników, projekt musi spełniać te wymagania:

• Musisz udostępnić dwie warstwy dla wersji kolorowej ikony: jedną dla pierwszego planu i jedną dla tła. Warstwy mogą być wektorami lub mapami bitowymi, ale preferowane są wektory.

  

  

• Jeśli chcesz obsługiwać personalizowanie ikon aplikacji przez użytkowników, udostępnij jedną warstwę dla wersji monochromatycznej ikony.

  

• Rozmiar wszystkich warstw to 108 x 108 dp.

• Używaj ikon z czystymi krawędziami. Wokół ikony nie mogą być maski ani cienie tła.

• Użyj logo o rozmiarze co najmniej 48 x 48 dp. Nie może on przekraczać 66 x 66 dp, ponieważ wewnętrzny obszar 66 x 66 dp ikony pojawia się w zamaskowanym widocznym obszarze.

Zewnętrzne 18 dp po każdej z 4 stron warstw jest zarezerwowane na maskowanie i tworzenie efektów wizualnych, takich jak paralaksa lub pulsowanie.

Aby dowiedzieć się, jak tworzyć ikony adaptacyjne w Android Studio, zapoznaj się z szablonem ikony aplikacji na Androida Figma lub dokumentacją Android Studio dotyczącą tworzenia ikon programu uruchamiającego. Przeczytaj też post na blogu Projektowanie ikon adaptacyjnych.

Dodaj do aplikacji ikonę adaptacyjną

Ikony adaptacyjne, tak jak ikony nieadaptacyjne, są określane za pomocą atrybutu android:icon w pliku manifestu aplikacji.

Opcjonalny atrybut (android:roundIcon) jest używany przez Menu z aplikacjami, które reprezentują aplikacje z okrągłymi ikonami. Może być przydatny, jeśli ikona aplikacji zawiera okrągłe tło. Takie programy uruchamiające są wymagane do generowania ikon aplikacji przez zastosowanie okrągłej maski na android:roundIcon. Gwarantuje to, że możesz zoptymalizować wygląd ikony aplikacji, na przykład przez niewielkie powiększenie logo i po przycięciu okrągłego tła z pełnym spadem.

Poniższy fragment kodu ilustruje oba te atrybuty, ale większość aplikacji określa tylko atrybut android:icon:

<application
    ...
    android:icon="@mipmap/ic_launcher"
    android:roundIcon="@mipmap/ic_launcher_round"
    ...>
</application>

Następnie zapisz ikonę adaptacyjną w usłudze res/mipmap-anydpi-v26/ic_launcher.xml. Za pomocą elementu <adaptive-icon> możesz określać zasoby warstwy na pierwszym planie, tła i warstwy monochromatyczne dla ikon. Elementy wewnętrzne <foreground>, <background> i <monochrome> obsługują zarówno obrazy wektorowe, jak i obrazy bitmapowe.

Poniższy przykład pokazuje, jak zdefiniować elementy <foreground>, <background> i <monochrome> w <adaptive-icon>:

<?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>
...

Elementy rysowalne możesz też definiować jako elementy, wbudowując je w elementy <foreground>, <background> i <monochrome>. Poniższy fragment kodu pokazuje, jak można to zrobić przy użyciu elementu rysowalnego na pierwszym planie.

<?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>
...

Jeśli chcesz zastosować do skrótów tę samą maskę i efekt wizualny co zwykłe ikony adaptacyjne, użyj jednej z tych metod:

• W przypadku skrótów statycznych użyj elementu <adaptive-icon>.
• W przypadku skrótów dynamicznych wywołaj metodę createWithAdaptiveBitmap() podczas ich tworzenia.

Więcej informacji o wdrażaniu ikon adaptacyjnych znajdziesz w artykule o implementowaniu ikon adaptacyjnych. Więcej informacji o skrótach znajdziesz w omówieniu skrótów do aplikacji.

Dodatkowe materiały

Dodatkowe informacje o projektowaniu i implementowaniu ikon adaptacyjnych znajdziesz w materiałach poniżej.

• Szablon strony społeczności Figma
• Ikony adaptacyjne na Androidzie
• Projektowanie ikon adaptacyjnych
• Wdrażanie ikon adaptacyjnych
• Tworzenie ikon aplikacji w Android Studio
• Specyfikacja ikon używanych w Google Play