รายการใน Jetpack Compose Glimmer

อุปกรณ์ XR ที่รองรับ
คำแนะนำนี้จะช่วยคุณสร้างประสบการณ์การใช้งานสำหรับอุปกรณ์ XR ประเภทต่างๆ
ดูข้อมูลเกี่ยวกับประเภทอุปกรณ์ XR →
แว่นตา Display
ดูข้อมูลเกี่ยวกับประเภทอุปกรณ์ XR →

ใน Jetpack Compose Glimmer นั้น ListItem เป็นคอมโพเนนต์มาตรฐานสำหรับ แสดงเนื้อหา 1 แถว รายการข้อมูลได้รับการออกแบบมาเพื่อการโต้ตอบแบบเน้นการโฟกัสของแว่นตาที่มีจอแสดงผล จึงมีการตอบสนองด้วยภาพในตัวเมื่อได้รับโฟกัส

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

รูปที่ 1 ตัวอย่างรายการ 2 รายการที่มีรายการข้อมูลสไตล์ต่างๆ ใน Jetpack Compose Glimmer

การใช้งานภายในรายการ

รายการข้อมูลเป็นตัวเลือกหลักสำหรับแถวภายในรายการ แต่รายการยัง โฮสต์คอมโพเนนต์อื่นๆ ได้ด้วย เช่น Card หรือ TitleChip เพื่อ ให้ความสำคัญกับภาพที่แตกต่างกัน

รายการข้อมูลใช้ช่อง headlineContent สำหรับข้อความหลักเพื่อให้สอดคล้องกับคอมโพเนนต์ Card และ TitleChip ที่ใช้กับรายการอื่นๆ

ตัวอย่าง: รายการข้อมูลพื้นฐาน

โค้ดต่อไปนี้จะสร้างรายการข้อมูลพื้นฐาน

@Composable
fun ListItemSample() {
    ListItem { Text("This is a list item") }
}

ตัวอย่าง: รายการข้อมูลที่มีป้ายกำกับและไอคอนสนับสนุน

โค้ดต่อไปนี้จะสร้างรายการข้อมูลที่มีป้ายกำกับสนับสนุน รวมถึงไอคอนนำและไอคอนต่อท้าย

@Composable
fun ListItemWithIconsSample() {
    ListItem(
        leadingIcon = { Icon(FavoriteIcon, contentDescription = "Favorite") },
        trailingIcon = { Icon(FavoriteIcon, contentDescription = "Favorite") }
    ) {
        Text("This is a list item with icons")
    }
}