חומר שאתה מעצב

החל ב-Android 12, Material You Design מתמקד בביטוי ובנזילות במערכת ההפעלה אנדרואיד, במטרה לעזור למשתמשים ליצור ולהחזיק חוויה אחת ומגובשת הנותנת מענה לצרכיהם. כשותף אנדרואיד, מומלץ לשלב חומר שאתה מעצב במכשירי Android שלך בתחומים הבאים:

  • צבע דינמי
  • תְנוּעָה
  • ווידג'טים

צבע דינמי

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

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

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

כדי לנצל את הצבע הדינמי, השתמש בסיפור חילוץ הצבעים של Android 12 Material You כחלק מרכזי בהיצע התוכנה שלך למשתמשים. במכשיר, השתמש בלוגיקה של חילוץ הצבעים שנמצאת ב-AOSP, במיוחד בלוגיקה שלוקחת צבע מקור של טפט או ערכת נושא בודד ומוציאה אותו באמצעות 65 ממשקי API של צבע. לדרישות צבע דינמי, ראה שימוש בצבע דינמי .

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

חומר אתה זרימת צבע

איור 1. חומר אתה זרימת צבע דינמית

  1. המשתמש משנה את הטפט או הנושא באמצעות בורר ה-OEM.

  2. המשתמש בוחר באחת מהאפשרויות הבאות:

    • ערכת נושא של המכשיר. כאשר נבחר, אנדרואיד בוחרת אוטומטית צבע מקור יחיד העונה על הדרישות.

    • טפט חדש + ערכת נושא. כאשר נבחר, לוגיקה AOSP בוחרת אוטומטית צבע מקור יחיד מהטפט שנבחר.

  3. AOSP מרחיבה את צבע המקור היחיד ל-5 פלטות גוונים עם 13 גרסאות צבע כל אחת, לפי ההיגיון של AOSP, אשר לאחר מכן מאכלסות את 65 תכונות הצבע.

  4. ממשק המשתמש של האפליקציה משתמש ב-65 תכונות הצבע באופן עקבי בכל מערכת האקולוגית של אפליקציית אנדרואיד. מומלץ להשתמש באותה פלטת צבעים עבור ממשק משתמש המערכת של המכשיר ואפליקציות ספציפיות ל-OEM.

תיקוני אנדרואיד 12

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

ציון צבעים מותאמים אישית ב-ThemePicker

אם אתה משתמש באפליקציית AOSP ThemePicker, אפליקציית WallpaperPicker מציגה את קטע הצבע אם שני התנאים הבאים מתקיימים:

  • flag_monet על frameworks/base/packages/SystemUI/res/values/flags.xml true .
  • APK של דף מערכת עם שם החבילה מוגדר ב- themes_stub_package packages/apps/ThemePicker/res/values/override.xml .

פורמט Stub APK

ניתן למצוא גרסה לדוגמה של APK זה packages/apps/ThemePicker/themes .

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

הסטאב צריך להכיל קובץ XML תחת res/xml בפורמט הבא:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <array name="color_bundles">
        <item>color1</item>
        <item>color2</item>
        <item>color3</item>
        <item>color4</item>
    </array>

    <string name="bundle_name_color1">Blue</string>
    <string name="bundle_name_color2">Red</string>
    <string name="bundle_name_color3">Yellow</string>
    <string name="bundle_name_color4">Green</string>

</resources>

בקובץ זה, לכל item בתוך color_bundles יש שם מובחן, כל עוד המחרוזות למטה נקראות bundle_name_ item .

צריכה להיות מחרוזת bundle_name_ item לכל צבע, עם שם תיאורי לכל צבע. ניתן לתרגם אותם על ידי הוספת המחרוזות המתורגמות המתאימות לתוך ספריות res/values- language code .

ערכי הצבע בפועל יכולים להיות על אותו XML או על קובץ XML של משאבים נפרד בפורמט הבא:

<resources>
    <color name="color_primary_color1">#0000FF</color>
    <color name="color_secondary_color1">#0000FF</color>

    <color name="color_primary_color2">#ff0000</color>
    <color name="color_secondary_color2">#ff0000</color>

    <color name="color_primary_color3">#ffff00</color>
    <color name="color_secondary_color3">#ffff00</color>

    <color name="color_primary_color4">#00ff00</color>
    <color name="color_secondary_color4">#00ff00</color>
