การออกแบบ Material You

ตั้งแต่ Android 12 เป็นต้นมา ดีไซน์ Material You มุ่งเน้นที่ การแสดงออกและความลื่นไหลในระบบปฏิบัติการ Android โดยมีเป้าหมายเพื่อช่วยให้ผู้ใช้สร้าง และเป็นเจ้าของประสบการณ์ที่สอดคล้องกันเพียงหนึ่งเดียวซึ่งปรับให้เหมาะกับความต้องการของผู้ใช้ ในฐานะพาร์ทเนอร์ของ Android เราขอแนะนำให้คุณรวมการออกแบบ Material You ไว้ในอุปกรณ์ Android ในส่วนต่อไปนี้

• สีแบบเปลี่ยนอัตโนมัติ
• การเคลื่อนไหว
• วิดเจ็ต

สีแบบเปลี่ยนอัตโนมัติ

สีแบบไดนามิกเป็นหัวใจสำคัญของการออกแบบ Material You และเป็นส่วนสำคัญของกลยุทธ์หลายปีของ Android ในการนำการปรับแต่งที่ง่ายและลึกซึ้งยิ่งขึ้นมาสู่ผู้ใช้ในแบบที่อุปกรณ์อื่นๆ ไม่ได้ทำ Material You มีข้อดีดังนี้

• ผู้ใช้และนักพัฒนาแอปจะได้รับประสบการณ์การปรับเปลี่ยนในแบบของคุณที่สอดคล้องและสมบูรณ์ใน อุปกรณ์ Android ทุกเครื่อง

• โอกาสสำหรับ OEM ของ Android ในการพัฒนานวัตกรรม UI ของระบบและแอปของบุคคลที่หนึ่งต่อไปในลักษณะที่สอดคล้องกับฮาร์ดแวร์ สีของแบรนด์ รุ่น และรูปแบบ

หากต้องการใช้ประโยชน์จากสีแบบไดนามิก ให้ใช้การดึงสี Material You ของ Android 12 เป็นส่วนสำคัญของข้อเสนอซอฟต์แวร์แก่ผู้ใช้ ในอุปกรณ์ ให้ใช้ตรรกะการดึงสีที่อยู่ใน AOSP โดยเฉพาะตรรกะที่รับสีต้นฉบับของวอลเปเปอร์หรือธีมเดียวและแสดงผลผ่าน API สี 65 รายการ ดูข้อกำหนดเกี่ยวกับสีแบบเปลี่ยนอัตโนมัติได้ที่การใช้สีแบบเปลี่ยนอัตโนมัติ

ขั้นตอนการใช้สีแบบไดนามิกทั้งหมดมี 4 ขั้นตอน ดังที่แสดงด้านล่าง

รูปที่ 1 ขั้นตอนการทำงานของสีแบบไดนามิกของ Material You

1. ผู้ใช้เปลี่ยนวอลเปเปอร์หรือธีมผ่านตัวเลือก OEM

2. ผู้ใช้เลือกตัวเลือกใดตัวเลือกหนึ่งต่อไปนี้

   • ธีมของอุปกรณ์ เมื่อเลือกแล้ว Android จะเลือกสีต้นทางเดียวที่ตรงตามข้อกำหนดโดยอัตโนมัติ

   • วอลเปเปอร์ + ธีมใหม่ เมื่อเลือกแล้ว ตรรกะของ AOSP จะเลือกสีต้นทางเดียวจากวอลเปเปอร์ที่เลือกโดยอัตโนมัติ

3. AOSP จะขยายสีแหล่งเดียวเป็นชุดสี 5 ชุด โดยแต่ละชุดมีสีโทน ย่อย 13 สี ตามตรรกะของ AOSP จากนั้นจะป้อนข้อมูลแอตทริบิวต์สี 65 รายการ

4. UI ของแอปใช้แอตทริบิวต์สี 65 รายการในลักษณะที่สอดคล้องกันทั่วทั้ง ระบบนิเวศของแอป Android เราขอแนะนำให้คุณใช้ชุดสีเดียวกัน สำหรับ UI ของระบบอุปกรณ์และแอปเฉพาะของ OEM

