Material Design to wszechstronny przewodnik na temat projektowania elementów wizualnych, ruchomych i interaktywnych na różnych platformach i urządzeniach. Aby używać interfejsu Material Design w aplikacjach na Androida, postępuj zgodnie ze wskazówkami w specyfikacji Material Design. Jeśli Twoja aplikacja korzysta z Jetpack Compose, możesz używać biblioteki Compose Material 3. Jeśli Twoja aplikacja korzysta z widoków, możesz korzystać z biblioteki Android Material Komponenty.
Android oferuje te funkcje, które pomagają w tworzeniu aplikacji w stylu Material Design:
- Motyw aplikacji Material Design, który nadaje styl wszystkim widżetom interfejsu
- widżety do obsługi złożonych widoków, takie jak listy i karty.
- Interfejsy API do niestandardowych cieni i animacji
Motyw Material Design i widżety
Aby korzystać z funkcji Material, takich jak styl standardowych widżetów interfejsu, i poprawić styl aplikacji, zastosuj do niej motyw oparty na materiale.
Jeśli tworzysz projekt na Androida za pomocą Android Studio, domyślnie stosuje się w nim motyw Material Design. Aby dowiedzieć się, jak zaktualizować motyw projektu, przeczytaj artykuł Style i motywy.
Aby zapewnić użytkownikom dobrze znane treści, użyj najczęstszych wzorców UX Material:
- Promuj główne działanie interfejsu za pomocą pływającego przycisku polecenia (FAB).
- Pokaż swoją markę, nawigację, wyszukiwanie i inne działania za pomocą paska aplikacji.
- Aby pokazać i ukryć nawigację w aplikacji, użyj panelu nawigacji.
- Wybierz jeden z wielu innych komponentów Material Design, aby dostosować układ aplikacji i poruszać się po niej, np. zwijające się paski narzędzi, karty czy dolny pasek nawigacyjny. Aby zobaczyć wszystkie, zajrzyj do katalogu Material Komponenty na Androida.
W miarę możliwości używaj wstępnie zdefiniowanych ikon Materiał. Na przykład jako przycisk menu nawigacji w panelu nawigacji użyj standardowej ikony „hamburger”. Listę dostępnych ikon znajdziesz w sekcji Ikony Material Design. Ikony SVG możesz też zaimportować z biblioteki Material Icon za pomocą narzędzia Vector Asset Studio w Android Studio.
Karty i cienie wysokości
Oprócz usług X i Y widoki na Androidzie mają właściwość Z. Ta właściwość reprezentuje wysokość widoku, która określa:
- Rozmiar cienia: widoki z wyższą wartością Z rzucają większy cień.
- Kolejność rysowania: widoki o wyższych wartościach Z pojawiają się nad innymi widokami.
W układzie opartym na kartach możesz zastosować wysokość, by wyświetlać ważne informacje na kartach, które zapewniają wygląd materiału. Za pomocą widżetu CardView
możesz tworzyć karty z domyślną wysokością. Więcej informacji znajdziesz w artykule o tworzeniu układu opartego na kartach.
Informacje o dodawaniu wysokości do innych widoków znajdziesz w artykule Tworzenie cieni i widoków klipów.
Animacje
Interfejsy API animacji umożliwiają tworzenie niestandardowych animacji na potrzeby reakcji na dotyk w elementach sterujących interfejsu użytkownika, zmian stanu widoku i przejścia aktywności.
Dzięki tym interfejsom API możesz:
- Reagowanie na zdarzenia dotknięcia w widokach za pomocą animacji powtórzenia dotknięcia.
- Ukrywanie i pokazywanie widoków za pomocą animacji okrągłych odsłon.
- Przełączaj się między aktywnościami za pomocą niestandardowych animacji przejścia aktywności.
- Twórz bardziej naturalne animacje za pomocą zakrzywionego ruchu.
- Animacja zmian w co najmniej 1 usłudze widoku za pomocą animacji zmiany stanu widoku.
- Pokazuj animacje w elementach rysowanych z listą stanów między zmianami stanu widoku.
Animacje reakcji na dotyk są wbudowane w kilka standardowych widoków, np. przyciski. Interfejsy API animacji umożliwiają dostosowywanie tych animacji i dodawanie ich do widoków niestandardowych.
Więcej informacji znajdziesz w artykule Wprowadzenie do animacji.
Elementy rysowalne
Te funkcje elementów rysowalnych pomagają wdrożyć aplikacje Material Design:
- Elementy rysowane wektorowe są skalowalne bez utraty definicji i doskonale się sprawdzają w przypadku jednokolorowych ikon w aplikacjach. Dowiedz się więcej o elementach rysowalnych w formacie wektorowym.
- Kolorowe zabarwienie pozwala zdefiniować mapy bitowe jako maskę alfa i zabarwić je kolorem w czasie działania. Zobacz, jak dodać odcień do obiektów, które można rysować.
- Wyodrębnianie kolorów umożliwia automatyczne wyodrębnianie widocznych kolorów z obrazu bitmapy. Dowiedz się, jak wybierać kolory za pomocą interfejsu Palette API.