Widżety to kluczowy element dostosowywania ekranu głównego użytkownika. Mogą one często pomóc użytkownikom w przebyciu przez kluczową ścieżkę w aplikacji za pomocą jednego kliknięcia lub mogą zawierać krótkie podsumowanie najważniejszych danych aplikacji. Można je też dostosować do potrzeb użytkownika i indywidualnych preferencji.
Jakość widżetu może wpływać na zaangażowanie użytkowników w treści i funkcje aplikacji. Są 3 główne poziomy jakości widżetów:
- Poziom 3. Niska jakość – nie spełniają minimalnych wymagań jakościowych i nie zapewniają użytkownikom dobrych wrażeń.
- Poziom 2: standard jakości – jest przydatny, użyteczny i zapewnia wysoką jakość.
- Poziom 1: zróżnicowane – to przykładowe widżety zapewniające wyróżniające się wrażenia, które są spersonalizowane i pomagają użytkownikom tworzyć niepowtarzalne i produktywne ekrany główny.
Poziom 3: niska jakość
Widżet uznaje się za niskiej jakości, jeśli nie spełnia kryteriów standardowego układu, koloru, odkrywania i treści. Więcej informacji o tworzeniu wysokiej jakości widżetów zgodnych ze sprawdzonymi metodami znajdziesz w tych wytycznych.
Poziom 2 – standard jakości
Aby zostać uznany za wysokiej jakości, widżet musi spełniać wszystkie te kryteria: układ, kolor, odkrywanie i treści:
Układ
- Widżet musi wypełniać granice ustawione przez siatkę uruchamiania po umieszczeniu na ekranie głównym. Rozmiar widżetu można zmienić na co najmniej jeden z tych rozmiarów : 2 x 2, 4 x 2 (komórki siatki w menu).
Więcej informacji znajdziesz w wytycznych dotyczących rozmiaru.
- Widżet musi być odpowiednio wyrównany względem innych elementów ekranu głównego wzdłuż osi pionowej lub poziomej i nie może zajmować niepotrzebnej przestrzeni.
- Widżet musi dotykać co najmniej dwóch przeciwległych krawędzi siatki. Innymi słowy, widżety nie muszą być prostokątne. Mogą mieć niestandardowe kształty, o ile ich krawędzie stykają się z co najmniej 2 krawędziami siatki.
- Jeśli można zmienić rozmiar widżetów, muszą mieć one odpowiedni rozmiar minimalny lub maksymalny, który można ustawić za pomocą funkcji
minWidth
,minHeight
,maxResizeWidth
imaxResizeHeight
w pliku AppWidgetProviderInfo XML.- Maksymalny rozmiar należy ustawić, jeśli zmiana rozmiaru widżetu powoduje tylko dodanie pustego miejsca.
- Minimalny rozmiar powinien być ustawiony na podstawie minimalnego rozmiaru, w którym widżet nadal zapewnia wartość i spełnia wymagania dotyczące docelowego elementu dotykowego (48 x 48).

Tak

Nie
Kolor
- Tekst i przyciski ikony widżetu muszą mieć wystarczający kontrast, aby spełniać wymagania dotyczące dostępności (nie dotyczy miniatur i obrazów).

Tak

Nie
Discovery
Widżet musi mieć dokładne podglądy w selektorze widżetów. Możesz go ustawić za pomocą elementów
previewImage
ipreviewLayout
w pliku AppWidgetProviderInfo XML lub za pomocą generowanych podglądów.- Podgląd widżetu jest spójny z funkcjami, które są dostępne po dodaniu widżetu do ekranu głównego.
Film 1: widżet z niedokładnym podglądem.
Treść
- Treści widżetów nie mogą być stale nieaktualne lub nie na czasie.
- Widget musi się zaktualizować po wykonaniu przez użytkownika działania w ramach widgetu.
- Widżet musi się zaktualizować po wykonaniu przez użytkownika powiązanego działania z poziomu aplikacji
- Jeśli oczekujesz, że dane będą odświeżane częściej niż interfejs, widget musi umożliwiać użytkownikom ręczne odświeżanie treści.
- Interfejs widżetu musi działać lub treść jest obcięta.
- Stany zerowy i pusty widget muszą być zamierzone i pokazywać wartość widgetu lub zawierać wezwanie do działania, gdy widget jest zainstalowany, ale użytkownik nie jest jeszcze zalogowany.