แพตช์ Android 12

หากต้องการรับตรรกะตั้งแต่ต้นจนจบสำหรับการดึงสีวอลเปเปอร์และเปิดใช้อุปกรณ์เพื่อเติม API 65 สีในลักษณะที่สอดคล้องกับระบบนิเวศ ให้รวมแพตช์ต่อไปนี้ในการติดตั้งใช้งาน Android 12

• บังคับ

  • เพิ่ม Monet ลงใน AOSP
  • ปรับฟิลเตอร์โครมา/L* สำหรับสีเริ่มต้น
  • ใช้โครมาสูงสุด 40 ที่โทน 90

• ขอแนะนำ

  • แก้ไขภาวะแข่งขันเมื่อตั้งค่าพร็อพเพอร์ตี้ของระบบสีการบูต
  • อนุญาตให้โอเวอร์เลย์รับการแจ้งเตือนเกี่ยวกับการเปลี่ยนแปลงธีม
  • แก้ไขภาวะแข่งขันเมื่อตั้งค่าพร็อพเพอร์ตี้ของระบบสีการบูต (รอบที่ 2)
  • ย้าย FeatureFlags ไปยังแพ็กเกจ Flags
  • ติดตั้งใช้งานการรองรับธีมสำหรับผู้ใช้หลายคนหนึ่งเครื่องอย่างถูกต้อง
  • แก้ไขตัวเลือกสีวอลเปเปอร์ที่ระบุหายไปหลังการรีบูต
  • แก้ไขข้อผิดพลาดในการคำนวณสีขั้นที่ 3
  • ไม่อนุญาตให้แอปในพื้นหลังเปลี่ยนธีม

การระบุสีแบบกำหนดเองใน ThemePicker

หากคุณใช้แอป ThemePicker ของ AOSP แอป WallpaperPicker จะแสดงส่วนสีเมื่อตรงตามเงื่อนไขต่อไปนี้ทั้ง 2 ข้อ

• flag_monet ในวันที่ frameworks/base/packages/SystemUI/res/values/flags.xml คือ true
• APK Stub ของระบบที่มีชื่อแพ็กเกจจะกำหนดไว้ใน themes_stub_package ในไฟล์ packages/apps/ThemePicker/res/values/override.xml

รูปแบบ APK สตับ

คุณดูตัวอย่าง APK นี้ได้ใน packages/apps/ThemePicker/themes

APK นี้ควรมีเฉพาะทรัพยากรที่แสดงรายละเอียดสีพื้นฐาน ที่มีและชื่อของสีเหล่านั้น

โดย Stub ควรมีไฟล์ 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 (และทั้ง 2 สีควรเป็นสีเดียวกัน) ค่าสำหรับ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 และแอปของบุคคลที่สามที่รองรับสีแบบไดนามิกดู ดีได้โดยทำดังนี้

• ใช้จานสี Material เริ่มต้นโดยปิดใช้ flag_monet ใน frameworks/base/packages/SystemUI/res/values/flags.xml
• ตรวจสอบว่าผู้ใช้ยังคงปรับแต่งระบบปฏิบัติการได้โดยใช้เครื่องมือเลือกธีมที่กำหนดไว้ล่วงหน้า

ขั้นตอนที่ 3: ขยายสีต้นทางเป็น API สี

Android จะสร้างชุดสี 5 โทนที่ไม่ซ้ำกัน (สีเน้น 1-3, สีกลาง 1-2) โดยใช้สีแหล่งที่มาเดียวที่ได้จากขั้นตอนก่อนหน้า ซึ่งแต่ละชุดสีจะมี 13 สี และแต่ละสีจะมีค่าความส่องสว่างที่แตกต่างกัน (0 ถึง 1000) รวมเป็น 65 สี ตรรกะที่ระบุในแพตช์ Android 12 จะใช้การขยายสีนี้อย่างถูกต้อง โดย รายละเอียดที่ระบุไว้ด้านล่างจะอธิบายการใช้งาน

