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.

Ilustracja 3 poziomów jakości w formie warstw ułożonych pionowo z wyróżnionym środkowym poziomem.

Wskazówki

Zadbaj o to, aby Twoja aplikacja dostosowywała się do wszystkich rozmiarów wyświetlacza i stanów urządzenia.

Interfejs użytkownika

Identyfikator wskazówki Identyfikatory testów Opis
Responsive_adaptive_layouts T-Layout_Flow

Aplikacja ma elastyczne i adaptacyjne układy zaprojektowane pod kątem ekranów o wszystkich rozmiarach. Wszystkie układy są elastyczne (patrz Migrowanie interfejsu do układów elastycznych). Implementacja układów adaptacyjnych jest określana przez klasy rozmiaru okna.

Interfejs aplikacji może zawierać te elementy:

  • nowoczesne paski nawigacyjne, które na większych ekranach rozwijają się do pełnych paneli nawigacyjnych;
  • układy siatki, które skalują liczbę kolumn, aby dostosować się do zmian rozmiaru okna;
  • kolumny tekstu na dużych ekranach;
  • panele końcowe, które są domyślnie otwarte na ekranach komputerów, a zamknięte na mniejszych ekranach.

W razie potrzeby twórz układy wielopanelowe, aby wykorzystać przestrzeń na dużym ekranie. Patrz Układy kanoniczne.

W przypadku aplikacji Jetpack Compose używaj układów adaptacyjnych (np. ListDetailPaneScaffold), aby tworzyć interfejsy wielopanelowe. W przypadku starszych aplikacji opartych na aktywności 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 elementy dodatkowe są prawidłowo sformatowane na wszystkich typach ekranów i w różnych stanach urządzenia, np.:

  • arkusze dolne nie zajmują całej szerokości na dużych ekranach (aby uniknąć rozciągania, zastosuj maksymalną szerokość); patrz Zachowanie w arkuszach: dolne;
  • przyciski nie zajmują całej szerokości na dużych ekranach patrz Zachowanie w przyciskach;
  • pola tekstowe i pola nie rozciągają się na całą szerokość na dużych ekranach patrz Zachowanie w polach tekstowych;
  • małe menu edycji lub okna modalne nie zajmują całego ekranu i w jak największym stopniu zachowują kontekst dla użytkownika patrz Menu;
  • menu kontekstowe pojawiają się obok elementu wybranego przez użytkownika patrz temat „Menu kontekstowe” w sekcji Menu;
  • paski nawigacyjne zastępują paski menu, aby zapewnić lepszą ergonomię na dużych ekranach patrz Pasek nawigacyjny;
  • panele nawigacji są aktualizowane do rozwiniętych pasków nawigacyjnych patrz Panel nawigacji;
  • okna dialogowe są aktualizowane do najnowszego komponentu Material patrz Okna dialogowe.
  • obrazy są wyświetlane w odpowiedniej rozdzielczości i nie są rozciągane ani przycinane.
Touch_Targets T-Touch_Targets Docelowe elementy dotykowe mają co najmniej 48 dp. Zapoznaj się z wytycznymi dotyczącymi układu i typografii Material Design.
Drawable_Focus T-Drawable_Focus W przypadku niestandardowych obiektów rysowalnych, które są interaktywne, tworzony jest stan aktywny. Niestandardowy obiekt rysowalny to każdy wizualny element interfejsu, który nie jest dostarczany przez platformę Android. Jeśli użytkownicy mogą wchodzić w interakcję z niestandardowym elementem rysowalnym, element ten musi 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 wskazówki Identyfikatory testów Opis
Keyboard_Navigation T-Keyboard_Navigation Główne przepływy zadań w aplikacji obsługują nawigację za pomocą klawiatury, w tym nawigację za pomocą klawisza Tab i strzałek. Patrz Tworzenie bardziej dostępnych aplikacji.
Keyboard_Shortcuts T-Keyboard_Shortcuts Aplikacja obsługuje skróty klawiszowe do często używanych działań, takich jak zaznaczanie, wycinanie, kopiowanie, wklejanie, cofanie i ponawianie. Patrz Klawiatura, mysz i trackpad.
Keyboard_Media_Playback T-Keyboard_Media_Playback Klawiatury można używać do sterowania odtwarzaniem multimediów. Na przykład klawisz 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 pełni funkcję wyjścia, która kończy lub cofa działanie, np.:
  • zamyka okna modalne, okna dialogowe, wyskakujące okienka i menu;
  • usuwa tekst wyszukiwania lub usuwa fokus wyszukiwania;
  • anuluje fokus klawiatury;
  • wychodzi z wideo pełnoekranowego, PIP, trybu pełnoekranowego lub pokazu slajdów;
  • zamyka elementy sterujące na ekranie, takie jak paski postępu lub menu;
  • anuluje minutniki „Następny” / autoodtwarzania;
  • usuwa zaznaczenie wszystkich wybranych elementów;
  • przerywa zmianę nazwy lub edycję bez zapisywania;
  • wychodzi z narzędzi do przycinania lub przekształcania i odrzuca zmiany.
