Ekosystem Wear OS składa się z urządzeń o różnych rozmiarach ekranu. Stosowanie zasad dostosowywania interfejsu jest kluczowe dla zapewnienia najwyższej jakości wszystkim użytkownikom.
Czym jest interfejs adaptacyjny?
Interfejsy adaptacyjne rozciągają się i zmieniają, aby w pełni wykorzystać całą dostępną przestrzeń ekranu, niezależnie od jego rozmiaru.
Interfejsy adaptacyjne zmieniają się dynamicznie, korzystając z komponentów i metod wdrożonych bezpośrednio w logikę układu. Te układy wykorzystują też punkty graniczne rozmiaru ekranu, czyli stosują inny projekt na różnych rozmiarach ekranu, aby zapewnić użytkownikom jeszcze lepsze wrażenia.
Kluczowe rozmiary ekranu

Poznaj kluczowe rozmiary odniesienia, o których warto pamiętać podczas projektowania nowych funkcji
Typy układów
Podczas projektowania układów dostosowanych do ekranu okrągłego widoki przewijania i nieprzewijania mają różne wymagania dotyczące skalowania elementów interfejsu użytkownika i utrzymywania zrównoważonego układu oraz kompozycji.

Wszystkie marginesy górny, dolny i boczny powinny być zdefiniowane w procentach, aby uniknąć przycinania i zapewnić proporcjonalne skalowanie elementów.

Wszystkie marginesy należy zdefiniować w procentach, a ograniczenia pionowe w taki sposób, aby główne treści na środku mogły się rozciągać, wypełniając dostępną przestrzeń.
Dodawanie wartości dzięki elastycznym układom i praktykom związanym z projektowaniem
Podczas projektowania układów dostosowanych do ekranu okrągłego widoki przewijania i nieprzewijania mają różne wymagania dotyczące skalowania elementów interfejsu użytkownika i utrzymywania zrównoważonego układu oraz kompozycji.
Poniższe obrazy to ogólne sugestie. Przykłady służą wyłącznie celom poglądowym. Aby uzyskać szczegółowe, kontekstowe i dopasowane wskazówki, przejrzyj poszczególne komponenty lub strony.

Elastyczne układy pozwalają zmieścić na jednym ekranie więcej elementów, takich jak elementy interfejsu, karty, linie tekstu i przyciski.

Wykorzystaj nowe układy stosowane w określonych punktach przecięcia rozmiarów ekranu, aby w miarę możliwości wprowadzać nowe treści, zapewniając użytkownikom dodatkową wartość na urządzeniach z większymi ekranami.

Użyj dodatkowej przestrzeni na ekranie, aby zapewnić większe kontenery, większy tekst, grubsze pierście i bardziej szczegółową wizualizację danych, co ułatwi użytkownikom szybkie odczytanie informacji.

Użyj dodatkowej przestrzeni na ekranie, aby zapewnić większe cele dotykowe, lepszą hierarchię wizualną i dodatkowe odstępy między elementami treści, co ułatwia korzystanie z interfejsu.

Skorzystaj z naszych zaktualizowanych komponentów i szablonów, aby zapewnić lepszy wygląd i wrażenia z korzystania z interfejsu użytkownika na wszystkich rozmiarach ekranów.
Jakość aplikacji

Nasze wskazówki dotyczące jakości są uporządkowane na 3 poziomy. Zapewnij użytkownikom jak najlepsze wrażenia, spełniając wytyczne na wszystkich 3 poziomach.
Gotowa na wszystkie rozmiary ekranów |
Elastyczne i zoptymalizowane |
Adaptacyjne i zróżnicowane |
Korzystanie z układów kanonicznych

Używaj ustalonych kanonnicznych układów, aby ułatwić płynne dostosowanie interfejsu do różnych rozmiarów urządzeń.
Nasze kanoniczne układy zostały starannie opracowane, aby zapewnić wysoką jakość na wszystkich rozmiarach ekranów.