เพื่อความสอดคล้องกันของนักพัฒนาซอฟต์แวร์ ชุดสีโทน 5 ชุด (accent1, accent2, accent3, neutral1, neutral2) และสีที่เกี่ยวข้อง 13 สีต้องอิงตาม สีต้นฉบับเดียวที่มีการเปลี่ยนแปลงค่า CAM16 โครมาและฮิว ตามที่เขียนไว้ด้านล่าง

• system_accent1

  • โครมา: ใช้ "40" สำหรับสีที่ลงท้ายด้วย 0, 10, 50, และ 100 หรือใช้ "48"
  • ฮิว: เหมือนกับแหล่งที่มา

• system_accent2

  • Chroma: ใช้ "16"
  • ฮิว: เหมือนกับแหล่งที่มา

• system_accent3

  • Chroma: ใช้ "32"
  • Hue: rotate by 60 degrees positive

• system_neutral1

  • Chroma: ใช้ "4"
  • ฮิว: เหมือนกับแหล่งที่มา

• system_neutral2

  • Chroma: ใช้ "8"
  • ฮิว: เหมือนกับแหล่งที่มา

CTS มีการทดสอบเพื่อตรวจสอบการเรียก API สำหรับความสว่างและเฉดสี หากต้องการเรียกใช้ ให้ใช้ atest SystemPalette

ขั้นตอนที่ 4: ใช้สีแบบไดนามิกในแอปและ UI ของระบบ

หลังจากตั้งค่าสีแบบไดนามิกในอุปกรณ์แล้ว แอปจะทำตามหลักเกณฑ์ของ Material เพื่อ ใช้สี เราจะเผยแพร่หลักเกณฑ์เกี่ยวกับ Material ที่ material.io ภายในวันที่ 26 ตุลาคม 2021 เพื่อให้แอปของบุคคลที่สามนำไปใช้ สำหรับ UI ของระบบและแอปของบุคคลที่หนึ่ง เราขอแนะนำอย่างยิ่ง ให้ผสานรวมสีแบบไดนามิกตลอดประสบการณ์ของผู้ใช้ในลักษณะ ที่สอดคล้องกับฮาร์ดแวร์และแบรนด์ของคุณ รวมถึงช่วยให้คุณสร้างความแตกต่าง ให้กับอุปกรณ์ได้

ดูคำแนะนำทั่วไปเกี่ยวกับสีแบบไดนามิกได้ที่

• ใช้สีเฉพาะจุดสำหรับองค์ประกอบพื้นหน้าในแอปและ UI ของระบบ

  @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
  

• ใช้สีกลางสำหรับองค์ประกอบพื้นหลังในแอปและ UI ของระบบ

  @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: เพิ่มตัวเลือกสีแบบไดนามิกลงในการติดตั้งใช้งาน WallpaperPicker ของ AOSP

สร้างสำหรับ Android 13 ขึ้นไป

ตั้งแต่ Android 13 เป็นต้นไป android.theme.customization.accent_color จะเลิกใช้งาน เพิ่มแอตทริบิวต์ใหม่ android.theme.customization.theme_style เพื่อรองรับสินค้าย่อยที่มีสีแตกต่างกัน ปัจจุบันเรามีตัวแปร 4 รายการในโค้ดเบส ดังนี้

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

สร้างสำหรับ Android 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) ให้เราทราบ เนื่องจากแอปของบุคคลที่สามส่วนใหญ่ใช้ Material Components สำหรับ Android เพื่อแสดงสีแบบไดนามิก เราจึงใช้รายการที่อนุญาตที่ฮาร์ดโค้ดเพื่อระบุว่าอุปกรณ์ใดที่ผสานรวมฟีเจอร์ชุดสีโทนสีแบบไดนามิก

การเคลื่อนไหว

