รายการใน Jetpack Compose Glimmer

อุปกรณ์ XR ที่ใช้ได้

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

ดูข้อมูลเกี่ยวกับประเภทอุปกรณ์ XR →

ดูข้อมูลเกี่ยวกับประเภทอุปกรณ์ XR →

ใน Glimmer ของ Jetpack Compose รายการคือคอมโพเนนต์ UI ที่เลื่อนได้ในแนวตั้งซึ่งแสดงผลเฉพาะรายการที่มองเห็นได้อย่างมีประสิทธิภาพ ออกแบบมาเพื่อให้ลักษณะการทำงานและการป้อนข้อมูลที่เฉพาะเจาะจงสำหรับแอปแว่นตา AI Jetpack Compose Glimmer ทำได้โดยใช้คอมโพเนนต์ VerticalList และ ListItem

VerticalList คือคอมโพเนนต์ของ Jetpack Compose Glimmer สำหรับแสดงเนื้อหาแนวตั้งที่เลื่อนได้ โดยมีฟังก์ชันการทำงานของ API เหมือนกับ LazyColumn แต่มีลักษณะการทำงานที่เหมาะสำหรับ Jetpack Compose Glimmer และแว่นตา AI ที่มีจอแสดงผลโดยเฉพาะ

รายการ Glimmer ของ Jetpack Compose มีข้อจำกัดที่ไม่เหมือนใคร 2-3 อย่างดังนี้

• รายการควรแสดงเพียง 3 รายการหรือน้อยกว่านั้นภายในมุมมอง
• เมื่อรายการมีจำนวนมากเกินกว่าจะแสดงในมุมมองได้ ระบบจะแสดงเลเยอร์โปร่งบางสีดำใกล้กับขอบของรายการ

ตัวอย่าง: แสดงรายการแนวตั้งที่มี 3 รายการ

โค้ดต่อไปนี้แสดงวิธีใช้คอมโพเนนต์ VerticalList และ ListItem เพื่อสร้างรายการที่มี 3 รายการ

@Composable
fun GlimmerListWithButtons() {
    VerticalList(
        contentPadding = PaddingValues(16.dp),
        verticalArrangement = Arrangement.spacedBy(20.dp)
    ) {
        items(count = 3) { index ->
            ListItem(
                onClick = { /* Handle Click */ },
                leadingIcon = if (index == 1) {
                    { Icon(Icons.Rounded.Favorite, "Favorite Icon") }
                } else null
            ) {
                Text("List Item + $index")
            }
        }
    }
}

ประเด็นสำคัญเกี่ยวกับโค้ด

• รายการจะแสดง 3 รายการที่สร้างขึ้นแบบไดนามิก โดยแต่ละรายการจะเป็น ListItem
• คุณปรับแต่ง ListItem แต่ละรายการและเพิ่มไอคอนลงในรายการได้