หน้านี้แสดงรายละเอียดตัวเลือกการปรับแต่งสำหรับรายการ CarUiListItem
รูปแบบที่ยอมรับสำหรับการใช้ไลบรารี Car UI เพื่อแสดงรายการของรายการคือการใช้ CarUiRecyclerView ร่วมกับออบเจ็กต์ CarUiListItemAdapter และ CarUiListItem การปรับแต่ง CarUiRecyclerView ครอบคลุมอยู่ใน caruirecyclerview
ข้อกำหนดเบื้องต้น
เนื้อหาต่อไปนี้สันนิษฐานว่ามีความเข้าใจเกี่ยวกับรันไทม์รีซอร์สโอเวอร์เลย์ (RRO) ที่อธิบายไว้ใน ปรับแต่งแอป
เกี่ยวกับ CarUiListItem
รายการสามารถเป็นหนึ่งในสองประเภทระดับสูง ส่วนหัว หรือ เนื้อหา แต่ละคำอธิบายด้านล่าง
หัวข้อ
CarUiListItemAdapter ผูกอ็อบเจ็กต์ประเภท CarUiHeaderListItem กับมุมมองที่ขยายจากไฟล์โครงร่าง car_ui_header_list_item ซึ่งมีมุมมองเหล่านี้:
| จำนวนการดู | |
|---|---|
title | ชื่อเรื่อง TextView |
body | มุมมองข้อความเนื้อหา |
ตัวอย่างเช่น รายการส่วนหัวด้านล่างได้รับการกำหนดค่าให้แสดงชื่อเรื่อง และ ข้อความเนื้อหา:
เนื้อหา
CarUiListItemAdapter ผูกอ็อบเจ็กต์ประเภท CarUiHeaderListItem กับมุมมองที่ขยายจากไฟล์โครงร่าง car_ui_list_item ไฟล์นี้มีมุมมองเหล่านี้:
| จำนวนการดู | |
|---|---|
icon_container | คอนเทนเนอร์สำหรับไอคอนหลัก |
title | ชื่อเรื่อง TextView |
body | มุมมองข้อความเนื้อหา |
action_container | คอนเทนเนอร์สำหรับมุมมองการดำเนินการ |
ตัวอย่างเช่น รายการเนื้อหาด้านล่างนี้ได้รับการกำหนดค่าให้แสดงไอคอน และ สวิตช์:
ไอคอน
ขึ้นอยู่กับประเภทไอคอนที่กำหนดค่าไว้สำหรับรายการ หนึ่งในสามมุมมองต่อไปนี้จะถูกใช้สำหรับไอคอนหลัก:
| จำนวนการดู | |
|---|---|
icon | ไอคอนมาตรฐาน ImageView |
content_icon | ไอคอนเนื้อหา ImageView |
avatar_icon | ไอคอนอวตาร ImageView |
องค์ประกอบการดำเนินการ
อย่างมาก มุมมององค์ประกอบการดำเนินการอย่างใดอย่างหนึ่งต่อไปนี้จะแสดงขึ้น โดยขึ้นอยู่กับประเภทการดำเนินการสำหรับรายการ:
| จำนวนการดู | |
|---|---|
switch_widget | Switch |
checkbox_widget | CheckBox |
radio_button_widget | RadioButton |
supplemental_icon | ImageView |
ปรับแต่งข้อความ
การจัดรูปแบบข้อความทั้งในส่วนหัวและรายการเนื้อหาจะถูกควบคุมโดยลักษณะลักษณะที่ปรากฏของข้อความที่กำหนดไว้ในไลบรารี Car UI หากต้องการแทนที่สไตล์ข้อความของรายการ ให้แทนที่สไตล์ที่เกี่ยวข้องที่แสดงด้านล่าง
หากต้องการปรับแต่งสไตล์ ส่วนหัว :
| สไตล์ส่วนหัว | |
|---|---|
| ข้อความชื่อเรื่อง | @style/TextAppearance.CarUi.ListItem |
| ข้อความเนื้อหา | @style/TextAppearance.CarUi.ListItem.Body |
ในการปรับแต่งสไตล์ เนื้อหา :
| รูปแบบเนื้อหา | |
|---|---|
| ข้อความชื่อเรื่อง | @style/TextAppearance.CarUi.ListItem.Header |
| ข้อความเนื้อหา | @style/TextAppearance.CarUi.ListItem.Body |
ปรับแต่งไอคอน
รายการเนื้อหาสามารถมีทั้งไอคอนหลัก และ ไอคอนเสริม
ไอคอนหลัก
แม้ว่าจะมีออบเจ็กต์ ImageView สามออบเจ็กต์ที่กำหนดไว้ภายในที่เก็บไอคอนในเค้าโครงรายการเนื้อหา แต่ไอคอนจะแสดงได้สูงสุด 1 รายการตามประเภทไอคอนที่ระบุของรายการ เมื่อถึงเวลาผูกรายการ CarUiListItemAdapter จะตั้งค่าการมองเห็นที่เหมาะสมสำหรับไอคอนวัตถุ ImageView
ความกว้างและความสูงของไอคอนจะถูกควบคุมโดยค่ามิติที่สามารถซ้อนทับเพื่อควบคุมขนาดได้ ค่ามิติที่ระบุความกว้างและความสูงสำหรับประเภทไอคอนต่างๆ มีดังต่อไปนี้
ไอคอนมาตรฐาน
ตามค่าเริ่มต้น ไอคอนมาตรฐานจะมีความสูงและความกว้างเท่ากัน
| ไอคอนมาตรฐาน | |
|---|---|
| ความกว้าง | car_ui_list_item_icon_size |
| ความสูง | car_ui_list_item_icon_size |
ไอคอนเนื้อหา
| ไอคอนเนื้อหา | |
|---|---|
| ความกว้าง | car_ui_list_item_content_icon_width |
| ความสูง | car_ui_list_item_content_icon_height |
ไอคอนอวตาร
ตามค่าเริ่มต้น ไอคอนหลักจะอยู่ตรงกลางภายในมุมมองคอนเทนเนอร์ไอคอน ซึ่งมีความกว้างที่กำหนดโดยค่ามิติ car_ui_list_item_icon_container_width
| ไอคอนอวตาร | |
|---|---|
| ความกว้าง | car_ui_list_item_content_icon_width |
| ความสูง | car_ui_list_item_content_icon_height |
ไอคอนเสริม
ไอคอนเสริมอยู่กึ่งกลางภายในมุมมองคอนเทนเนอร์การดำเนินการ ทั้งความกว้างและความสูงของไอคอนเสริมถูกกำหนดโดยค่ามิติ car_ui_list_item_supplemental_icon_size วางซ้อนค่ามิตินี้เพื่อเปลี่ยนขนาดของไอคอนเสริม