ปุ่ม

ปุ่มจะสื่อสารการดำเนินการที่จะเกิดขึ้นเมื่อผู้ใช้แตะปุ่ม

ปุ่มต่างๆ คือคอมโพเนนต์โครงการโอเพนซอร์ส Android (AOSP) มาตรฐาน โดยอาจเติมเป็นสีพื้นหลังสีทึบหรือไม่เติมสีก็ได้ (โดยมีพื้นหลังโปร่งใส) ปุ่มที่มีสีทึบหมายถึงการทำงานหลักหรือการทำงานที่ต้องการ ปุ่มต่างๆ อาจปรากฏแยกกันหรือปรากฏเป็นกลุ่มได้ ซึ่งต่างจากแท็บซึ่งจะปรากฏเป็นกลุ่มเสมอ


กายวิภาคศาสตร์

กายวิภาคของกระดุม
1. คอนเทนเนอร์ปุ่มที่ไม่ได้รับโฆษณา
2. คอนเทนเนอร์ปุ่มที่มีการเติมโฆษณา ซึ่งระบุการดำเนินการหลักหรือการดำเนินการที่ต้องการ
3. ป้ายกำกับปุ่ม

ข้อกำหนด

ความยาวต่ำสุดและสูงสุดของปุ่ม

ป้ายกำกับปุ่มมีความยาวได้สูงสุด 20 อักขระ ความกว้างขั้นต่ำของปุ่มคือ 156dp
ความยาวป้ายกำกับของปุ่มสูงสุดคือ 20 อักขระ ความกว้างขั้นต่ำของปุ่มคือ 156dp

ปุ่มที่มีไอคอนกับปุ่มเริ่มต้น

ปุ่มจะมีไอคอนได้ เมื่อรวมไว้แล้ว ไอคอนมักจะปรากฏอยู่ทางด้านซ้ายของข้อความปุ่ม
ปุ่มจะมีไอคอนได้ เมื่อมีไอคอนรวมอยู่ด้วย ไอคอนมักจะปรากฏอยู่ทางด้านซ้ายของข้อความปุ่ม

ปุ่มจะปรากฏเป็นองค์ประกอบในคอมโพเนนต์อื่นๆ ได้ เช่น แถบแอปหรือกล่องโต้ตอบ

ตำแหน่งของปุ่มในแถบแอป

ปุ่มอยู่ที่ด้านขวาของแถบแอป
ปุ่มอยู่ที่ด้านขวาของแถบแอป

ปุ่มในกล่องโต้ตอบ

ปุ่มในกล่องโต้ตอบมักอยู่ที่ด้านล่างซ้ายของกล่องโต้ตอบ
โดยทั่วไปปุ่มในกล่องโต้ตอบจะอยู่ที่ด้านซ้ายล่างของกล่องโต้ตอบ

ปุ่มหลัก

ขอบมนของปุ่มหลักเน้นให้เห็นความสำคัญของปุ่มหลัก
ขอบมนของปุ่มหลักเน้นความสำคัญของปุ่ม

การปรับแต่งช่อง

OEM สามารถสะท้อนถึงแบรนด์ของตนโดยการปรับเปลี่ยนลักษณะที่ปรากฏของปุ่ม เช่น

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

คู่มือการผสานรวมไลบรารี UI ของรถจะให้คําแนะนํา OEM สําหรับการปรับแต่งคอมโพเนนต์

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


ตัวอย่าง

ปุ่มที่ไม่ได้รับและที่มีสี
ปุ่มที่เติมสีและมีการเติมสี โดยปุ่มที่เติมสีแสดงถึงการดำเนินการหลัก
ปิดใช้งานปุ่มที่กรอกแล้ว
สีและความทึบแสงของปุ่มที่เติมสีนี้แสดงถึงสถานะปิดใช้
กล่องโต้ตอบของปุ่มที่ไม่ได้รับโฆษณา
ปุ่มที่ไม่ได้รับข้อความในกล่องโต้ตอบจะแสดงการดำเนินการที่มีน้ำหนักเท่ากัน
ระยะเวลาการเคลื่อนไหวของปุ่ม
การเคลื่อนไหวแบบระลอกคลื่นเหล่านี้มีระยะเวลา 330 มิลลิวินาที ใช้ปุ่มเพื่อยืนยันการติดต่อของผู้ใช้
ภาพเคลื่อนไหวแบบกระเพื่อมของปุ่ม
การเคลื่อนไหวที่เป็นระลอกคลื่นเหล่านี้จะเริ่มวางซ้อนบนพื้นผิวปุ่ม 60% โฆษณาเหล่านี้จะขยายออกห่างจากการแตะ และหยุด 10dp จากขอบปุ่ม