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

כדאי לנסות את הדרך של Compose

‫Jetpack Compose היא ערכת הכלים המומלצת לבניית ממשק משתמש ל-Android. איך יוצרים ווידג'טים באמצעות ממשקי API בסגנון Compose

Jetpack Glance →

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

במדריך בנושא Compose יש עוד דרכים לשפר את הווידג'ט. אפשר לעיין במאמר שיפור הווידג'ט.

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

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

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

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

• אפשר להשתמש בערכת הנושא Material 3‏ (Theme.Material3.DynamicColors.DayNight) מהספרייה Material Components for Android, שזמינה החל מ-Material Components for Android v1.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
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:tint="?attr/colorPrimaryContainer"
        android:src="@drawable/ic_cloud" />

    <!-- Other widget content. -->

</LinearLayout>
dynamic_colors.xml

איור 1. ווידג'ט בעיצוב בהיר.

איור 2. ווידג'ט בעיצוב כהה.

טיפ: מומלץ להשתמש בערכת הנושא Material 3 כדי לפעול בהתאם להנחיות של Material Design לשמירה על עקביות בין מכשירים ותאימות לאחור.

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

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

דוגמה לשימוש בעיצוב 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>
styles.xml

/values-v31/styles.xml

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

/layout/my_widget_layout.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="?android:attr/colorBackground"
    android:theme="@style/MyWidgetTheme" />
my_widget_layout.xml

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

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

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

לדוגמה, אפשר להגדיר את הווידג'ט של סיכום האימון באפליקציית הכושר כדי שיבצע את הפקודות הקוליות של המשתמש שמפעילות את GET_EXERCISE_OBSERVATION BII. ‫Assistant מציג באופן יזום את הווידג'ט כשמשתמשים מפעילים את ה-BII הזה על ידי שליחת בקשות כמו "Ok Google, כמה מיילים רצתי השבוע ב-ExampleApp?"

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

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

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

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

<!-- Top-level layout of the widget. -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/background"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
</LinearLayout>
smooth_transitions.xml

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

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

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

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

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

// 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_DIP
)
Enhance.kt