การเคลื่อนไหวที่ลื่นไหลช่วยให้อุปกรณ์ดูทันสมัยและพรีเมียม การเลื่อนเกินขอบเขตและเอฟเฟกต์ระลอกเป็น 2 ส่วนสำคัญของการเคลื่อนไหวที่ลื่นไหลซึ่งต้องดูและรู้สึกสอดคล้องกันเพื่อสร้างและรักษาความไว้วางใจและความพึงพอใจของนักพัฒนาแอป

การใช้การเลื่อนเกินในระบบปฏิบัติการ

Android 12 มีการเลื่อนเกินขอบที่ตอบสนองและเป็นไดนามิกมากขึ้นในรูปแบบของการยืดมุมมอง ซึ่งจะแสดงเมื่อผู้ใช้พยายามเลื่อนผ่านขอบของรายการ ตัวอย่างแสดงอยู่ด้านล่าง

รูปที่ 2 เอฟเฟกต์การเลื่อนเกินใน Android 12 ดังที่แสดงในการตั้งค่า

โปรดตรวจสอบว่าเอฟเฟกต์การเลื่อนเกินโดยรวมในอุปกรณ์ของคุณคล้ายกับต่อไปนี้ เพื่อให้การทำงานของนักพัฒนาแอปมีความสอดคล้องกัน

• ในอุปกรณ์ที่แสดงค่าเป็นจริงสำหรับ ActivityManager.isHighEndGfx() เอฟเฟกต์การเลื่อนเกินจะเป็นการยืดหน้าจอแบบไม่เชิงเส้น (ดังที่แสดงด้านบน)

• ในอุปกรณ์ที่มีประสิทธิภาพต่ำกว่า ระบบจะลดความซับซ้อนของเอฟเฟกต์การยืดให้เป็นการยืดเชิงเส้น (เพื่อลดภาระงานในระบบ)

การใช้การเลื่อนเกินขอบเขตในแอปของบุคคลที่หนึ่ง

เมื่อใช้มุมมองที่กำหนดเอง คุณอาจต้องปรับแต่งแอปและ UI ของระบบบางอย่างที่ ใช้เอฟเฟกต์การยืด

• หากต้องการรองรับการเลื่อนเกินขอบเขตแบบยืด โปรดอัปเกรดเป็นไลบรารีเวอร์ชันล่าสุด

  • 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() ซึ่งช่วยให้นักพัฒนาแอปเปลี่ยนจาก การยืดไปยังการเลื่อนได้อย่างราบรื่นเมื่อนิ้วยืดเนื้อหาผ่าน ตำแหน่งเริ่มต้น

  • เมื่อใช้การเลื่อนที่ซ้อนกัน หากเนื้อหาถูกยืด การยืดควรใช้การเคลื่อนไหวจากการสัมผัสก่อนเนื้อหาที่ซ้อนกัน ไม่เช่นนั้นการซ้อนอาจเลื่อนเมื่อนิ้วเปลี่ยนทิศทางแทนที่จะปล่อยการยืด

ดูรายละเอียดเกี่ยวกับการเลื่อนเกินได้ที่สร้างภาพเคลื่อนไหวให้ท่าทางสัมผัสการเลื่อน

การใช้การกระเพื่อม (การตอบสนองต่อการสัมผัส) ในระบบปฏิบัติการ

Android 12 มีการกระเพื่อมเมื่อสัมผัสที่นุ่มนวลและละเอียดอ่อนมากขึ้น เพื่อแสดงความคิดเห็นให้ผู้ใช้ทราบเมื่อแตะลง

รูปที่ 3 เอฟเฟกต์ระลอกคลื่นของ Android 12 พร้อมภาพเคลื่อนไหวการเติมที่นุ่มนวลขึ้น

โปรดตรวจสอบว่าเอฟเฟกต์ระลอกบนอุปกรณ์ของคุณคล้ายกับตัวอย่างที่แสดงด้านบน เพื่อให้ผู้พัฒนาคาดการณ์ได้และมอบประสบการณ์การใช้งานที่ยอดเยี่ยมแก่ผู้ใช้ แม้ว่าคุณจะไม่จำเป็นต้องทำตามขั้นตอนการผสานรวมที่เฉพาะเจาะจงเพื่อรองรับเอฟเฟกต์ระลอกคลื่น แต่คุณควรทดสอบเอฟเฟกต์ในอุปกรณ์เพื่อตรวจสอบการถดถอยที่ไม่พึงประสงค์ ซึ่งอาจเกิดขึ้นในการใช้งาน