</resources>

עבור כל פריט במערך חבילות הצבעים, צריך להיות color_primary_ item וערך_ color_secondary_ item (ושני הצבעים צריכים להיות באותו צבע). הערכים עבור ערכי color אלה הם קודי הצבע בפועל עבור כל צבע שיוצגו בסעיף הצבע הבסיסי .

שלב 1: בנה חוויית עיצוב לנושא משתמש

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

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

שלב 2: חלץ צבע טפט לצבע מקור

כדי לאפשר מיצוי צבעי טפטים, בחר את התיקונים של Android 12 המפורטים למעלה (פונקציונליות זו תופעל כברירת מחדל במהדורה עתידית של AOSP). ההיגיון של AOSP שמפעיל חילוץ טפטים מתחיל ב- frameworks/base/packages/SystemUI/src/com/android/systemui/theme/ThemeOverlayController.java , ב- ThemeOverlayController#mOnColorsChangedListener , דרך WallpaperManager#onWallpaperColorsChanged . אנו ממליצים להשתמש בלוגיקת AOSP ללא שינוי כדי להבטיח חווית פיתוח עקבית.

כברירת מחדל, ההיגיון בוחר את צבע התדר הגבוה ביותר המתאים לשימוש. כדי לנצל את היתרונות של צבעי מקור אחרים המוחזרים על ידי האלגוריתם ולהציג את הצבעים הללו למשתמשים בבוחר ערכות הנושא, השתמש ב- ColorScheme#getSeedColors(wallpaperColors: WallpaperColors) .

כדי להיות מתאים לשימוש, צבע מקור (בין אם מופק מטפט או הגדרה מראש שנבחרה על ידי המשתמש) חייב להיות בעל ערך כרומה מינימלי של CAM16 של 5; זה מבטיח שצבע המקור לא יושפע מגוונים כהים עדינים כאשר הוא מומר מצבע בודד ל-65 צבעים גוונים ונשאר מייצג את בחירת המשתמש. כדי לקרוא ולשנות צבעים ב-CAM16, השתמש Cam#fromInt או Cam#getInt .

שימוש בפלטת צבעים לא דינמית עבור מכשירים שאינם תומכים בחילוץ צבעי טפט, עדיין תוכל להבטיח שאפליקציות Google ואפליקציות צד שלישי התומכות בצבע דינמי נראים נהדר על ידי ביצוע הפעולות הבאות:

  • השתמש בפלטת החומרים המוגדרת כברירת מחדל על ידי השבתת flag_monet ב- frameworks/base/packages/SystemUI/res/values/flags.xml .
  • ודא שמשתמשים עדיין יכולים להתאים אישית את מערכת ההפעלה שלהם באמצעות בוחר ערכות נושא מוגדר מראש.

שלב 3: הרחב את צבע המקור לתוך ממשקי API של צבע

באמצעות צבע המקור היחיד שנגזר מהשלב הקודם, אנדרואיד מייצרת 5 פלטות טונאליות ייחודיות (מבטא 1-3, ניטרלי 1-2), כל פלטה כוללת 13 צבעים, וכל צבע כולל ערכי זוהר שונים (0 עד 1000), עבור סך הכל 65 צבעים. ההיגיון המסופק בתיקוני אנדרואיד 12 מיישם את הרחבת הצבע הזו בצורה נכונה; הפרטים המופיעים להלן מתארים את היישום.

למען עקביות של מפתחים, 5 לוחות הצבעים (accent1, accent2, accent3, neutral1, neutral2) ו-13 הצבעים המתאימים להם חייבים להיות מבוססים על צבע המקור היחיד עם השינויים המתאימים לערכי הכרומה והגוון של CAM16 כפי שנכתב להלן:

  • system_accent1

    • Chroma: השתמש ב-"40" עבור גרסאות צבעים המסתיימות ב -0 , 10 , 50 ו -100 , אחרת "48"
    • גוון: זהה למקור
  • system_accent2

    • Chroma: השתמש ב-"16"
    • גוון: זהה למקור
  • system_accent3

    • Chroma: השתמש ב-"32"
    • גוון: סובב ב-60 מעלות חיובי
  • system_neutral1

    • Chroma: השתמש ב-"4"
    • גוון: זהה למקור
  • system_neutral2

    • Chroma: השתמש ב-"8"
    • גוון: זהה למקור

