Ulepsz swój widżet

Ta strona zawiera szczegółowe informacje na temat opcjonalnych ulepszeń widżetów, które są dostępne od Androida 12 (poziom interfejsu API 31). Te funkcje są opcjonalne, ale które można łatwo wdrożyć i poprawić widżet.

Używanie dynamicznych kolorów

Od Androida 12 widżet może używać kolorów motywu urządzenia z przyciskami, tłami i innymi elementami. Dzięki temu będzie płynniejsza przejścia i spójność między różnymi widżetami.

Istnieją dwa sposoby na uzyskanie dynamicznych kolorów:

Po ustawieniu motywu w układzie głównym możesz stosować typowe atrybuty kolorów w pierwiastek lub jego elementy podrzędne, aby odebrać barwy dynamiczne.

Oto kilka przykładów atrybutów koloru:

  • ?attr/primary
  • ?attr/primaryContainer
  • ?attr/onPrimary
  • ?attr/onPrimaryContainer

W przykładzie poniżej z motywem Material 3 kolor motywu urządzenia to: „fioletowy”. Kolor uzupełniający i tło widżetu dostosowują się do jasności i ciemności jak pokazujemy na rysunkach 1 i 2.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="?attr/colorPrimaryContainer"
  android:theme="@style/Theme.Material3.DynamicColors.DayNight">

  <ImageView
    ...
    app:tint="?attr/colorPrimaryContainer"
    android:src="@drawable/ic_partly_cloudy" />

    <!-- Other widget content. -->

</LinearLayout>
Widżet w trybie jasnym
Rysunek 1. Widżet w jasnym motywie.
.
.
Widżety w trybie ciemnym
Rys. 2. Widżet w ciemnym motywie.

Zgodność wsteczna kolorów dynamicznych

Dynamiczne kolory są dostępne tylko na urządzeniach z Androidem 12 lub wyższą. Aby udostępnić motyw niestandardowy dla starszych wersji, utwórz motyw domyślny z własnymi kolorami i nowym kwalifikatorem (values-v31) z kolorami domyślnymi atrybutów motywu.

Oto przykład z wykorzystaniem motywu Material 3:

/values/styles.xml

<resources>
  <style name="MyWidgetTheme" parent="Theme.Material3.DynamicColors.DayNight">
    <!-- Override default colorBackground attribute with custom color. -->
    <item name="android:colorBackground">@color/my_background_color</item>

    <!-- Add other colors/attributes. -->

  </style>
</resources>

/values-v31/styles.xml

<resources>
  <!-- Do not override any color attribute. -->
  <style name="MyWidgetTheme" parent="Theme.Material3.DynamicColors.DayNight" />
</resources>

/layout/my_widget_layout.xml

<resources>
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    ...
    android:background="?android:attr/colorBackground"
    android:theme="@style/MyWidgetTheme" />
</resources>

Włącz pomoc głosową

Działania w aplikacji pozwalają Asystentowi Google wyświetlanie widżetów w odpowiedzi na odpowiednie polecenia głosowe użytkownika. Konfigurując do reagowania na intencje wbudowane, może aktywnie wyświetlać widżety na platformach Asystenta takich jak Android czy Android Auto Użytkownicy mogą przypinać widżety wyświetlane przez Asystenta z myślą o przyszłym zaangażowaniu.

Możesz na przykład skonfigurować widżet z podsumowaniem treningów dla swojej aplikacji Ćwiczenia do wykonywania poleceń głosowych użytkownika, które aktywują GET_EXERCISE_OBSERVATION BII. Asystent aktywnie wyświetla Twój widżet, gdy użytkownicy wywołają to BII przez w odpowiedzi na żądania w rodzaju „OK Google, ile kilometrów udało mi się przebiec w tym tygodniu PrzykładowaAplikacja?

Istnieją dziesiątki BII obejmujących kilka kategorii interakcji użytkownika, pozwalając prawie każdej aplikacji na Androida ulepszać swoje widżety głosowe. Na początek Więcej informacji znajdziesz w artykule na temat integrowania akcji w aplikacji z widżetami na Androida.

Usprawnij selektor widżetów aplikacji

Android 12 pozwala ulepszyć selektor widżetów na aplikacji, dodając dynamiczne podglądy widżetów i opisy widżetów.

Dodaj podglądy skalowalnych widżetów do selektora widżetów

Od Androida 12 podgląd widżetu jest wyświetlany w jest skalowalny. Podajesz go jako układ XML ustawiony na rozmiarem domyślnym. Wcześniej podgląd widżetu był statycznym zasobem rysowanym w w niektórych przypadkach mogą one niedokładnie odzwierciedlać sposób wyświetlania widżetów, pojawią się na ekranie głównym.