วิดเจ็ต

วิดเจ็ตเป็นองค์ประกอบสำคัญของอุปกรณ์ Android Android 12 มาพร้อม API ใหม่และความสามารถของ API ที่ OEM ทุกรายควรสนับสนุน

• ในระบบปฏิบัติการ ให้รองรับ API สำหรับนักพัฒนาแอปที่เกี่ยวข้องกับเลย์เอาต์ ขนาด และ พารามิเตอร์ซอฟต์แวร์ของวิดเจ็ต (เช่น ขนาดมุมโค้ง) การติดตั้งใช้งานของคุณ ควรสนับสนุนวิดเจ็ตอย่างถูกต้องในการระบุพารามิเตอร์ผ่าน API และในการ ตรวจสอบว่าผู้ใช้ปรับขนาดและกำหนดค่าวิดเจ็ตได้

• ในแอปของคุณ ให้ใช้ประโยชน์จากความสามารถของ API ใหม่เพื่ออัปเดตหรือสร้างวิดเจ็ตของบุคคลที่หนึ่งใหม่หากเป็นไปได้ สำหรับวิดเจ็ตแอปของบุคคลที่หนึ่งทั้งหมดใน ขอบเขตของคุณ ให้ทำตามรายการตรวจสอบสำหรับนักพัฒนาแอปด้านล่าง

  • ลำดับความสำคัญจะอิงตามคำแนะนำจากแพลตฟอร์ม
  • หากต้องการดูรายละเอียดเกี่ยวกับคำแนะนำ ให้คลิกลิงก์ในคอลัมน์การเปลี่ยนแปลง

  พื้นที่	เปลี่ยน	ลำดับความสำคัญในการติดตั้งใช้งาน
  ปรับปรุงประสบการณ์การใช้งานหน้าแรก	เพิ่ม ตัวอย่างที่ปรับขนาดได้	P1
  	เพิ่ม คำอธิบายวิดเจ็ต	P1
  	ปรับแต่งวิดเจ็ตได้ง่ายขึ้น	P2 (ไม่บังคับ)
  	เปิดใช้ การเปลี่ยนภาพที่ราบรื่นยิ่งขึ้น	P0
  	หลีกเลี่ยง การส่งต่อการออกอากาศ	P0
  ใช้หลักเกณฑ์ของวิดเจ็ต	ปรับปรุง ขนาดและเลย์เอาต์วิดเจ็ต	P2
  	ใช้ สีแบบไดนามิก	P0
  	ใช้ มุมโค้ง	P0
  	เพิ่ม ปุ่มผสมใหม่	P2
  ลดความซับซ้อนของโค้ดวิดเจ็ตที่มีอยู่	ลดความซับซ้อนของ คอลเล็กชัน RemoteView	P2
  	ลดความซับซ้อนของ รันไทม์ RemoteView	P2

แหล่งข้อมูลเพิ่มเติม

การใช้สีของ SysUI

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

รูปที่ 4 การใช้สีแบบไดนามิกใน UI ของระบบ

การอัปเดตแอตทริบิวต์สีของไลบรารีวัสดุ

Material จะอัปเดตแอตทริบิวต์ธีมในการเปิดตัวครั้งถัดไปโดยการสร้าง บทบาทสีที่ใช้ในการระบุสีให้กับมุมมองที่เฉพาะเจาะจง

Material จะอัปเดตแอตทริบิวต์สถานะด้วยตัวชี้ต่อไปนี้

คำถามที่พบบ่อย

การดึงสี

เมื่อผู้ใช้เปลี่ยนวอลเปเปอร์ ระบบจะดึงสีโดยอัตโนมัติ หรือต้องทริกเกอร์จากที่ใด

