Cómo desarrollar una IU para apps basadas en objetos View de Android

Prueba la forma de Compose

Jetpack Compose con el SDK de Jetpack XR es el kit de herramientas de IU recomendado para Android XR.

Desarrolla con el SDK de Jetpack XR →

Usar el framework de Android Jetpack Compose es la mejor manera de aprovechar los avances más recientes en el desarrollo de la IU de Android y verificar que tu aplicación se mantenga actualizada con las prácticas recomendadas de la industria.

Sin embargo, si no realizaste la migración y estás trabajando para espacializar una app basada en Android Views, puedes adoptar algunos enfoques.

Reutiliza tus vistas existentes en SpatialPanels

Si bien los SpatialPanels forman parte de la biblioteca de Jetpack Compose para XR, también aceptan Views. Cuando uses Subspace en tu MainActivity, coloca una vista existente en un SpatialPanel, como se muestra en el siguiente ejemplo.

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

Usa las APIs de interoperabilidad de Android Views y Compose

Consulta la guía sobre la interoperabilidad entre Views y Compose. En esta documentación, se explica cómo usar estos frameworks juntos y se incluyen vínculos a muestras de código que puedes usar.

Usa un ComposeView para agregar paneles espaciales y orbitadores a un fragmento existente

Usa un ComposeView en tu diseño XML para agregar elementos componibles y crear contenido de XR nuevo. Usa vinculación de vistas o findViewById para encontrar ComposeView en la función onCreateView().

Obtén más información sobre la orientación de 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
}
Views.kt

Trabaja directamente con la biblioteca de Jetpack SceneCore

Compose para XR se basa en Jetpack SceneCore. Si vas a espacializar una app basada en Views, puedes seguir usando tu código de IU existente en Compose para XR o elegir trabajar directamente con el Session de Jetpack SceneCore.

Puedes compilar paneles directamente desde SceneCore con PanelEntity. Establece el tamaño del panel en metros con dimensions o en píxeles con pixelDimensions. Puedes hacer que los paneles se puedan mover o cambiar de tamaño con los componentes correspondientes. Para obtener más información, consulta Cómo agregar comportamiento común a las entidades.

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