Développer une UI pour des applications Android basées sur des vues

Essayer Compose
Jetpack Compose avec le SDK Jetpack XR est le kit d'outils d'UI recommandé pour Android XR.

L'utilisation du framework Android Jetpack Compose est le meilleur moyen de profiter des dernières avancées du développement d'UI Android et de vous assurer que votre application reste à jour avec les bonnes pratiques du secteur.

Toutefois, si vous n'avez pas effectué de migration et que vous travaillez à spatialiser une application basée sur Android Views, vous pouvez adopter plusieurs approches.

Réutiliser vos vues existantes dans SpatialPanels

Bien que les SpatialPanel fassent partie de la bibliothèque Jetpack Compose pour XR, ils acceptent également les vues. Lorsque vous utilisez setSubspaceContent dans votre MainActivity, placez une vue existante dans un SpatialPanel, comme illustré dans l'exemple suivant.

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

Utiliser les API d'interopérabilité Android Views et Compose

Consultez les conseils sur l'interopérabilité entre les vues et Compose. Cette documentation explique comment utiliser ces frameworks ensemble et contient des liens vers des exemples de code que vous pouvez utiliser.

Utiliser une ComposeView pour ajouter des panneaux spatiaux et des orbiteurs à un fragment existant

Utilisez un ComposeView dans votre mise en page XML pour ajouter des composables et créer du contenu XR. Utilisez [ViewBinding][ViewBinding] pour appeler ComposeView dans la fonction onCreateView.

En savoir plus sur les consignes concernant ComposeView

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

Travailler directement avec la bibliothèque Jetpack SceneCore

Compose pour XR est basé sur Jetpack SceneCore. Si vous spatialisez une application basée sur des vues, vous pouvez continuer à utiliser votre code d'interface utilisateur existant dans Compose pour XR ou choisir de travailler directement avec Session de Jetpack SceneCore.

Vous pouvez créer des panneaux directement à partir de SceneCore à l'aide de PanelEntity. Rendez les panneaux mobiles ou redimensionnables à l'aide de composants. Pour en savoir plus, consultez Ajouter un comportement commun aux entités.

val panelContent = MyCustomView(this)
val panelEntity = xrSession.createPanelEntity(
   panelContent,
   surfaceDimensionsPx = Dimensions(500f,500f,500f),
   dimensions = Dimensions(1f,1f,1f),
   name = "panel entity"
)