שיפור הווידג'ט

הדף הזה כולל פרטים על שיפורים אופציונליים בווידג'טים שזמינים החל מ-Android 12 (רמת API 31). התכונות האלה לא חובה, אבל קל להטמיע ולשפר את נתוני המשתמשים את חוויית השימוש בווידג'ט.

שימוש בצבעים דינמיים

החל מ-Android 12, אפשר להשתמש בווידג'ט בצבעי העיצוב של המכשיר ללחצנים, לרקעים ולרכיבים אחרים. כך אפשר ליהנות ממעברים חלקים יותר ועקביות בין ווידג'טים שונים.

יש שתי דרכים ליצור צבעים דינמיים:

• משתמשים בעיצוב ברירת המחדל של המערכת (@android:style/Theme.DeviceDefault.DayNight) בפריסה ברמה הבסיסית.

• צריך להשתמש בעיצוב Material 3 (Theme.Material3.DynamicColors.DayNight) רכיבי מהותי עבור ב-Android הספרייה זמינה החל מ-Material Materials ל-Android גרסה 1.6.0.

אחרי שהעיצוב מוגדר בפריסה הבסיסית, אפשר להשתמש במאפייני צבע נפוצים את השורש או כל צאצא שלו כדי לבחור את הצבעים הדינמיים.

דוגמאות למאפייני צבע שבהם אפשר להשתמש:

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

בדוגמה הבאה, שבה נעשה שימוש בעיצוב Material 3, צבע העיצוב של המכשיר הוא 'סגול'. צבע המשנה והרקע של הווידג'ט מותאמים לבהיר ולכהה המצבים השונים, כפי שמוצגים בדמויות 1 ו-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>

תאימות לאחור לצבעים דינמיים

צבעים דינמיים זמינים רק במכשירים עם Android 12 ומעלה. כדי להוסיף עיצוב מותאם אישית לגרסאות קודמות, צריך ליצור עיצוב ברירת מחדל עם צבעים מותאמים אישית ועם תוחם חדש (values-v31) תוך שימוש בברירת המחדל מאפייני עיצוב.

הנה דוגמה לשימוש בעיצוב Material 3:

<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>

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

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

הפעלת תמיכה קולית

פעולות באפליקציה מאפשרות ל-Google Assistant הצגת ווידג'טים בתגובה לפקודות קוליות רלוונטיות של המשתמש. אם תגדירו את הווידג'ט להגיב לכוונות מובנות (BIIs), האפליקציה תוכל להציג וידג'טים באופן יזום בממשקי Assistant, כמו Android ו-Android Auto. המשתמשים יכולים להצמיד ל-Assistant ווידג'טים שמוצגים במרכז האפליקציות, כדי לעודד אינטראקציה עתידית.

לדוגמה, אפשר להגדיר את הווידג'ט של סיכום האימון באפליקציית האימון כך שיגיב לפקודות הקוליות של המשתמשים שמפעילות את ה-BII‏ GET_EXERCISE_OBSERVATION. Assistant מציגה את הווידג'ט באופן יזום כשמשתמשים מפעילים את ה-BII הזה על ידי שליחת בקשות כמו "Ok Google, how many miles did I run this week on ExampleApp?‎"

יש עשרות ממשקי BII שמכסים כמה קטגוריות של אינטראקציה עם משתמשים, ומאפשרים לשפר את הווידג'טים של הקול כמעט בכל אפליקציה ל-Android. כדי להתחיל בעבודה, ראו שילוב פעולות באפליקציה עם ווידג'טים של Android

שיפור חוויית השימוש בבורר הווידג'טים של האפליקציה

ב-Android 12 אפשר לשפר את חוויית הבחירה של הווידג'טים באפליקציה על ידי הוספת תצוגות מקדימות של ווידג'טים ותיאורים שלהם.

מוסיפים תצוגות מקדימות של ווידג'טים שניתן לשנות לבורר הווידג'טים

החל מגרסה Android 12, אפשר לשנות את הגודל של התצוגה המקדימה של הווידג'ט שמוצגת בבורר הווידג'טים. אתם מספקים אותו כפריסה של XML שמוגדרת לגודל ברירת המחדל של הווידג'ט. בעבר, התצוגה המקדימה של הווידג'ט הייתה משאב סטטי שניתן להזזה, ובמקרים מסוימים מוביל להצגת תצוגות מקדימות, המשקפות באופן לא מדויק את האופן שבו ווידג'טים מופיעים הם נוספים למסך הבית.

