การจัดรูปแบบตัวอักษรช่วยกำหนดลำดับชั้นและฟังก์ชันของ UI การเลือกใช้การพิมพ์ยังมีผลต่อการอ่านออกเขียนได้อย่างมาก ซึ่งเป็นข้อควรพิจารณาที่สำคัญในการขับรถ
คำแนะนำโดยย่อ (TL:DR):
- ใช้การแสดงผล เนื้อความ และข้อความย่อยจากสเกลการพิมพ์ของ Android Automotive OS
- ขนาดข้อความเนื้อหาขั้นต่ำคือ 24dp สงวนขนาดข้อความย่อยไว้สำหรับข้อมูลที่ไม่สำคัญ
- ใช้ตารางกริด 4-dp เพื่อจัดวาง
- ใช้แอตทริบิวต์รูปแบบเพื่อสร้างเอฟเฟกต์ (ลำดับชั้นการสนับสนุน การเน้นความสนใจ)
- ใช้แบบอักษรน้ำหนักปานกลางแต่พอควร และหลีกเลี่ยงการใช้ตัวหนา
การอ้างอิงขนาดและตารางกริด
ใช้สเกลการพิมพ์และตารางกริดการจัดเรียงของ Android Automotive OS เพื่อให้ข้อความที่แสดง เนื้อหา และข้อความย่อยมีความสอดคล้องกันและมองเห็นได้หลายระดับ
มาตราส่วนการพิมพ์ของ Android Automotive OS
สเกลดังกล่าวจะแสดงแบบอักษร ขนาดแบบอักษร และความสูงของบรรทัดสำหรับข้อความเริ่มต้นทั้ง 9 ระดับของข้อความที่แสดง ข้อความเนื้อหา และข้อความย่อยที่ใช้ใน Android Automotive OS ขนาดประเภทขั้นต่ำสำหรับ Android Automotive OS คือ 24dp ขนาดที่ต่ำกว่า 24dp จะอ่านได้ง่ายและควรใช้อย่างจำกัดในบริบทแบบอัตโนมัติ ขนาดข้อความย่อยจะสงวนไว้ให้สำหรับข้อมูลที่ไม่สำคัญหรือลำดับสาม เช่น เนื้อหาในแถบสถานะ
![ประเภทสเกล](https://developers.google.cn/cars/design/automotive-os/design-system/images/type-scale2.png?authuser=6&hl=th)
การจัดเรียงตารางกริดและการอ้างอิงเกณฑ์พื้นฐาน
การรักษาขนาดและจังหวะแนวตั้งตามตารางกริด 4dp ช่วยให้มีความสม่ำเสมอและลำดับชั้นของภาพ
![การปรับขนาดบนตารางกริด 4dp](https://developers.google.cn/cars/design/automotive-os/design-system/images/4dp-grid.png?authuser=6&hl=th)
คำแนะนำและตัวอย่าง
การใช้การปรับขนาดและสไตล์กับตัวเลือกการพิมพ์จะช่วยคุณทำสิ่งต่อไปนี้
- อ่านข้อความทั้งหมดให้อ่านได้ชัดเจน
- ถ่ายทอดลำดับชั้นของภาพในองค์ประกอบของข้อความ
- เน้นความสนใจในจุดที่สำคัญที่สุด
แต่ละรูปแบบประกอบด้วยชุดของค่าที่กำหนดโดยมาตราส่วนและแอตทริบิวต์เพิ่มเติม แอตทริบิวต์เหล่านี้ประกอบด้วยค่าน้ำหนัก สี และความทึบแสงของแบบอักษร โดยคุณสามารถเพิ่มไปยังขนาดใดก็ได้เพื่อสร้างเอฟเฟกต์ที่ต้องการ เช่น การโฟกัสความสนใจ
![](https://developers.google.cn/cars/design/automotive-os/design-system/images/type-style.png?authuser=6&hl=th)
ตัวอย่าง
![ขนาดตัวอักษรของการพิมพ์](https://developers.google.cn/cars/design/automotive-os/design-system/images/scale-example-1.png?authuser=6&hl=th)
ข. เนื้อความ 2
ค. เนื้อความ 1
![ขนาดตัวอักษรของการพิมพ์](https://developers.google.cn/cars/design/automotive-os/design-system/images/scale-example-2.png?authuser=6&hl=th)
ข. เนื้อความ 1
ค. เนื้อความ 1
![รองรับการพิมพ์](https://developers.google.cn/cars/design/automotive-os/design-system/images/typography-do2.png?authuser=6&hl=th)
สิ่งที่ควรทำ
![พิมพ์ไม่ได้](https://developers.google.cn/cars/design/automotive-os/design-system/images/typography-dont2.png?authuser=6&hl=th)
สิ่งที่ไม่ควรทำ