Pasek stanu i pasek nawigacyjny są razem nazywane paskami systemowymi. Wyświetlane na nich ważne informacje, takie jak poziom naładowania baterii, godzina alertów powiadomień i umożliwiają bezpośrednią interakcję z urządzeniem z dowolnego miejsca.
Musisz wziąć pod uwagę widoczność słupków systemowych, niezależnie od tego, interfejsu użytkownika do interakcji z systemem operacyjnym Android, metod wprowadzania i innych możliwości urządzenia. Utrzymuj słupki systemowe na górze większości warstw, aby zapewnić które są uwzględniane.
Wnioski
W projektach uwzględnij paski systemowe, aby uwzględnić bezpieczne strefy UI interakcje, metody wprowadzania, wycięcia w ekranie i inne możliwości urządzenia. Utrzymuj słupki systemowe w najwyższej warstwie, aby były uwzględniane.
Zadbaj o przezroczystość pasków systemowych i rozmieść aplikację na pełnym ekranie. z obsługą interfejsu pod słupkami, aby zapewnić pełną wygodę korzystania z aplikacji.
Unikaj dodawania gestów dotykowych oraz przeciągania elementów między elementami gestów. ich konflikt z nawigacją od krawędzi do krawędzi i gestami.
Ilustracja 2. Wstawia gesty systemowe. Nie dotykaj kranu w tych obszarach
Umieść treść za paskami systemowymi
Dzięki funkcji od krawędzi do krawędzi Android wyświetla interfejs pod paskami systemowymi co da im jeszcze większe możliwości. Zalecamy korzystanie z technologii brzegowej do krawędzi, ponieważ Użytkownicy często proszą o to, aby były przezroczyste. (Przeczytaj, jak obsługują format edge-to-edge).
Aplikacja może rozwiązać problem nakładania się treści, reagując na zestawy. Wstawki – opis w jakim stopniu treść aplikacji musi zostać dopełniona, aby uniknąć nakładania się elementów interfejsu systemu operacyjnego Android, takich jak pasek nawigacyjny czy pasek stanu, lub funkcji urządzeń fizycznych, takich jak wycięcia w ekranie.
Podczas projektowania treści od krawędzi do krawędzi pamiętaj o tych typach wkładek przypadki:
- Wcięcia pasków systemowych mają zastosowanie do interfejsu, który można kliknąć i który nie powinien wizualne przysłonięte paskami systemowymi.
- Zestawy gestów systemowych dotyczą obszarów nawigacji przy użyciu gestów w systemie. które mają wyższy priorytet niż Twoja aplikacja.
Pasek postępu
W Androidzie pasek stanu zawiera ikony powiadomień i ikony systemowe. użytkownik wchodzi w interakcję z paskiem stanu, przeciągając go w dół, aby uzyskać dostęp do powiadomienia cieni.
Pasek stanu może wyglądać różnie w zależności od kontekstu, pory dnia ustawione przez użytkownika preferencje lub motywy oraz inne parametry. Możesz też określić stylu paska stanu, jak w przykładach poniżej.
Upewnij się, że treść aplikacji rozciąga się na cały ekran (od krawędzi do krawędzi) Używaj przezroczystych pasków systemowych z treściami od krawędzi do krawędzi, jak widać w tabeli z tego przykładu.
Po otrzymaniu powiadomienia na pasku stanu pojawia się zwykle ikona. Ten informuje użytkownika, że w panelu powiadomień może coś zobaczyć. Może to być ikona lub symbol Twojej aplikacji reprezentujące kanał. Zobacz Wygląd powiadomień.
Ustaw styl paska stanu
Dopasuj tło paska stanu do motywu aplikacji, używając niestandardowego koloru czy styl, a także ustawienia przezroczystości i przezroczystości.
<style name="Theme.MyApp">
<item name="android:statusBarColor">
@android:color/transparent
</item>
</style>
Jeśli ręcznie ustawiasz kolor tła, możesz opcjonalnie dodać styl do stanu aby uzyskać optymalny kontrast.
Wycięcia w ekranie i pasek stanu
Wycięcie w ekranie to na niektórych urządzeniach wycięcie w ekranie z miejscem na czujniki z przodu. Może mieć wpływ na wygląd pasków stanu. Wycięcia w ekranie mogą się różnić w zależności od producenta.
Dowiedz się, jak obsługiwać wycięcia w ekranie.
Pasek nawigacyjny
Android pozwala użytkownikom sterować nawigacją za pomocą opcji Wstecz, Ekran główny i Przegląd:
- Powrót powoduje powrót bezpośrednio do poprzedniego widoku.
- Strona główna zostanie przeniesiona z aplikacji na ekran główny urządzenia.
- Przegląd pokazuje, które aplikacje są otwarte i zostały niedawno otwarte.
Użytkownicy mogą wybierać spośród różnych konfiguracji pasków nawigacyjnych, w tym gestów nawigacja (zalecana) i nawigacja przy użyciu 3 przycisków.
Nawigacja przy użyciu gestów
Wprowadzona w Androidzie 10 (poziom interfejsu API 29) zalecana jest nawigacja przy użyciu gestów typ nawigacji, ale nie możesz zastąpić preferencji użytkownika. Gest nawigacja nie używa przycisków Wstecz, Home i Przegląd. Zamiast tego wyświetla się uchwyt do afordancji. Aby wejść w interakcję, przesuń palcem od lewej lub prawą krawędzi ekranu, aby przejść wstecz i do przodu, lub w górę od dołu w domu. Przesuwanie palcem w górę i przytrzymywanie otwiera przegląd.
Nawigacja przy użyciu gestów to bardziej skalowalny wzorzec nawigacji na urządzeniach mobilnych i większych ekranach. Aby zapewnić użytkownikom najlepsze wrażenia, weź pod uwagę nawigowanie przy użyciu gestów według:
- Obsługa treści od początku do końca.
- Unikaj dodawania interakcji lub docelowych elementów dotykowych w elementach nawigacyjnych przy użyciu gestów.
Przeczytaj o implementowaniu nawigacji przy użyciu gestów.
Nawigacja przy użyciu 3 przycisków
Nawigacja przy użyciu 3 przycisków obejmuje 3 przyciski Wstecz, Ekran główny i Przegląd.
Inne odmiany paska nawigacyjnego
W zależności od wersji Androida i urządzenia inne konfiguracje paska nawigacyjnego mogą udostępnić użytkownikom. Na przykład nawigacja przy użyciu 2 przycisków umożliwia Przyciski ekranu głównego i Wstecz.
Ustaw styl nawigacji
Przykład poniżej pokazuje, jak wdrożyć styl nawigacji.
<style name="Theme.MyApp">
<item name="android:navigationBarColor">
@android:color/transparent
</item>
</style>
Android obsługuje w całości wizualną ochronę interfejsu za pomocą gestów w trybie nawigacji czy trybach przycisków.
Tryb nawigacji przy użyciu gestów: system stosuje dynamiczną adaptację kolorów. którego kolor pasków systemowych zmienia kolor w zależności od zawartości, za nimi. W poniższym przykładzie nick na pasku nawigacyjnym zmieni kolor na ciemny, jeśli zostanie umieszczony nad jasnymi treściami, i na odwrót.
Rysunek 12. Dynamiczne dostosowywanie kolorów Tryby przycisków: system wyświetla za nim półprzezroczystą planszę. słupki (dla poziomu API 29 lub nowszego) lub przezroczysty pasek systemowy (dla poziomu interfejsu API) 28 lub mniej).
Rys. 13. Dynamiczna adaptacja kolorów, gdy są słupki systemowe Zmieniają kolor w zależności od tego, co znajduje się za nim
Klawiatura i nawigacja
Każdy typ nawigacji prawidłowo reaguje na klawiaturę ekranową na
pozwalają użytkownikowi na wykonywanie takich czynności jak zamknięcie lub nawet zmiana ustawienia
typu klawiatury. Aby zapewnić płynne przejście klawiatury,
przejście zsynchronizowane przez przejście aplikacji przesuwaniem klawiatury
od dołu do góry ekranu, użyj klawiszy
WindowInsetsAnimationCompat
Tryb imersji
Możesz ukryć paski systemowe, gdy np. korzystasz z pełnego ekranu gdy użytkownik ogląda film. Użytkownik powinien nadal mieć możliwość kliknięcia wyświetlić paski systemowe i interfejs, aby umożliwić nawigację lub interakcję z elementami sterującymi systemu. Dowiedz się więcej o projektowaniu pod kątem trybów pełnoekranowych lub przeczytaj, jak Ukryj paski systemowe w trybie pojemnym.