พัฒนา UI สําหรับแอปที่ทำงานบน Android Views

ลองใช้วิธีเขียน
Jetpack Compose ที่ใช้ Jetpack XR SDK เป็นชุดเครื่องมือ UI ที่แนะนำสำหรับ Android XR

การใช้เฟรมเวิร์ก Android Jetpack Compose เป็นวิธีที่ดีที่สุดในการใช้ประโยชน์จากการพัฒนา UI ของ Android เวอร์ชันล่าสุด และช่วยให้แอปพลิเคชันของคุณทันสมัยอยู่เสมอตามแนวทางปฏิบัติแนะนำของอุตสาหกรรม

อย่างไรก็ตาม หากคุณยังไม่ได้ย้ายข้อมูลและกำลังทํางานเพื่อจัดวางแอปตามมุมมองของ Android ให้เป็นพื้นที่ คุณจะทําได้ 2 วิธีดังนี้

ใช้มุมมองที่มีอยู่ซ้ำภายใน SpatialPanel

แม้ว่า SpatialPanel จะเป็นส่วนหนึ่งของไลบรารี Jetpack Compose สำหรับ XR แต่ก็ยังยอมรับ Views ได้ด้วย เมื่อใช้ setSubspaceContent() ใน MainActivity ให้วางมุมมองที่มีอยู่ไว้ใน SpatialPanel ดังที่แสดงในตัวอย่างต่อไปนี้

setSubspaceContent {
    SpatialPanel(
        modifier = SubspaceModifier.height(500.dp).width(500.dp).depth(25.dp)
    ) { MyCustomView(this) }
}

ใช้ API การทํางานร่วมกันของ Android Views และ Compose

ดูคำแนะนำเกี่ยวกับความสามารถในการทำงานร่วมกันระหว่าง Views กับ Compose เอกสารประกอบนี้ครอบคลุมการใช้เฟรมเวิร์กเหล่านี้ร่วมกันและมีลิงก์ไปยังตัวอย่างโค้ดที่คุณใช้ได้

ใช้ ComposeView เพื่อเพิ่มแผงเชิงพื้นที่และภาพโคจรไปยังส่วนที่อยู่แล้ว

ใช้ ComposeView ในเลย์เอาต์ XML เพื่อเพิ่ม Composable และสร้างเนื้อหา XR ใหม่ ใช้การเชื่อมโยงมุมมองหรือ findViewById เพื่อค้นหา ComposeView ในฟังก์ชัน onCreateView()

อ่านเพิ่มเติมเกี่ยวกับคำแนะนำสำหรับ ComposeView

override fun onCreateView(
    inflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?
): View {
    val view = inflater.inflate(R.layout.example_fragment, container, false)
    view.findViewById<ComposeView>(R.id.compose_view).apply {
        // Dispose of the Composition when the view's LifecycleOwner
        // is destroyed
        setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed)
        setContent {
            // In Compose world
            SpatialPanel(SubspaceModifier.height(500.dp).width(500.dp)) {
                Text("Spatial Panel with Orbiter")
            }
        }
    }
    return view
}

ทำงานร่วมกับไลบรารี Jetpack SceneCore โดยตรง

Compose สำหรับ XR สร้างขึ้นจาก Jetpack SceneCore หากกำลังทำให้แอปที่ทำงานกับ Views เป็นโมเดลเชิงพื้นที่ คุณจะใช้โค้ด UI ที่มีอยู่ภายใน Compose สำหรับ XR ต่อได้ หรือจะเลือกทำงานกับ Session ของ Jetpack SceneCore โดยตรงแทนก็ได้

คุณสร้างแผงจาก SceneCore ได้โดยตรงโดยใช้ PanelEntity กำหนดขนาดของแผงในหน่วยเมตรโดยใช้ Dimensions หรือในหน่วยพิกเซลโดยใช้ PixelDimensions คุณเลือกได้ว่าจะทําให้แผงเคลื่อนย้ายได้หรือปรับขนาดได้โดยใช้คอมโพเนนต์ที่เกี่ยวข้อง ดูข้อมูลเพิ่มเติมได้ที่หัวข้อเพิ่มลักษณะการทำงานทั่วไปให้กับเอนทิตี

val panelContent = MyCustomView(this)
val panelEntity = PanelEntity.create(
    session = xrSession,
    view = panelContent,
    pixelDimensions = PixelDimensions(500, 500),
    name = "panel entity"
)