Poziom 2 – optymalizacja adaptacyjna

Zoptymalizowane aplikacje w pełni obsługują wszystkie typy ekranów i stany urządzeń, w tym przejścia między stanami.

Wskazówki

Zaprojektuj aplikację tak, aby dostosowywała się do wszystkich rozmiarów wyświetlaczy i stanów urządzeń.

Interfejs użytkownika

Identyfikator wytycznych	Identyfikatory testów	Opis
Responsive_adaptive_layouts	T-Layout_Flow	Aplikacja ma elastyczne i adaptacyjne układy zaprojektowane dla ekranów o różnych rozmiarach. Wszystkie układy są elastyczne (patrz Migracja interfejsu na elastyczne układy). Implementacja układów adaptacyjnych jest określana przez klasy rozmiaru okna. Interfejs aplikacji może zawierać: paski nawigacyjne na krawędziach, które rozwijają się w pełne panele nawigacyjne w większych oknach; układy siatki, które skalują liczbę kolumn, aby dostosować się do zmian rozmiaru okna; Kolumny tekstu na dużych ekranach Panele na krawędzi końcowej, które są domyślnie otwarte na ekranach komputerów, a zamknięte na mniejszych ekranach. Twórz układy z wieloma panelami (w odpowiednich przypadkach), aby wykorzystać dużą przestrzeń ekranu. Zobacz Układy kanoniczne. W przypadku aplikacji Jetpack Compose używaj układów adaptacyjnych (takich jak ListDetailPaneScaffold), aby tworzyć interfejsy z wieloma panelami. W przypadku starszych aplikacji opartych na aktywnościach osadzanie aktywności umożliwia tworzenie układów wielopanelowych przez wyświetlanie aktywności obok siebie.
UI_Secondary_Elements	T-Layout_Flow	Okna modalne, menu kontekstowe i inne dodatkowe elementy są prawidłowo sformatowane na wszystkich typach ekranów i w różnych stanach urządzenia, na przykład: Plansze dolne nie zajmują całej szerokości dużych ekranów. (Zastosuj maksymalną szerokość, aby uniknąć rozciągania). Zobacz Układ elastyczny w sekcji Plansze dolne. Przyciski nie są wyświetlane na pełną szerokość na dużych ekranach. Zobacz Projekt adaptacyjny w sekcji Przyciski. Pola tekstowe nie rozciągają się na całą szerokość na dużych ekranach. Zobacz Projekt adaptacyjny w sekcji Pola tekstowe. Małe menu edycji lub okna modalne nie zasłaniają całego ekranu i w jak największym stopniu zachowują kontekst dla użytkownika. Zobacz Menu. Menu kontekstowe pojawiają się obok elementu wybranego przez użytkownika. Zobacz temat „Menu kontekstowe” w sekcji Menu. Panele nawigacyjne zastępują paski nawigacyjne, aby zapewnić lepszą ergonomię na dużych ekranach. Zobacz Kolumna nawigacji. Panele nawigacji zostały zastąpione rozszerzonymi szynami nawigacyjnymi. Zobacz Panel nawigacji. Okna dialogowe zostały zaktualizowane do najnowszego komponentu Material Design. Zobacz Okna. Obrazy są wyświetlane w odpowiedniej rozdzielczości i nie są rozciągnięte ani przycięte.
Touch_Targets	T-Touch_Targets	Docelowe elementy dotykowe mają co najmniej 48 dp. Zapoznaj się ze wskazówkami dotyczącymi rozmiarów elementów docelowych w Material Design.
Drawable_Focus	T-Drawable_Focus	Stan aktywny jest tworzony dla niestandardowych elementów rysowalnych, które są interaktywne. Niestandardowy element rysowalny to dowolny wizualny element interfejsu, który nie jest dostarczany przez platformę Androida. Jeśli użytkownicy mogą wchodzić w interakcje z niestandardowym elementem rysowalnym, musi on być możliwy do zaznaczenia, gdy urządzenie nie jest w trybie dotykowym, a wizualne wskazanie stanu zaznaczenia musi być widoczne.

Klawiatura, mysz i trackpad

Identyfikator wytycznych	Identyfikatory testów	Opis
Keyboard_Navigation	T-Keyboard_Navigation	Główne przepływy zadań w aplikacji obsługują nawigację za pomocą klawiatury, w tym klawisza Tab i strzałek. Zobacz Tworzenie aplikacji z ułatwieniami dostępu.
Keyboard_Shortcuts	T-Keyboard_Shortcuts	Aplikacja obsługuje skróty klawiszowe do wykonywania typowych działań, takich jak zaznaczanie, wycinanie, kopiowanie, wklejanie, cofanie i ponawianie. Zobacz Klawiatura, mysz i trackpad.
Keyboard_Media_Playback	T-Keyboard_Media_Playback	Klawiatury można używać do sterowania odtwarzaniem multimediów, np. spacja odtwarza i wstrzymuje multimedia.
Keyboard_Send	T-Keyboard_Send	Klawisz Enter na klawiaturze pełni funkcję wysyłania w aplikacjach do komunikacji.
Keyboard_Exit	T-Keyboard_Exit	Klawisz Esc na klawiaturze wykonuje funkcję wyjścia, która kończy lub cofa działanie, na przykład: Zamyka okna modalne, okna dialogowe, wyskakujące okienka i menu. Usuwa wyszukiwany tekst lub fokus wyszukiwania Anuluje zaznaczenie klawiatury Zamyka wideo pełnoekranowe, PIP, tryb pełnego ekranu lub pokaz slajdów Zamyka elementy sterujące na ekranie, takie jak paski postępu lub menu. Anuluje odliczanie do następnego filmu / autoodtwarzania. Odznacza wszystkie zaznaczone elementy Anuluje zmianę nazwy lub edytowanie bez zapisywania Zamyka narzędzia do przycinania i przekształcania oraz odrzuca zmiany.
Context_Menus	T-Context_Menus	Menu kontekstowe są dostępne po kliknięciu prawym przyciskiem myszy lub trackpada (kliknięcie prawym przyciskiem myszy lub dotknięcie dwoma palcami).
Content_Zoom	T-Content_Zoom	Zawartość aplikacji można powiększać za pomocą kółka przewijania myszy (z jednoczesnym naciśnięciem klawisza Control lub Ctrl) i gestów rozciągania na trackpadzie.
Hover_States	T-Hover_States	Elementy interfejsu, które można kliknąć, mają stany po najechaniu kursorem (w odpowiednich przypadkach), które wskazują użytkownikom myszy i trackpada, że można wejść z nimi w interakcję.