Poziom 1 – zróżnicowany
Najlepsze widżety spełniają wszystkie kryteria poziomu 2 oraz wszystkie te kryteria dotyczące układu, koloru, odkrywania i spójności systemu.
Układ
- Widżet wypełnia granice i prawidłowo dopasowuje się do innych elementów ekranu głównego wzdłuż osi pionowej lub poziomej, a także nie zajmuje niepotrzebnej przestrzeni.
- Wszystkie kształty MUSZĄ dotykać wszystkich 4 krawędzi siatki

Tak

Nie
Widżet obsługuje preferowany rozmiar
- Rozmiar widżetu może być ustawiony na co najmniej 1 z tych rozmiarów : 2 x 2, 4 x 2
Nagłówek widżetu jest używany i stosowany konsekwentnie
- Zalecamy użycie nagłówka, jeśli:
- Chcesz udostępnić precyzyjne linki do określonych funkcji aplikacji, takich jak wyszukiwanie.
- Chcesz zastosować ikonę marki aplikacji, która będzie też służyć jako spójny link do aplikacji po jej kliknięciu.
- Widget zawiera przewijany element (listę, siatkę itp.)
- Treść nagłówka zawiera przydatny kontekst (nazwa listy zadań)
- Nagłówek jest opcjonalny, gdy:
- Widżet to obraz na całej stronie (Zdjęcia)
- Liczba miejsc jest ograniczona (maksymalnie 2 wiersze)
- Gdy zawartość nagłówka jest zbędna.
- Jeśli używasz nagłówka, musi on spełniać nasze wymagania:
- Ikona, tytuł, działania.
- Ikona jest zawsze widoczna.
- Tytuł pojawia się, gdy jest wystarczająco dużo miejsca
- działania na podstawie kontekstu widżetu.
- Wysokość 48 dp, wypełnienie 14 dp
- Ikona, tytuł, działania.
- Zalecamy użycie nagłówka, jeśli:

Tak

Nie
Kolor
- Widget obsługuje paletę kolorów na podstawie motywu systemu, koloru treści lub koloru marki.
- Widżet obsługuje palety trybu jasnego i ciemnego.
- Kolor dynamiczny to przykład motywu kontekstu urządzenia.
- Wyodrębnianie kolorów lokalnych to przykład motywu związanego z treścią aplikacji.
- Kolor semantyczny to przykład motywu opartego na treściach aplikacji.

Discovery
- Podgląd zawiera treści użytkownika lub stosuje motyw systemowy (interfejs API Generated
Previews lub element
previewLayout
w pliku AppWidgetProviderInfo XML).

- Widżet ma nazwę lub opis, który pomaga użytkownikom zrozumieć jego wartość.
- Nazwa ma mniej niż 50 znaków.
- Nazwa i opis są unikalne w ramach aplikacji. Na przykład aplikacja nie może mieć kilku widżetów o tej samej nazwie.

Tak

Nie
Spójność systemu
- Prostokątne widżety muszą używać promienia narożnika podanego przez system (specyficzne dla OEM)

Tak

Nie
- Pokazuje stan wczytywania za pomocą wskaźnika postępu (w ramach
initialLayout
z kolorami tematycznymi lub odpowiednikami w ramach marki).

- Używa konfiguracji systemu zamiast punktu wejścia ustawień niestandardowego widgetu.
- Używa przejścia uruchamiania systemu podczas wchodzenia do widżetu i z niego wychodzenia
Podczas tworzenia widżetu pamiętaj o wskazówkach podanych w tym przewodniku. Dbamy o jakość i wygodę użytkowników. Wiele pasków jakości można uzyskać za pomocą standardowych układów. Aby dowiedzieć się więcej o paskach jakości, projektanci powinni zapoznać się z szablonami widżetów na Androida, a deweloperzy – z przykładami kodu układu w naszych przykładach platformy i przewodniku dla deweloperów dotyczącym układów.