Aby wdrożyć skalowalne podglądy widżetów, użyj funkcji previewLayout w elemencie appwidget-provider, aby dostarczyć układ XML:

<appwidget-provider
    android:previewLayout="@layout/my_widget_preview">
</appwidget-provider>

Zalecamy użycie tego samego układu co widżet, z realistycznym ustawieniem domyślnym. lub wartości testowych. Większość aplikacji używa tych samych funkcji previewLayout i initialLayout. Dla: wskazówek na temat tworzenia dokładnych układów podglądu, można znaleźć w sekcji poniżej stronę.

Zalecamy określenie w niej zarówno atrybutów previewLayout, jak i previewImage, aby aplikacja mogła ponownie używać previewImage, jeśli urządzenie użytkownika nie obsługuje previewLayout. Atrybut previewLayout ma pierwszeństwo w przypadku atrybutu previewImage.

Zalecane metody tworzenia dokładnych podglądów

Aby wdrożyć skalowalne podglądy widżetów, użyj atrybutu previewLayout funkcji appwidget-provider element udostępniający układ XML:

<appwidget-provider
    ...
    android:previewLayout="@layout/my_widget_preview">
</appwidget-provider>
Obraz przedstawiający podgląd widżetu
. Rysunek 3. Podgląd widżetu, który domyślnie jest wyświetlany w obszarze 3 x 3, ale dzięki układowi XML może się zmieścić w obszarze 3 x 1.

Aby wyświetlić dokładny podgląd, możesz bezpośrednio podać rzeczywisty widżet układ z wartościami domyślnymi, wykonując te czynności:

  • Ustawiam android:text="@string/my_widget_item_fake_1" dla: TextView .

  • Ustawianie domyślnego lub zastępczego obrazu bądź ikony, na przykład android:src="@drawable/my_widget_icon" dla ImageView komponentów.

Bez wartości domyślnych podgląd może wyświetlać nieprawidłowe lub puste wartości. An Ważną zaletą tego podejścia jest możliwość udostępnienia zlokalizowanego podglądu treści.

W przypadku zalecanych metod bardziej złożonych podglądów zawierających atrybuty ListView: GridView lub StackView, przeczytaj Tworzenie dokładnych podglądów zawierających dynamiczne reklamy , aby uzyskać szczegółowe informacje.

Wcześniejsza zgodność ze skalowalnymi podglądami widżetów

Aby selektory widżetów na Androidzie 11 (poziom interfejsu API 30) lub niższym mogły wyświetlać podglądy widżet, określ previewImage .

Jeśli zmienisz wygląd widżetu, zaktualizuj obraz podglądu.

Dodaj opis widżetu

Podawanie opisu widżetu (od Androida 12) który ma być wyświetlany w widżecie.

Obraz przedstawiający selektor widżetów, w tym widżet i jego opis
Rysunek 4. Przykładowy selektor widżetów pokazujący widżet i jego opisie.

Podaj opis widżetu, używając atrybutu description atrybutu Element &lt;appwidget-provider&gt;:

<appwidget-provider
    android:description="@string/my_widget_description">
</appwidget-provider>

Za pomocą descriptionRes w poprzednich wersjach Androida, ale jest ignorowany przez widżet .

Włącz płynniejsze przejścia

Począwszy od Androida 12 programy uruchamiające zapewniają płynniejsze przejście gdy użytkownik uruchamia aplikację z poziomu widżetu.

Aby włączyć to ulepszone przejście, użyj funkcji @android:id/background lub android.R.id.background, aby zidentyfikować element tła:

// Top-level layout of the widget.
<LinearLayout
    android:id="@android:id/background">
</LinearLayout>

Twoja aplikacja może używać pakietu @android:id/background w poprzednich wersjach Androida bez uszkodzenia, ale jest ignorowany.

Używaj modyfikacji czasu działania obiektów RemoteView

Począwszy od Androida 12, dostępne są różne funkcje Metody RemoteViews, które umożliwiają modyfikowanie czasu działania aplikacji RemoteViews . Zobacz interfejs API RemoteViews znajdziesz pełną listę dodanych metod.

Poniższy przykładowy kod pokazuje, jak używać kilku z tych metod.

Kotlin

// Set the colors of a progress bar at runtime.
remoteView.setColorStateList(R.id.progress, "setProgressTintList", createProgressColorStateList())

// Specify exact sizes for margins.
remoteView.setViewLayoutMargin(R.id.text, RemoteViews.MARGIN_END, 8f, TypedValue.COMPLEX_UNIT_DP)

Java

// Set the colors of a progress bar at runtime.
remoteView.setColorStateList(R.id.progress, "setProgressTintList", createProgressColorStateList());

// Specify exact sizes for margins.
remoteView.setViewLayoutMargin(R.id.text, RemoteViews.MARGIN_END, 8f, TypedValue.COMPLEX_UNIT_DP);