แพตช์ Android 12 จะเปิดการดึงสีวอลเปเปอร์โดยค่าเริ่มต้น

ThemeOverlayController.java จะทริกเกอร์ตรรกะด้วย ThemeOverlayController#mOnColorsChangedListener และ WallpaperManager#onWallpaperColorsChanged

สำหรับวอลเปเปอร์เคลื่อนไหวหรือวอลเปเปอร์วิดีโอ เราจะทราบได้ไหมว่าเมื่อใดที่การดึงสีจะดึงสีจากหน้าจอ ผู้ใช้บางรายอาจต้องการ สีจากเฟรมสุดท้ายเนื่องจากแสดงเป็นเวลานานที่สุด

การดึงสีจะทริกเกอร์เมื่อผู้ใช้ตั้งวอลเปเปอร์หรือหลังจากเปิด/ปิดหน้าจอ (เพื่อตอบสนองต่อ WallpaperEngine#notifyColorsChanged) ระบบจะใช้เหตุการณ์ WallpaperColors ล่าสุด (จากวอลเปเปอร์เคลื่อนไหว) หลังจากที่ผู้ใช้ปิดหน้าจอและเปิดอีกครั้ง

เครื่องมือเลือกธีม/วอลเปเปอร์

ฉันจะเปิดใช้เครื่องมือเลือกธีมเพื่อให้แสดงสีต้นทางหลายสีให้ผู้ใช้เลือกแทนสีที่มีความถี่สูงสุดได้อย่างไร มีวิธีรับสีเหล่านั้น จากตรรกะการดึงข้อมูลไหม

ได้ คุณใช้ColorScheme#getSeedColors(wallpaperColors: WallpaperColors)ได้ในตัวเลือกธีม

Pixel มีฟีเจอร์ที่ชื่อว่าไอคอนตามธีม รวมอยู่ใน แพตช์ 3 รายการที่คุณแชร์หรือไม่ OEM จะติดตั้งใช้งานได้อย่างไร

ไม่ได้ ไอคอนตามธีมอยู่ในรุ่นเบต้าและไม่พร้อมใช้งานใน Android 12

มีวิธีใช้แอปวอลเปเปอร์ของ Google โดยเปิดใช้ฟีเจอร์การดึงสีและการเลือก ไหม

ได้ คุณสามารถติดตั้งใช้งานฟีเจอร์เหล่านี้ได้ในแอป Google Wallpaper เวอร์ชันล่าสุดโดยทำตามขั้นตอนการผสานรวมที่อธิบายไว้ก่อนหน้านี้ในหน้านี้

โปรดติดต่อ TAM เพื่อขอรายละเอียดเพิ่มเติม

Google แชร์แอปหรือซอร์สโค้ดเพื่อให้ OEM สามารถใช้ตัวอย่างสีแบบไดนามิกเวอร์ชันของตนเองในเมนูการตั้งค่า ซึ่งมีลักษณะคล้ายกับส่วนแสดงตัวอย่างที่แสดงในแอปเครื่องมือเลือกวอลเปเปอร์ของ Google ได้ไหม

คลาสหลักที่แสดงตัวอย่างคือ WallpaperPicker2 และ Launcher3

หน้าจอตัวอย่างวอลเปเปอร์คือ WallpaperSectionController

วิธีใช้แสดงตัวอย่างหลังจากเปลี่ยนสีตามที่แสดง ในแอปวอลเปเปอร์ของ Google

แอปเครื่องมือเลือกวอลเปเปอร์คาดหวังว่า ContentProvider จะพร้อมใช้งานจาก Launcher (Launcher ที่อิงตาม Launcher3 จะมี) GridCustomizationsProvider เป็นผู้ให้บริการตัวอย่าง ใน Launcher ซึ่งควรมีการอ้างอิงในข้อมูลเมตาของกิจกรรมหลักของ Launcher เพื่อให้แอปวอลเปเปอร์และสไตล์อ่านได้ ฟีเจอร์ทั้งหมดนี้มีการใช้งานใน Launcher3 ของ AOSP และพร้อมให้บริการแก่ OEM