CTS כולל בדיקות לאימות קריאות ה-API של זוהר וגוון. כדי להפעיל, השתמש ב- atest SystemPalette .

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

לאחר הגדרת צבעים דינמיים במכשיר, יישומים פועלים לפי הנחיות החומר כדי להשתמש בצבעים. הנחיות חומר אמורות לצאת ב- material.io עד ה-26 באוקטובר 2021 כדי לאמץ אפליקציות של צד שלישי. עבור ממשק המשתמש של המערכת ויישומי צד ראשון, אנו ממליצים בחום לשלב צבעים דינמיים לאורך חווית המשתמש באופן שמתאים לחומרה ולמותג שלך ועוזר לך לבדל את המכשירים שלך.

להנחיית צבע דינמית כללית, ראה את הדברים הבאים:

  • השתמש בצבעי הדגשה עבור רכיבי חזית באפליקציות ובממשק המשתמש של המערכת:

    @android:color/system_accent1_0 … 1000 // most-used foreground color group
    @android:color/system_accent2_0 … 1000 // alternate accent, used for surfaces
    @android:color/system_accent3_0 … 1000 // playful, analogous color
    
  • השתמש בצבעים ניטרליים עבור רכיבי רקע באפליקציות ובממשק המשתמש:

    @android:color/system_neutral1_0 … 1000 // most-used background color group
    @android:color/system_neutral2_0 … 1000 // used for higher-elevation surfaces
    

למידע נוסף על האופן שבו Material You ממפה צבעים וכיצד משתמשים בממשקי API ב- SysUI, ראה משאבים נוספים .

שלב 5: הוסף אפשרויות צבע דינמיות ביישום AOSP WallpaperPicker שלך

בנה עבור אנדרואיד 13 ומעלה

החל מ-Android 13, android.theme.customization.accent_color הוצא משימוש. תכונה חדשה android.theme.customization.theme_style מתווספת כדי לתמוך בגרסאות צבע שונות. כרגע יש לנו ארבע גרסאות בבסיס הקוד כדלקמן:

TONAL_SPOT = Default Material You theme since Android S.
VIBRANT = Theme where accent 2 and 3 are analogous to accent 1.
EXPRESSIVE = Highly chromatic theme.
SPRITZ = Desaturated theme, almost grayscale.

אלה נשלחים אל Settings.Secure.THEME_CUSTOMIZATION_OVERLAY_PACKAGES , כפי שמוצג ב-JSON למטה:

{
    "android.theme.customization.system_palette":"B1611C",
    "android.theme.customization.theme_style":"EXPRESSIVE"
}

בנה עבור אנדרואיד 12 ומטה

בעת שימוש בבוחר ערכות נושא מותאם אישית, המכשיר חייב לשלוח צבע מקור חוקי אל Settings.Secure.THEME_CUSTOMIZATION_OVERLAY_PACKAGES על ידי אספקת קובץ JSON בפורמט הבא (כאשר 746BC1 הוא צבע מקור חוקי לדוגמה):

{
      "android.theme.customization.system_palette":"746BC1",
      "android.theme.customization.accent_color":"746BC1"
}

פעולה זו מדלגת על מיצוי צבעי הטפט (שלב 2) ומרחיבה ישירות את צבע המקור המסופק ל-65 תכונות צבע (שלב 3).

שלב 6: הגש כרטיס

מלבד שילוב המערכת, עליך להגיש כרטיס ולהודיע ​​לנו על שם המותג שלך ( Build.MANUFACTURER ). מכיוון שרוב האפליקציות של צד שלישי משתמשות ברכיבי החומרים עבור אנדרואיד כדי להציג צבעים דינמיים, אנו משתמשים ברשימת הרשאות מקודדת קשה כדי לדעת אילו מכשירים שילבו את תכונת פלטות גווני הצבע הדינמיות .

תְנוּעָה

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

שימוש ב-overscroll במערכת ההפעלה שלך

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

חומר שאתה מגולל יתר על המידה

איור 2. אפקט גלילה יתר של Android 12, כפי שמוצג בהגדרות

