คอมโพเนนต์คือองค์ประกอบสําคัญสําหรับการออกแบบรูปลักษณ์ของอินเทอร์เฟซ Android Automotive OS (AAOS) คอมโพเนนต์ AAOS บางรายการและคุณสมบัติที่ปรับแต่งได้จะใช้งานในไลบรารี UI ของรถยนต์ ในขณะที่คอมโพเนนต์อื่นๆ เป็นคอมโพเนนต์ AOSP มาตรฐาน หรือต้องสร้างตั้งแต่ต้นตามข้อกำหนดที่ระบุไว้ที่นี่
ส่วนนี้จะอธิบายกายวิภาค ข้อมูลจำเพาะด้านภาพ และสไตล์สำหรับคอมโพเนนต์ของ AAOS
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-1.png?authuser=1&hl=th)
แถบและส่วนหัวแอป
พื้นที่เฉพาะสำหรับฟังก์ชันที่สำคัญเกี่ยวกับแอป
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-2.png?authuser=1&hl=th)
ปุ่ม
จำนวนผู้ดำเนินการที่สื่อสารวัตถุประสงค์กับผู้ใช้
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-3.png?authuser=1&hl=th)
แถบควบคุม
ชุดการควบคุมที่ขยายได้ซึ่งเชื่อมโยงกับข้อมูลพร็อพเพอร์ตี้หนึ่งๆ
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-4.png?authuser=1&hl=th)
กล่องโต้ตอบ
การ์ดที่มีข้อความให้ผู้ใช้เกี่ยวกับข้อมูลที่ทันท่วงทีหรือเร่งด่วน ในบางครั้งอาจมีตัวเลือกการดำเนินการสำหรับการตอบ
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-5.png?authuser=1&hl=th)
ตารางกริด
อาร์เรย์แบบเลื่อนได้ของรูปภาพที่แสดงรายการเนื้อหา โดยมีข้อความสั้นๆ ใต้รูปภาพแต่ละรูป
![](https://developers.google.cn/cars/design/automotive-os/components/images/keypad-ov.png?authuser=1&hl=th)
ปุ่มกด
อนุญาตให้ผู้ใช้ป้อนหมายเลขโทรศัพท์ในโทรศัพท์
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-6.png?authuser=1&hl=th)
รายการ
เนื้อหาที่แสดงเป็นบรรทัดข้อความ (พร้อมรูปภาพหรือไอคอนขนาดเล็กที่ไม่บังคับ) ในคอลัมน์เดียวแบบเลื่อนได้
![](https://developers.google.cn/cars/design/automotive-os/components/images/Comp-Ov-Pi.png?authuser=1&hl=th)
ตัวบอกสถานะความคืบหน้าของสื่อ
ภาพแสดงระยะเวลาและเวลาเล่นที่ผ่านไปสำหรับแหล่งที่มาของสื่อในแอปสื่อ
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-7.png?authuser=1&hl=th)
แถบควบคุมที่ย่อเล็กสุด
แถบควบคุมเวอร์ชันเล็กลงที่ใช้ได้ในหลายมุมมอง โดยมีการควบคุมและข้อมูลเมตาเพียงเล็กน้อย
![](https://developers.google.cn/cars/design/automotive-os/components/images/noti-card-ov.png?authuser=1&hl=th)
การ์ดการแจ้งเตือน
สื่อสารข้อมูลจำนวนเล็กน้อยจากระบบหรือจากแอปได้ทันท่วงที
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-8.png?authuser=1&hl=th)
ส่วนหัวย่อย
ไทล์รายการที่ระบุส่วนของเนื้อหาในมุมมองแบบตารางหรือรายการ
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-10.png?authuser=1&hl=th)
แถบเลื่อน
สัญญาณบอกตำแหน่งและตัวช่วยในการนำทางในกรณีที่เอกสารมีขนาดใหญ่กว่าหน้าต่างที่แสดง
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-9.png?authuser=1&hl=th)
แท็บ
ปุ่มที่ปรากฏเป็นกลุ่มเสมอและขึ้นอยู่กับสถานะของกันและกัน
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-toast.png?authuser=1&hl=th)
ข้อความโทสต์
ข้อความแจ้งข้อมูลซึ่งจะแสดงสั้นๆ บริเวณด้านล่างของหน้าจอเกี่ยวกับการดำเนินการที่แอปได้ทำหรือจะทำ