El SDK de Android XR ahora está disponible en la Versión preliminar para desarrolladores. Deseamos obtener tus comentarios. Visita nuestra
página de asistencia para comunicarte con nosotros.
Cómo desarrollar una IU para apps basadas en objetos View de Android
Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
Prueba la forma de Compose
Jetpack Compose con el SDK de Jetpack XR es el kit de herramientas de IU recomendado para Android 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 SpatialPanel
s 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) }
}
}
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
}
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"
)
El contenido y las muestras de código que aparecen en esta página están sujetas a las licencias que se describen en la Licencia de Contenido. Java y OpenJDK son marcas registradas de Oracle o sus afiliados.
Última actualización: 2025-08-23 (UTC)
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Falta la información que necesito","missingTheInformationINeed","thumb-down"],["Muy complicado o demasiados pasos","tooComplicatedTooManySteps","thumb-down"],["Desactualizado","outOfDate","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Problema con las muestras o los códigos","samplesCodeIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 2025-08-23 (UTC)"],[],[],null,["# Develop UI for Android Views-based Apps\n\nTry the Compose way \nJetpack Compose using the Jetpack XR SDK is the recommended UI toolkit for Android XR. \n[Develop with the Jetpack XR SDK →](/develop/xr/jetpack-xr-sdk) \n\n\u003cbr /\u003e\n\nUsing the [Android Jetpack Compose framework](/jetpack/compose) is the best way to take\nadvantage of the latest advancements in Android UI development and to verify\nthat your application remains current with industry best practices.\n\nHowever, if you haven't migrated, and are working to spatialize an [Android\nViews](/develop/ui/views/layout/declaring-layout) based app, there are a few approaches you can take.\n\nReuse your existing Views within SpatialPanels\n----------------------------------------------\n\nWhile [`SpatialPanel`s](/reference/kotlin/androidx/xr/compose/subspace/package-summary#SpatialPanel(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialShape,kotlin.Function0)) are part of the Jetpack Compose for XR library, they\nalso accept Views. When using [`Subspace`](/reference/kotlin/androidx/xr/compose/spatial/package-summary#Subspace(kotlin.Function1)) in your MainActivity,\nplace an existing view into a [`SpatialPanel`](/reference/kotlin/androidx/xr/compose/subspace/package-summary#SpatialPanel(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialShape,kotlin.Function0)) as shown in the following\nexample.\n\n\n```kotlin\nsetContent {\n Subspace {\n SpatialPanel(\n modifier = SubspaceModifier.height(500.dp).width(500.dp).depth(25.dp)\n ) { MyCustomView(this@ActivityWithSubspaceContent) }\n }\n}https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/xr/src/main/java/com/example/xr/compose/Views.kt#L48-L54\n```\n\n\u003cbr /\u003e\n\nUse Android Views and Compose interoperability APIs\n---------------------------------------------------\n\nConsult [guidance on interoperability between Views and Compose](/develop/ui/compose/migrate/interoperability-apis). This\ndocumentation covers using these frameworks together and contains links to code\nsamples you can use.\n\n### Use a ComposeView to add spatial panels and orbiters to an existing fragment\n\nUse a [`ComposeView`](/reference/kotlin/androidx/compose/ui/platform/ComposeView) in your XML layout to add Composables and create new XR\ncontent. Use [View binding](/topic/libraries/view-binding) or [`findViewById`](/reference/android/view/View#findViewById(int)) to find the\n[`ComposeView`](/reference/kotlin/androidx/compose/ui/platform/ComposeView) in the [`onCreateView()`](/reference/android/app/Fragment#onCreateView(android.view.LayoutInflater,%20android.view.ViewGroup,%20android.os.Bundle)) function.\n\n[Read more about `ComposeView` guidance](/develop/ui/compose/migrate/interoperability-apis/compose-in-views#compose-in-fragments).\n\n\n```kotlin\noverride fun onCreateView(\n inflater: LayoutInflater,\n container: ViewGroup?,\n savedInstanceState: Bundle?\n): View {\n val view = inflater.inflate(R.layout.example_fragment, container, false)\n view.findViewById\u003cComposeView\u003e(R.id.compose_view).apply {\n // Dispose of the Composition when the view's LifecycleOwner\n // is destroyed\n setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed)\n setContent {\n // In Compose world\n SpatialPanel(SubspaceModifier.height(500.dp).width(500.dp)) {\n Text(\"Spatial Panel with Orbiter\")\n }\n }\n }\n return view\n}https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/xr/src/main/java/com/example/xr/compose/Views.kt#L61-L79\n```\n\n\u003cbr /\u003e\n\nWork directly with the Jetpack SceneCore library\n------------------------------------------------\n\n[Compose for XR](/develop/xr/jetpack-xr-sdk#jetpack-compose) is built on top of [Jetpack SceneCore](/develop/xr/jetpack-xr-sdk#jetpack-scenecore). If you are\nspatializing a Views based app, you may continue to use your existing UI code\nwithin Compose for XR or choose to work directly with Jetpack SceneCore's\n[`Session`](/reference/kotlin/androidx/xr/runtime/Session) instead.\n\nYou can build panels directly from SceneCore using [`PanelEntity`](/reference/kotlin/androidx/xr/scenecore/PanelEntity). Set the\nsize of the panel in meters using [`dimensions`](/reference/kotlin/androidx/xr/scenecore/PanelEntity#create(androidx.xr.runtime.Session,android.view.View,androidx.xr.runtime.math.FloatSize2d,kotlin.String,androidx.xr.runtime.math.Pose)), or in pixels using\n[`pixelDimensions`](/reference/kotlin/androidx/xr/scenecore/PanelEntity#create(androidx.xr.runtime.Session,android.view.View,androidx.xr.runtime.math.IntSize2d,kotlin.String,androidx.xr.runtime.math.Pose)). You can choose to make the panels movable or resizable\nby using the corresponding components. For more information, see [Add common\nbehavior to entities](/develop/xr/jetpack-xr-sdk/work-with-entities#add-common).\n\n\n```kotlin\nval panelContent = MyCustomView(this)\nval panelEntity = PanelEntity.create(\n session = xrSession,\n view = panelContent,\n pixelDimensions = IntSize2d(500, 500),\n name = \"panel entity\"\n)https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/xr/src/main/java/com/example/xr/compose/Views.kt#L85-L91\n```\n\n\u003cbr /\u003e"]]