למען עקביות של מפתחים, ודא שהאפקט הכולל של גלילה על המכשירים שלך דומה לאפקט הבא:

  • במכשירים שמחזירים true עבור ActivityManager.isHighEndGfx() , אפקט הגלילה הוא מתיחה לא ליניארית של המסך (כפי שמוצג לעיל).

  • במכשירים בעלי ביצועים נמוכים יותר, אפקט המתיחה מפושט למתיחה ליניארית (כדי להפחית עומס על המערכת).

שימוש בגלילת יתר באפליקציות צד ראשון

בעת שימוש בתצוגות מותאמות אישית, ייתכן שיהיה עליך לצבוט כמה אפליקציות וממשק המשתמש של המערכת המשתמשות באפקט המתיחה.

  • כדי לתמוך ב-stretch overscroll, שדרג לספריות העדכניות ביותר:

    • androidx.recyclerview:recyclerview:1.3.0-alpha01 עבור RecyclerView
    • androidx.core:core:1.7.0-alpha01 עבור NestedScrollView ו- EdgeEffectCompat
    • androidx.viewpager:viewpager:1.1-alpha01 עבור ViewPager
  • עבור פריסות מותאמות אישית המשתמשות EdgeEffect , שקול את השינויים הבאים ב-UX:

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

    • כאשר משתמשים נוגעים בתוכן בזמן שהאנימציה EdgeEffect מתרחשת, הם צריכים לתפוס את האנימציה ולאפשר להם לתפעל את המתיחה. ערך המשיכה הנוכחי זמין מ- EdgeEffectCompat.getDistance() .

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

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

לפרטים על גלילה יתרה, ראה הנפשת תנועת גלילה .

שימוש באדווה (משוב מגע) במערכת ההפעלה שלך

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

חומר אתה אדוות

איור 3. אפקט אדוות אנדרואיד 12, עם אנימציית מילוי רכה יותר

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

ווידג'טים

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

משאבים נוספים

שימוש בצבע SysUI

(accent1 = A1, accent2 = A2, accent3 = A3, neutral1 = N1, neutral2 = N2)

חומר שאתה משתמש בצבע

איור 4. שימוש בצבע דינמי בממשק המשתמש של המערכת

עדכוני צבע של ספריית חומרים

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

תפקיד צבע תכונת עיצוב אנדרואיד נושא קל
צבע דינמי
ערכת נושא כהה
צבע דינמי
יְסוֹדִי colorPrimary system_accent1_600 system_accent1_200
על ראשוני colorOnPrimary system_accent1_0 system_accent1_800
מִשׁנִי colorSecondary system_accent2_600 system_accent2_200
על משני colorOnSecondary system_accent2_0 system_accent2_800
שְׁגִיאָה colorError לא זמין (red_600) לא רלוונטי (אדום_200)
על שגיאה colorOnError לא רלוונטי (לבן) לא זמין (red_900)
רקע כללי אנדרואיד: צבע רקע system_neutral1_10 system_neutral1_900
על רקע צבע על רקע system_neutral1_900 system_neutral1_100
משטח colorSurface system_neutral1_10 system_neutral1_900
על פני השטח colorOnSurface system_neutral1_900 system_neutral1_100

החומר יעדכן את תכונות המצבים שלו עם הנקודות הבאות:

תפקיד צבע תכונת עיצוב אנדרואיד נושא קל
צבע דינמי
ערכת נושא כהה
צבע דינמי
תוכן מצב ראשי colorPrimaryStateContent system_accent1_700 system_accent1_200
שכבת המדינה העיקרית colorPrimaryStateLayer system_accent1_600 system_accent1_300
תוכן מצב משני colorSecondaryStateContent system_accent2_700 system_accent2_200
שכבת המדינה המשנית colorSecondaryStateLayer system_accent2_600 system_accent2_300
על תוכן מצב ראשי colorOnPrimaryStateContent system_accent1_0 system_accent1_800
על שכבת המדינה הראשונית colorOnPrimaryStateLayer system_accent1_900 system_accent1_800
על תוכן מצב משני colorOnSecondaryStateContent system_accent2_0 system_accent2_800
על שכבת המדינה המשנית colorOnSecondaryStateLayer system_accent2_900 system_accent2_800
על תוכן מצב מיכל ראשי colorOnPrimaryContainerStateContent system_accent1_900 system_accent1_900
על שכבת מצב מיכל ראשי colorOnPrimaryContainerStateLayer system_accent1_900 system_accent1_900
על תוכן מצב מיכל משני colorOnSecondaryContainerStateContent system_accent2_900 system_accent2_900
על שכבת מצב מיכל משנית colorOnSecondaryContainerStateLayer system_accent2_900 system_accent2_900
על תוכן מצב מיכל שלישוני colorOnTertiaryContainerStateContent system_accent3_900 system_accent3_900
על שכבת מצב מיכל שלישוני colorOnTertiaryContainerStateLayer system_accent3_900 system_accent3_900
על תוכן מצב שטח colorOnSurfaceStateContent system_neutral1_900 system_neutral1_100
על שכבת מצב שטח colorOnSurfaceStateLayer system_neutral1_900 system_neutral1_100
תוכן מצב וריאציות על פני השטח colorOnSurfaceVariantStateContent system_neutral2_700 system_neutral2_200
על שכבת מצב וריאציה של פני השטח colorOnSurfaceVariantStateLayer system_neutral2_700 system_neutral2_200
תוכן מצב שגיאה colorErrorStateContent אדום800 אדום200

שאלות נפוצות

מיצוי צבע

ברגע שמשתמש משנה טפט, האם חילוץ הצבע מתבצע באופן אוטומטי או שצריך להפעיל אותו מאיפשהו?

עם תיקוני אנדרואיד 12 , חילוץ צבע הטפט מופעל כברירת מחדל .

ThemeOverlayController.java מפעיל את ההיגיון עם ThemeOverlayController#mOnColorsChangedListener ו- WallpaperManager#onWallpaperColorsChanged .

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

מיצוי הצבע מופעלת כאשר המשתמש מגדיר את הטפט או לאחר מחזור הפעלה של המסך (בתגובה ל- WallpaperEngine#notifyColorsChanged ). אירוע WallpaperColors האחרון (מהטפט החי) מוחל לאחר שהמשתמש מכבה את המסך ומפעיל אותו שוב.

בוחר נושאים/טפטים

כיצד אוכל לאפשר לבוחר ערכות הנושא להציג מספר צבעי מקור לבחירת המשתמשים מאשר צבע התדר הגבוה ביותר? האם יש דרך להשיג את הצבעים האלה מהיגיון החילוץ?

כן. בבוחר הנושא שלך, אתה יכול להשתמש ColorScheme#getSeedColors(wallpaperColors: WallpaperColors) .

יש תכונה בשמות פיקסל כסמל נושא . האם זה כלול בשלושת התיקונים ששיתפת? כיצד יצרני OEM יכולים ליישם זאת?

לא. סמלים עם נושא הם בגרסת ביטא ואינם זמינים ב-Android 12.

האם יש דרך להשתמש באפליקציית טפט של Google עם הפעלת תכונות חילוץ ובחירה של צבעים?

כן. ניתן ליישם את התכונות בגרסה העדכנית ביותר של אפליקציית טפט של Google על ידי ביצוע שלבי האינטגרציה שתוארו קודם לכן בדף זה.

פנה אל TAM שלך לקבלת פרטים נוספים.

האם Google יכולה לשתף את האפליקציה או את קוד המקור כדי שיצרני OEM יוכלו ליישם גרסה משלהם של תצוגה מקדימה של צבע דינמי בתפריט ההגדרות שלהם, שנראה דומה לקטע התצוגה המקדימה המוצג באפליקציית בורר הטפטים של גוגל?

המחלקות העיקריות המציגות את התצוגה המקדימה הן WallpaperPicker2 ו- Launcher3 .

מסך התצוגה המקדימה של הטפט הוא WallpaperSectionController .

כיצד ליישם את התצוגה המקדימה לאחר שינוי הצבע, כפי שמוצג באפליקציית Google Wallpaper?

אפליקציית בורר הטפטים מצפה ש- ContentProvider יהיה זמין מ-Launcher (משגר מבוסס Launcher3 יש את זה). התצוגה המקדימה מסופקת על ידי GridCustomizationsProvider ב-Launcher, שאליה יש להפנות במטא-נתונים של הפעילות הראשית של Launcher כדי שאפליקציית הטפט והסגנון תקרא אותה. כל זה מיושם ב-Launcher3 של AOSP וזמין ליצרני ה-OEM.