Mengembangkan UI untuk Aplikasi Berbasis View Android

Coba cara Compose
Jetpack Compose menggunakan Jetpack XR SDK adalah toolkit UI yang direkomendasikan untuk Android XR.

Menggunakan framework Android Jetpack Compose adalah cara terbaik untuk memanfaatkan kemajuan terbaru dalam pengembangan UI Android dan untuk memverifikasi bahwa aplikasi Anda tetap sesuai dengan praktik terbaik industri.

Namun, jika Anda belum melakukan migrasi, dan sedang berupaya melakukan spasialisasi aplikasi berbasis Android Views, ada beberapa pendekatan yang dapat Anda lakukan.

Menggunakan kembali View yang ada dalam SpatialPanels

Meskipun SpatialPanels adalah bagian dari library Jetpack Compose untuk XR, SpatialPanels juga menerima View. Saat menggunakan Subspace di MainActivity, tempatkan tampilan yang ada ke dalam SpatialPanel seperti yang ditunjukkan dalam contoh berikut.

setContent {
    Subspace {
        SpatialPanel(
            modifier = SubspaceModifier.height(500.dp).width(500.dp).depth(25.dp)
        ) { MyCustomView(this@ActivityWithSubspaceContent) }
    }
}

Menggunakan API interoperabilitas View Android dan Compose

Lihat panduan tentang interoperabilitas antara View dan Compose. Dokumentasi ini membahas penggunaan framework ini bersama-sama dan berisi link ke contoh kode yang dapat Anda gunakan.

Menggunakan ComposeView untuk menambahkan panel spasial dan pengorbit ke fragmen yang ada

Gunakan ComposeView di tata letak XML untuk menambahkan Composable dan membuat konten XR baru. Gunakan View binding atau findViewById untuk menemukan ComposeView dalam fungsi onCreateView().

Baca selengkapnya tentang panduan 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
}

Bekerja langsung dengan library Jetpack SceneCore

Compose untuk XR dibangun di atas Jetpack SceneCore. Jika Anda melakukan spasialisasi aplikasi berbasis View, Anda dapat terus menggunakan kode UI yang ada dalam Compose untuk XR atau memilih untuk bekerja langsung dengan Session Jetpack SceneCore.

Anda dapat membuat panel langsung dari SceneCore menggunakan PanelEntity. Tetapkan ukuran panel dalam meter menggunakan dimensions, atau dalam piksel menggunakan pixelDimensions. Anda dapat memilih untuk membuat panel dapat dipindahkan atau diubah ukurannya dengan menggunakan komponen yang sesuai. Untuk mengetahui informasi selengkapnya, lihat Menambahkan perilaku umum ke entitas.

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