כדי להטמיע תצוגות מקדימות של ווידג'טים שניתן לשנות, משתמשים previewLayout של הרכיב appwidget-provider כדי לספק פריסת XML במקום זאת:

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

מומלץ להשתמש באותה פריסה של הווידג'ט, עם ברירת מחדל מציאותית או לבדוק את הערכים. רוב האפליקציות משתמשות באותם previewLayout ו-initialLayout. בקטע הבא בדף הזה מוסבר איך ליצור פריסות מדויקות של קטעים מקדימים.

מומלץ לציין גם את המאפיין previewLayout וגם את המאפיין previewImage, כך שהאפליקציה תוכל לחזור להשתמש ב-previewImage אם המכשיר של המשתמש לא תומך ב-previewLayout. המאפיין previewLayout מקבל עדיפות מעל המאפיין previewImage.

גישות מומלצות ליצירת תצוגות מקדימות מדויקות

כדי להטמיע תצוגות מקדימות של ווידג'טים שניתן לשנות, צריך להשתמש במאפיין previewLayout הרכיב appwidget-provider כדי לספק פריסת XML:

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

כדי לראות תצוגה מקדימה מדויקת, אפשר לספק את הווידג'ט עצמו ישירות. עם ערכי ברירת מחדל, מבצעים את השלבים הבאים:

• הגדרת android:text="@string/my_widget_item_fake_1" לרכיבים TextView.

• הגדרת תמונה או סמל ברירת מחדל או placeholder, כמו android:src="@drawable/my_widget_icon", לרכיבי ImageView.

ללא ערכי ברירת מחדל, יכול להיות שבתצוגה המקדימה יוצגו ערכים שגויים או ריקים. יתרון חשוב של גישה זו הוא שניתן לספק תצוגה מקדימה מותאמת לשוק המקומי תוכן.

לקבלת פרטים על גישות מומלצות לתצוגות מקדימות מורכבות יותר שמכילות את השדות ListView,‏ GridView או StackView, אפשר לעיין במאמר יצירת תצוגות מקדימות מדויקות שכוללות פריטים דינמיים.

תאימות לאחור עם תצוגות מקדימות של ווידג'טים שניתן לשנות

כדי לאפשר לבוררי ווידג'טים ב-Android 11 (רמת API 30) ומטה להציג תצוגות מקדימות של את הווידג'ט, מציינים את previewImage .

אם משנים את המראה של הווידג'ט, צריך לעדכן את תמונת התצוגה המקדימה.

הוספת תיאור לווידג'ט

החל מ-Android 12, צריך לספק תיאור לווידג'ט שיוצג בבורר הווידג'טים.

נותנים תיאור לווידג'ט באמצעות המאפיין description של הרכיב <appwidget-provider>:

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

אפשר להשתמש descriptionRes בגרסאות קודמות של Android, אבל הווידג'ט מתעלם ממנו בוחר.

הפעלת מעברים חלקים יותר

החל מגרסה 12 של Android, מרכזי האפליקציות מספקים מעבר חלק יותר כשמשתמש מפעיל את האפליקציה שלכם מווידג'ט.

כדי להפעיל את המעבר המשופר הזה, אפשר להשתמש ב-@android:id/background או android.R.id.background כדי לזהות את רכיב הרקע שלך:

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

באפליקציה שלכם אפשר להשתמש ב-@android:id/background בגרסאות קודמות של Android בלי לגרום לשיבושים, אבל המערכת תתעלם ממנו.

שימוש בשינוי של RemoteViews בסביבת זמן הריצה

החל מ-Android 12, אפשר להשתמש בכמה שיטות של RemoteViews שמאפשרות לשנות את המאפיינים של RemoteViews בסביבת זמן הריצה. לעיון בממשק ה-API של RemoteViews לרשימה המלאה של השיטות שנוספו.

בדוגמת הקוד הבאה מוסבר איך להשתמש בכמה מהשיטות האלה.

// 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)

// 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);