Testy

Aby upewnić się, że aplikacja jest zoptymalizowana i reaguje na wszystkie konfiguracje wyświetlania, wykonaj te testy.

Interfejs użytkownika

Identyfikator testu	Identyfikatory wytycznych	Opis
T-Layout_Flow	Responsive_adaptive_layouts, UI_Secondary_Elements	Uruchom aplikację na urządzeniach o różnych rozmiarach ekranu, w tym na telefonach, telefonach składanych, małych i dużych tabletach oraz komputerach. Uruchom aplikację w trybie wielu okien na urządzeniach. Sprawdź, czy układ aplikacji reaguje i dostosowuje się do różnych rozmiarów ekranu i okna. Sprawdź, czy aplikacja rozwija i zwija paski nawigacyjne, skaluje liczbę kolumn w układach siatki, dzieli tekst na kolumny itp. Sprawdź, czy elementy interfejsu są sformatowane pod kątem estetyki i funkcjonalności. W przypadku starszych aplikacji korzystających z osadzania aktywności sprawdź, czy aktywności są wyświetlane obok siebie na dużych ekranach i ułożone jedna na drugiej na małych ekranach.
T-Touch_Targets	Touch_Targets	Sprawdź, czy docelowe elementy dotykowe mają spójny, dostępny rozmiar i pozycję oraz czy nie są ukryte ani zasłonięte przez inne elementy interfejsu we wszystkich rozmiarach i konfiguracjach wyświetlacza. Więcej informacji o ułatwieniach dostępu znajdziesz w artykule o aplikacji Accessibility Scanner.
T-Drawable_Focus	Drawable_Focus	Na każdym ekranie aplikacji, który zawiera interaktywny niestandardowy element rysowalny, sprawdź, czy można ustawić na nim ostrość za pomocą klawiatury zewnętrznej, pada kierunkowego lub innego urządzenia, które umożliwia ustawianie ostrości na elementach interfejsu. Sprawdź, czy stan aktywny jest wyraźnie widoczny. Więcej informacji znajdziesz w dokumentacji dotyczącej zaznaczenia w Compose.

Klawiatura, mysz i trackpad

Identyfikator testu	Identyfikatory wytycznych	Opis
T-Keyboard_Navigation	Keyboard_Navigation	Poruszaj się po elementach aplikacji, które można zaznaczyć, używając klawisza Tab i klawiszy strzałek na klawiaturze zewnętrznej.
T-Keyboard_Shortcuts	Keyboard_Shortcuts	Używaj skrótów klawiszowych na klawiaturze zewnętrznej, aby wykonywać takie działania jak zaznaczanie, wycinanie, kopiowanie, wklejanie, cofanie i ponawianie.
T-Keyboard_Media_Playback	Keyboard_Media_Playback	Używaj klawiatury zewnętrznej do rozpoczynania, zatrzymywania, wstrzymywania, przewijania do tyłu i przewijania do przodu odtwarzania multimediów.
T-Keyboard_Send	Keyboard_Send	Aby wysłać lub przesłać dane, naciśnij klawisz Enter na klawiaturze zewnętrznej.
T-Keyboard_Exit	Keyboard_Exit	Użyj klawisza Esc na klawiaturze zewnętrznej, aby wyjść. Sprawdź, czy klucz wykonuje te czynności (w stosownych przypadkach): Zamyka okna modalne, okna dialogowe, wyskakujące okienka i menu. Usuwa wyszukiwany tekst lub fokus wyszukiwania Anuluje zaznaczenie klawiatury Zamyka wideo pełnoekranowe, PIP, tryb pełnego ekranu lub pokaz slajdów Zamyka elementy sterujące na ekranie Anuluje odliczanie do następnego filmu / autoodtwarzania. Odznacza wszystkie zaznaczone elementy Anuluje zmianę nazwy lub edytowanie bez zapisywania Zamyka narzędzia do przycinania i przekształcania oraz odrzuca zmiany.
T-Context_Menus	Context_Menus	Aby uzyskać dostęp do menu kontekstowego elementów interaktywnych, użyj dodatkowego przycisku myszy lub dodatkowego kliknięcia na trackpadzie.
T-Content_Zoom	Content_Zoom	Używaj kółka przewijania myszy (w połączeniu z klawiszem Control lub Ctrl) i gestów rozciągania na trackpadzie, aby powiększać i pomniejszać zawartość.
T-Hover_States	Hover_States	Najedź kursorem myszy lub trackpada na elementy interfejsu, które można kliknąć, aby aktywować stan po najechaniu kursorem.