Siatki i jednostki

Piksele niezależne od gęstości (dp) i skalowalne (sp) są niezbędne do tworzenia układów i prezentowania czcionek, które jednolicie reagują na szeroki zakres gęstości ekranu, klas rozmiarów, formatów i formatów obrazu używanych na urządzeniach z Androidem.

Odebranie krążka

  • Jeśli używasz siatki bazowej, miary 4 i 8.
  • Zapisuj specyfikacje w dp i sp zamiast w pikselach.
  • Eksportuj grafikę bitmapową/grafikę rastrową dla wszystkich zasobników.
  • Projektuj z myślą o elastyczności, pamiętając o różnych klasach rozmiarów, rozdzielczościach i proporcjach obrazu.
  • Piksele niezależne od gęstości (dp): piksele niezależne od gęstości to elastyczne jednostki, które skalują się w celu uzyskania jednakowych wymiarów na dowolnym ekranie. Zależą one od fizycznej gęstości ekranu. Jednostki te są przedstawiane względem ekranu o rozdzielczości 160 dpi (kropki na cal), gdzie 1 dp to mniej więcej 1 piksel.
  • Piksele skalowalne (sp): skalowalne piksele służą do tej samej funkcji co dp, ale w przypadku czcionek. Wartość domyślna sp jest taka sama jak domyślna wartość dp. System Android oblicza rzeczywisty rozmiar czcionki na podstawie urządzenia i preferencji użytkownika ustawionych w aplikacji Ustawienia na urządzeniu z Androidem.
Rysunek 1. Porównanie dp z sp

Główna różnica między tymi jednostkami miary polega na tym, że skalowalne piksele zachowują ustawienia czcionki użytkownika. Użytkownicy, którzy mają większe ustawienia ułatwień dostępu, widzą rozmiar czcionki zgodny z wybranym ustawieniem. Zobacz, jak zmienić rozmiar czcionki w sekcji Utwórz.

Android używa tych jednostek, aby ułatwić skalowanie i tłumaczenie treści na różnych urządzeniach i w różnych rozdzielczościach.

Zasobniki gęstości

Ekrany o dużej gęstości mają więcej pikseli na cal niż te o małej gęstości. W efekcie elementy interfejsu o tych samych wymiarach w pikselach są większe na ekranach o małej gęstości, a mniejsze na ekranach o dużej gęstości. Dlatego nie należy deklarować pomiarów w pikselach.

Android grupuje zakresy gęstości ekranu w „zasobniki” i wykorzystuje je, aby dostarczać optymalny zestaw zasobów na Twoje urządzenie. Najczęściej używane zasobniki gęstości to mdpi, hdpi, xhdpi, xxhdpi i xxxhdpi (nodpi i anydpi odnoszą się do zasobnika, który nie skaluje się w zależności od rozdzielczości urządzenia (zwykle jest używany w przypadku elementów rysowanych wektorowo). Każdy z nich odpowiada plikowi zasobów aplikacji.

Rysunek 2. Kantalupa imprezowa w odpowiednich gęstości

Aby obliczyć dp:

dp = (szerokość w pikselach * 160) / gęstość ekranu

Siatki

Siatka podstawowa

Tworzenie spójnych odstępów i wyrównania w interfejsie siatki Interfejs Androida używa siatki 8 dp przy określaniu układu, komponentów i odstępów.

Film 1: wyświetlam siatkę o wymiarach 8 dp z zaznaczoną wartością przyrostową co 8 dp

Mniejsze elementy, takie jak ikony, typ i niektóre elementy w komponentach, najlepiej wyrównać do siatki o wymiarach 4 dp.

Rysunek 3. Siatki 8-dp są idealne dla większości elementów interfejsu, a siatka 4 dp jest lepsza w przypadku mniejszych elementów, takich jak ikony

Siatka kolumn

Kolumny tworzą strukturę siatki, która zapewnia pionową definicję układu dzięki podziałowi treści w obszarze treści. Są one umieszczane w obszarach ekranu, które zawierają kolumny. Dopasuj je do bazowej siatki, aby wyrównać zawartość, ale zachowaj elastyczny rozmiar. Podstawowe informacje o konfigurowaniu siatki kolumn i stosowaniu treści znajdziesz w artykule Podstawowe informacje o układzie.

Rysunek 4. Siatka 4-kolumnowa

Szczegółowe informacje o tworzeniu elastycznych układów w różnych formatach znajdziesz na stronie Układy kanoniczne w Material 3.

Klasy rozmiarów

Klasy rozmiaru okna to zestaw sprawdzonych punktów przerwania widocznego obszaru, który ułatwia projektowanie, tworzenie i testowanie elastycznych i adaptacyjnych układów aplikacji. Android dzieli klasy rozmiaru okna na 3 na: kompaktowy, średni i rozwinięty. Dowiedz się więcej o klasach rozmiarów okien.

Formaty obrazu

Współczynnik proporcji to stosunek szerokości elementu do jego wysokości. Współczynniki proporcji są zapisywane w formacie szerokość:wysokość.

Aby zachować spójność układu, używaj spójnych elementów takich jak obrazy, powierzchnie i rozmiar ekranu.

Zalecamy korzystanie z tych formatów obrazu w całym interfejsie:

  • 16:9
  • 3:2
  • 4:3
  • 1:1
  • 3:4
  • 2:3