Context_Menus T-Context_Menus Menu kontekstowe są dostępne za pomocą typowego kliknięcia prawym przyciskiem myszy lub trackpada (dodatkowy przycisk myszy lub dodatkowe dotknięcie).
Content_Zoom T-Content_Zoom Zawartość aplikacji można powiększać za pomocą kółka przewijania myszy (w połączeniu z naciśnięciem klawisza Control lub Ctrl) oraz gestów rozciągania na trackpadzie.
Hover_States T-Hover_States Elementy interfejsu, które można kliknąć, mają stany po najechaniu kursorem (w stosownych przypadkach), aby wskazywać użytkownikom myszy i trackpada, że można wejść z nimi w interakcję.

Testy

Aby mieć pewność, że Twoja aplikacja jest zoptymalizowana i reaguje na wszystkie konfiguracje wyświetlacza, wykonaj te testy.

Interfejs użytkownika

Identyfikator testu Identyfikatory wskazówek 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ę na tych urządzeniach w trybie wielu okien.

Sprawdź, czy układ aplikacji reaguje na różne rozmiary ekranu i okna oraz dostosowuje się do nich. Sprawdź, czy aplikacja rozwija i zwija paski nawigacyjne, skaluje liczbę kolumn w układach siatki, przenosi tekst do kolumn itp. Sprawdź, czy elementy interfejsu są sformatowane pod kątem estetyki i funkcji.

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 w stos na małych ekranach.
T-Touch_Targets Touch_Targets Sprawdź, czy docelowe elementy dotykowe zachowują spójny, dostępny rozmiar i położenie oraz nie są ukryte ani zasłonięte przez inne elementy interfejsu na wszystkich rozmiarach i konfiguracjach wyświetlacza. Więcej informacji o ułatwieniach dostępu znajdziesz w artykule Accessibility Scanner.
T-Drawable_Focus Drawable_Focus Na każdym ekranie aplikacji, który zawiera interaktywny niestandardowy element rysowalny, sprawdź, czy element ten można zaznaczyć za pomocą klawiatury zewnętrznej, pada kierunkowego lub innego urządzenia, które umożliwia zaznaczanie elementów interfejsu. Sprawdź, czy wizualne wskazanie stanu aktywnego jest widoczne. Więcej informacji znajdziesz w dokumentacji dotyczącej zaznaczania w Compose.

Klawiatura, mysz i trackpad

Identyfikator testu Identyfikatory wskazówek Opis
T-Keyboard_Navigation T-Keyboard_Navigation Poruszaj się po komponentach aplikacji, które można zaznaczyć, za pomocą klawisza Tab i strzałek na klawiaturze zewnętrznej.
T-Keyboard_Shortcuts Keyboard_Shortcuts Używaj skrótów klawiszowych na klawiaturze zewnętrznej, aby wykonywać działania zaznaczania, wycinania, kopiowania, wklejania, cofania i ponawiania.
T-Keyboard_Media_Playback Keyboard_Media_Playback Używaj klawiatury zewnętrznej, aby rozpoczynać, zatrzymywać, wstrzymywać, przewijać do tyłu i do przodu odtwarzanie multimediów.
T-Keyboard_Send Keyboard_Send Używaj klawisza Enter na klawiaturze zewnętrznej, aby wysyłać lub przesyłać dane.
T-Keyboard_Exit Keyboard_Exit

Używaj klawisza Esc na klawiaturze zewnętrznej, aby wykonywać funkcję wyjścia. Sprawdź, czy klawisz wykonuje te czynności (w stosownych przypadkach):

  • zamyka okna modalne, okna dialogowe, wyskakujące okienka i menu;
  • usuwa tekst wyszukiwania lub usuwa fokus wyszukiwania;
  • anuluje fokus klawiatury;
  • wychodzi z wideo pełnoekranowego, PIP, trybu pełnoekranowego lub pokazu slajdów;
  • zamyka elementy sterujące na ekranie;
  • anuluje minutniki „Następny” / autoodtwarzania;
  • usuwa zaznaczenie wszystkich wybranych elementów;
  • przerywa zmianę nazwy lub edycję bez zapisywania;
  • wychodzi z narzędzi do przycinania lub przekształcania i odrzuca zmiany.
T-Context_Menus Context_Menus Używaj dodatkowego przycisku myszy lub dodatkowego dotknięcia trackpada, aby uzyskać dostęp do menu kontekstowego elementów interaktywnych.
T-Content_Zoom Content_Zoom Używaj kółka przewijania myszy (w połączeniu z klawiszem Control lub Ctrl) oraz 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.