Ikony pomagają użytkownikom rozpoznać aplikację i wykonywać w niej działania. Aby uzyskać dostęp do zestawu ikon Material, możesz dodać je do aplikacji bezpośrednio za pomocą opcji Utwórz. Aby tworzyć niestandardowe ikony lub ikony dla swojej aplikacji za pomocą widoków danych, Android Studio udostępnia aplikację Image Asset Studio.
Dodawanie ikon w aplikacji za pomocą funkcji Utwórz
Za pomocą funkcji Utwórz możesz zaimportować bibliotekę materiałów tworzenia wiadomości lub bibliotekę materiałów tworzenia materiałów 3, aby uzyskać dostęp do dowolnych ikon materiałów. Następnie użyj funkcji kompozycyjnej Icon
, aby dodać ikony do swojej aplikacji. Ikony Material Design są najbardziej przydatne w przypadku ikon na pasku działań, ikon kart i ikon powiadomień. Więcej informacji znajdziesz w sekcji Ikony materiałów.
Jeśli chcesz utworzyć ikony niestandardowe, na przykład ikonę menu z aplikacjami, użyj Image Asset Studio. W przypadku ikon programu uruchamiającego plik AndroidManifest.xml
musi odwoływać się do lokalizacji mipmap/
. Image Asset Studio dodaje ten kod automatycznie. Ten kod pliku manifestu odwołuje się do ikony ic_launcher
w katalogu mipmap/
:
<application android:name="ApplicationTitle" android:label="@string/app_label" android:icon="@mipmap/ic_launcher" >
Informacje o Image Asset Studio
Android Studio zawiera narzędzie o nazwie Image Asset Studio, które pomaga generować własne ikony aplikacji na podstawie ikon materiałów, obrazów niestandardowych i ciągów tekstowych. Generuje on zestaw ikon w odpowiedniej rozdzielczości dla każdej gęstości pikseli obsługiwanej przez aplikację.
Image Asset Studio umieszcza nowo wygenerowane ikony w folderach o określonej gęstości w katalogu res/
w projekcie. W czasie działania Android wykorzystuje zasoby odpowiednie do gęstości ekranu urządzenia, na którym działa aplikacja.
Image Asset Studio ułatwia generowanie tych typów ikon:
- Ikony Menu z aplikacjami
- Ikony na pasku działań i kartach
- Ikony powiadomień
W sekcjach poniżej opisujemy typy ikon, które możesz tworzyć, oraz dostępne sposoby wprowadzania obrazów i tekstu.
Ikony adaptacyjnego i starszego Menu z aplikacjami
Ikona programu uruchamiającego to grafika reprezentująca aplikację użytkownikom. Dzięki niemu:
- Pojawiają się na liście aplikacji zainstalowanych na urządzeniu i na ekranie głównym.
- Przedstawiaj skróty w aplikacji (np. ikonę skrótu kontaktu, który otwiera szczegółowe informacje o kontaktie).
- być używane przez aplikacje uruchamiające,
- Pomóż użytkownikom znaleźć Twoją aplikację w Google Play.
Ikony adaptacyjnego programu uruchamiającego mogą przybierać różne kształty na różnych modelach urządzeń. Są dostępne na Androidzie 8.0 (poziom interfejsu API 26) i nowszych. Android Studio 3.0 wprowadza obsługę tworzenia ikon adaptacyjnych za pomocą Image Asset Studio. Image Asset Studio generuje podgląd ikony adaptacyjnej w kształcie okręgu, okręgu, zaokrąglonego kwadratu i kwadratu, a także podgląd ikony z pełnym spadem. Image Asset Studio generuje też podgląd ikony: starsze, okrągłe i podglądy ikony ze Sklepu Google Play. Starsza ikona programu uruchamiającego to grafika reprezentująca aplikację na ekranie głównym urządzenia i w oknie programu uruchamiającego. Ikony starszej wersji w programie uruchamiającym są przeznaczone na urządzenia z Androidem 7.1 (poziom interfejsu API 25) lub starszym, które nie obsługują ikon adaptacyjnych i nie wyświetlają się w różny sposób w zależności od modelu urządzenia.
Image Asset Studio umieszcza ikony w odpowiednich miejscach w katalogach res/mipmap-density/
. Tworzymy też obraz o wymiarach 512 x 512 pikseli, odpowiedni do wykorzystania w Sklepie Google Play.
W przypadku ikon programu uruchamiającego zalecamy używanie stylu Material Design, nawet jeśli korzystasz ze starszych wersji Androida.
Więcej informacji znajdziesz w sekcjach Adaptacyjne ikony Menu z aplikacjami i Ikony produktów – Material Design.
Ikony na pasku działań i kartach
Ikony na pasku działań to elementy graficzne umieszczone na pasku działań, które reprezentują poszczególne działania. Więcej informacji znajdziesz w sekcjach Dodawanie działań i ich obsługa, Pasek aplikacji – Material Design i Projekt paska działań.
Ikony kart to elementy graficzne reprezentujące poszczególne karty w interfejsie wielokartowym. Każda ikona karty ma 2 stany: odznaczoną i zaznaczoną. Więcej informacji znajdziesz w artykułach Tworzenie widoków przesuwanych za pomocą kart i Karty – Material Design.
Image Asset Studio umieszcza ikony w odpowiednich miejscach w katalogach res/drawable-density/
.
Na pasku działań i ikonach kart zalecamy styl Material Design, nawet jeśli obsługujesz starsze wersje Androida. Użyj appcompat
i innych bibliotek pomocniczych, aby przesyłać interfejs Material Design na starsze wersje platformy.
Zamiast usługi Image Asset Studio możesz użyć narzędzia Vector Asset Studio, aby utworzyć pasek działań i ikony kart. Elementy rysowane w formacie wektorowym są odpowiednie dla prostych ikon i mogą zmniejszyć rozmiar aplikacji.
Ikony powiadomień
Powiadomienie to wiadomość, którą możesz wyświetlić użytkownikowi poza zwykłym interfejsem aplikacji. Image Asset Studio umieszcza ikony powiadomień w odpowiednich miejscach w katalogach res/drawable-density/
:
- Ikony Androida 2.2 (poziom interfejsu API 8) i starszych znajdują się w katalogach
res/drawable-density/
. - Ikony Androida w wersji od 2.3 do 2.3.7 (poziom interfejsu API od 9 do 10) znajdują się w katalogach
res/drawable-density-v9/
. - Ikony Androida 3 (poziom interfejsu API 11) i nowszych znajdują się w katalogach
res/drawable-density-v11/
.
Jeśli Twoja aplikacja obsługuje Androida w wersjach od 2.3 do 2.3.7 (poziom interfejsu API od 9 do 10), Image Asset Studio generuje szarą wersję ikony. Późniejsze wersje Androida używają białej ikony generowanej przez Image Asset Studio.
Więcej informacji znajdziesz w sekcjach Powiadomienia, Powiadomienia w stylu Material Design, Powiadomienia, zmiany na Androidzie 5.0, Powiadomienia, Android 4.4 i starsze oraz Ikony na pasku stanu w Androidzie 3.0 i starszych.
Obiekty clip art
Image Asset Studio ułatwia importowanie ikon Material Design Google w formatach VectorDrawable i PNG. Wystarczy wybrać ikonę w oknie. Więcej informacji znajdziesz w artykule Ikony materiałów.
Zdjęcia
Możesz zaimportować własne obrazy i dostosować je do typu ikony. Image Asset Studio obsługuje te typy plików: PNG (preferowany), JPG (akceptowany) i GIF (odradzane).
Ciągi tekstowe
Image Asset Studio pozwala wpisać ciąg tekstowy z różnymi czcionkami i umieścić go na ikonie. Konwertuje ikonę tekstową na pliki PNG o różnej gęstości. Możesz używać czcionek zainstalowanych na komputerze.
Uruchom Studio zasobów graficznych
Aby uruchomić narzędzie Image Asset Studio, wykonaj te czynności:
- W oknie Projekt wybierz widok Androida.
- Kliknij prawym przyciskiem myszy folder res i wybierz Nowy > Zasób obrazu.
- Wykonaj te czynności, aby:
- Utwórz adaptacyjne i starsze ikony programu uruchamiającego.
- Utwórz pasek działań lub ikonę karty.
- Utwórz ikonę powiadomień.
Tworzenie adaptacyjnych i starszych ikon programu uruchamiającego
Po otwarciu Image Asset Studio możesz dodać ikony adaptacyjne i starsze. Aby to zrobić:
- W polu Typ ikony wybierz Ikony programu uruchamiającego (adaptacyjne i starsze).
- Na karcie Warstwa na pierwszym planie wybierz Typ zasobu, a potem podaj zasób w polu poniżej:
- Kliknij Obraz, aby określić ścieżkę pliku obrazu.
- Wybierz Clip Art, aby wskazać obraz z zestawu ikon stylu Material Design.
- Kliknij Tekst, aby podać ciąg tekstowy i wybrać czcionkę.
- Na karcie Warstwa tła wybierz Typ zasobu, a następnie podaj zasób w polu poniżej. Możesz wybrać kolor lub określić obraz, który będzie używany jako warstwa tła.
- Na karcie Starsza wersja sprawdź ustawienia domyślne i potwierdź, że chcesz generować ikony starszego typu, zaokrąglone i ze Sklepu Google Play.
- Opcjonalnie zmień nazwę i ustawienia wyświetlania każdej karty Warstwa na pierwszym planie i Warstwa tła:
- Nazwa – jeśli nie chcesz używać nazwy domyślnej, wpisz nową. Jeśli ta nazwa zasobu już istnieje w projekcie, co wskazuje na błąd u dołu kreatora, zostanie ona zastąpiona. Nazwa może zawierać tylko małe litery, podkreślenia i cyfry.
- Przytnij – aby dostosować margines między grafiką ikony a obramowaniem w zasobie źródłowym, wybierz Tak. Ta operacja usuwa przezroczystą przestrzeń z zachowaniem proporcji obrazu. Aby pozostawić zasób źródłowy bez zmian, wybierz Nie.
- Kolor – aby zmienić kolor ikony Clip Art lub Tekst, kliknij pole. W oknie Wybierz kolor określ kolor, a potem kliknij Wybierz. W polu pojawi się nowa wartość.
- Zmień rozmiar – za pomocą suwaka możesz określić procent skalowania ikony Image, Clip Art lub Tekst. Ta opcja będzie wyłączona w przypadku warstwy tła, jeśli określisz typ zasobu Kolor.
- Kliknij Dalej.
- Opcjonalnie zmień katalog zasobów. Wybierz zbiór źródeł zasobów, do którego chcesz dodać zasób graficzny: src/main/res, src/debug/res, src/release/res lub niestandardowy zestaw źródeł. Główny zbiór źródłowy ma zastosowanie do wszystkich wariantów kompilacji, w tym do debugowania i tworzenia wersji. Zestawy źródeł debugowania i wersji zastępują główny zbiór źródłowy i mają zastosowanie do jednej wersji kompilacji. Zbiór źródeł debugowania służy tylko do debugowania. Aby zdefiniować nowy zbiór źródłowy, wybierz Plik > Struktura projektu > aplikacja > Typy kompilacji. Możesz na przykład zdefiniować zestaw źródeł w wersji beta i utworzyć wersję ikony, która zawiera w prawym dolnym rogu tekst „BETA”. Więcej informacji znajdziesz w artykule o konfigurowaniu wariantów kompilacji.
- Kliknij Zakończ. Image Asset Studio dodaje obrazy do folderów mipmap w zależności od gęstości.
Podgląd ikon aplikacji z motywami
Android Studio umożliwia wyświetlenie podglądu ikony aplikacji z motywem i sprawdzenie, jak dostosowuje się ona do koloru tapety użytkownika. Aby wyświetlić podgląd ikony aplikacji z motywem, otwórz plik launcher.xml
, który określa ikonę, i za pomocą selektora trybu interfejsu systemu na pasku narzędzi przełącz tapetę i zobacz, jak reaguje ikona.
Więcej informacji o tworzeniu tematycznych ikon aplikacji znajdziesz w artykule Ikony adaptacyjne.
![](https://developer.android.com/static/studio/images/system-ui-mode-selector.png?authuser=7&hl=pl)
![](https://developer.android.com/static/studio/images/preview-themed-app-icons.gif?authuser=7&hl=pl)
Tworzenie paska działań lub ikony karty
Po otwarciu Image Asset Studio możesz dodać pasek działań lub ikonę karty. Aby to zrobić:
- W polu Typ ikony wybierz Pasek działań i ikony kart.
- Wybierz Typ zasobu i podaj zasób w polu poniżej:
- W polu Clip Art kliknij przycisk.
- W polu Ścieżka podaj ścieżkę i nazwę pliku obrazu. Kliknij ..., aby otworzyć okno.
- W polu Tekst wpisz ciąg znaków i wybierz czcionkę.
- Opcjonalnie zmień nazwę i opcje wyświetlania:
- Nazwa – jeśli nie chcesz używać nazwy domyślnej, wpisz nową. Jeśli ta nazwa zasobu już istnieje w projekcie, co wskazuje na błąd u dołu kreatora, zostanie ona zastąpiona. Nazwa może zawierać tylko małe litery, podkreślenia i cyfry.
- Przytnij – aby dostosować margines między grafiką ikony a obramowaniem w zasobie źródłowym, wybierz Tak. Ta operacja usuwa przezroczystą przestrzeń z zachowaniem proporcji. Aby pozostawić zasób źródłowy bez zmian, wybierz Nie.
- Dopełnienie – jeśli chcesz dostosować dopełnienie zasobu źródłowego ze wszystkich czterech stron, przesuń suwak. Wybierz wartość od -10% do 50%. Jeśli wybierzesz też Przytnij, przycięcie nastąpi najpierw.
- Motyw – wybierz HOLO_light lub HOLO_DARK. Aby określić kolor w oknie Wybierz kolor, wybierz NIESTANDARDOWY, a następnie kliknij pole Kolor niestandardowy.
Image Asset Studio tworzy ikonę w przezroczystym kwadracie, aby zachować dopełnienie na krawędziach. Dopełnienie zapewnia wystarczającą ilość miejsca na standardowy efekt ikony z cieniem.
- Kliknij Dalej.
- Opcjonalnie zmień katalog zasobów:
- Katalog Res – wybierz zbiór źródeł zasobów, do którego chcesz dodać zasób graficzny: src/main/res, src/debug/res, src/release/res lub zdefiniowany przez użytkownika zestaw źródeł. Główny zbiór źródłowy ma zastosowanie do wszystkich wariantów kompilacji, w tym do debugowania i tworzenia wersji. Zestawy źródeł debugowania i wersji zastępują główny zbiór źródłowy i dotyczą jednej wersji kompilacji. Zbiór źródeł debugowania służy tylko do debugowania. Aby zdefiniować nowy zbiór źródłowy, wybierz Plik > Struktura projektu > aplikacja > Typy kompilacji. Możesz na przykład zdefiniować zestaw źródeł w wersji beta i utworzyć wersję ikony, która zawiera w prawym dolnym rogu tekst „BETA”. Więcej informacji znajdziesz w artykule o konfigurowaniu wariantów kompilacji.
- Kliknij Zakończ.
W oknie Wybór ikony wybierz ikonę materiału i kliknij OK.
Ikona pojawi się w obszarze Zasób źródłowy po prawej stronie oraz w obszarze podglądu u dołu kreatora.
W obszarze Katalogi wyjściowe są wyświetlane obrazy i foldery, w których będą widoczne w widoku Pliki projektu w oknie Projektu.
Image Asset Studio dodaje obrazy w folderach drawable o różnej gęstości.
Tworzenie ikony powiadomienia
Po otwarciu Image Asset Studio możesz dodać ikonę powiadomienia. Aby to zrobić:
- W polu Typ ikony wybierz Ikony powiadomień.
- Wybierz Typ zasobu i podaj zasób w polu poniżej:
- W polu Clip Art kliknij przycisk.
- W polu Ścieżka podaj ścieżkę i nazwę pliku obrazu. Kliknij ..., aby otworzyć okno.
- W polu Tekst wpisz ciąg znaków i wybierz czcionkę.
- Opcjonalnie zmień nazwę i opcje wyświetlania:
- Nazwa – jeśli nie chcesz używać nazwy domyślnej, wpisz nową. Jeśli ta nazwa zasobu już istnieje w projekcie, co wskazuje na błąd u dołu kreatora, zostanie ona zastąpiona. Nazwa może zawierać tylko małe litery, podkreślenia i cyfry.
- Przytnij – aby dostosować margines między grafiką ikony a obramowaniem w zasobie źródłowym, wybierz Tak. Ta operacja usuwa przezroczyste miejsce przy zachowaniu współczynnika proporcji. Aby pozostawić zasób źródłowy bez zmian, wybierz Nie.
- Dopełnienie – jeśli chcesz dostosować dopełnienie zasobu źródłowego ze wszystkich czterech stron, przesuń suwak. Wybierz wartość od –10% do 50%. Jeśli wybierzesz też Przytnij, przycięcie nastąpi najpierw.
Image Asset Studio tworzy ikonę w przezroczystym kwadracie, aby zachować dopełnienie na krawędziach. Dopełnienie zapewnia wystarczającą ilość miejsca na standardowy efekt ikony z cieniem.
- Kliknij Dalej.
- Opcjonalnie zmień katalog zasobów:
- Katalog Res – wybierz zbiór źródeł zasobów, do którego chcesz dodać zasób graficzny: src/main/res, src/debug/res, src/release/res lub zdefiniowany przez użytkownika zestaw źródeł. Główny zbiór źródłowy ma zastosowanie do wszystkich wariantów kompilacji, w tym do debugowania i tworzenia wersji. Zestawy źródeł debugowania i wersji zastępują główny zbiór źródłowy i dotyczą jednej wersji kompilacji. Zbiór źródeł debugowania służy tylko do debugowania. Aby zdefiniować nowy zbiór źródłowy, wybierz Plik > Struktura projektu > aplikacja > Typy kompilacji. Możesz na przykład zdefiniować zestaw źródeł w wersji beta i utworzyć wersję ikony, która zawiera w prawym dolnym rogu tekst „BETA”. Więcej informacji znajdziesz w artykule o konfigurowaniu wariantów kompilacji.
- Kliknij Zakończ.
W oknie Wybór ikony wybierz ikonę materiału i kliknij OK.
Ikona pojawi się w obszarze Zasób źródłowy po prawej stronie oraz w obszarze podglądu u dołu kreatora.
W obszarze Katalogi wyjściowe są wyświetlane obrazy i foldery, w których będą widoczne w widoku Pliki projektu w oknie Projektu.
Image Asset Studio dodaje obrazy do folderów rysowalnych w zależności od gęstości i wersji.
Odwołaj się do zasobu graficznego w kodzie za pomocą widoków danych
Do zasobu graficznego możesz się zwykle odwoływać w kodzie w ogólny sposób, a po uruchomieniu aplikacji odpowiedni obraz wyświetla się automatycznie w zależności od urządzenia:
- W większości przypadków zasoby obrazu możesz określać jako
@drawable
w kodzie XML lubDrawable
w kodzie Java.
Na przykład ten kod XML układu wyświetla element rysowalny w elemencie ImageView:
<ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:src="@drawable/myimage" />
Ten kod w Javie pobiera obraz jako Drawable
:
Kotlin
val drawable = resources.getDrawable(R.drawable.myimage, theme)
Java
Resources res = getResources(); Drawable drawable = res.getDrawable(R.drawable.myimage, getTheme());
Metoda getResources()
znajduje się w klasie Context
, która dotyczy obiektów interfejsu, takich jak działania, fragmenty, układy, widoki itd.
app:srcCompat
. Na przykład:<ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" app:srcCompat="@drawable/myimage" />
Dostęp do zasobów graficznych jest możliwy tylko z wątku głównego.
Jeśli zasób obrazu znajduje się w katalogu res/
swojego projektu, możesz odwołać się do niego w kodzie w Javie lub układzie XML, używając jego identyfikatora zasobu.
Ten kod w Javie ustawia ImageView na korzystanie z zasobu drawable/myimage.png
:
Kotlin
findViewById<ImageView>(R.id.myimageview).apply { setImageResource(R.drawable.myimage) }
Java
ImageView imageView = (ImageView) findViewById(R.id.myimageview); imageView.setImageResource(R.drawable.myimage);
Więcej informacji znajdziesz w artykule na temat dostępu do zasobów.
Usuwanie ikony z projektu
Aby usunąć ikonę z projektu:
- W oknie Projekt wybierz widok Androida.
- Rozwiń folder res/mipmap, jeśli chcesz otworzyć ikonę programu uruchamiającego, lub folder res/drawable, jeśli masz inne ikony.
- Znajdź podfolder o nazwie ikony, którą chcesz usunąć.
- Wybierz folder i naciśnij klawisz Delete.
- Opcjonalnie wybierz opcje, aby sprawdzić, gdzie w projekcie jest używana ikona, i kliknij OK.
- Wybierz Build > czysty projekt.
- W razie potrzeby popraw wszystkie pozostałe błędy wynikające z fragmentów kodu, które odwołują się do zasobu.
W tym folderze ikona ma różne gęstości.
Możesz też wybrać Edytuj > Usuń. Możesz też kliknąć plik prawym przyciskiem myszy i wybrać Usuń.
Pojawi się okno Bezpieczne usuwanie.
Android Studio usunie pliki z projektu i dysku. Jeśli jednak wyszukasz w projekcie miejsca, w których pliki są używane, i zostaną znalezione niektóre przypadki użycia, możesz je wyświetlić i zdecydować, czy je usunąć. Aby skompilować projekt, musisz usunąć lub zastąpić te odwołania.
Android Studio usunie wszystkie wygenerowane pliki graficzne powiązane z usuniętym zasobem graficznym. Usuwa je z projektu i dysku.
Android Studio wyróżnia te błędy w kodzie. Po usunięciu z kodu wszystkich odwołań możesz ponownie skompilować projekt.