Sviluppare l'interfaccia utente per le app basate su View per Android

Prova la funzionalità Scrivi
Jetpack Compose che utilizza l'SDK Jetpack XR è il toolkit per l'interfaccia utente consigliato per Android XR.

L'utilizzo del framework Android Jetpack Compose è il modo migliore per sfruttare gli ultimi progressi nello sviluppo dell'interfaccia utente di Android e assicurarti che la tua applicazione rimanga aggiornata con le best practice del settore.

Tuttavia, se non hai eseguito la migrazione e stai lavorando per applicare la spazializzazione a un'app basata su Android Views, puoi adottare alcuni approcci.

Riutilizzare le visualizzazioni esistenti all'interno di SpatialPanels

Sebbene i SpatialPanel siano parte della libreria Jetpack Compose per XR, accettano anche le viste. Quando utilizzi setSubspaceContent in MainActivity, inserisci una vista esistente in un SpatialPanel come mostrato nell'esempio seguente.

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

Utilizzare le API di interoperabilità di Android Views e Compose

Consulta le linee guida sull'interoperabilità tra Visualizzazioni e Scrivi. Questa documentazione riguarda l'utilizzo combinato di questi framework e contiene link a esempi di codice che puoi utilizzare.

Utilizzare una ComposeView per aggiungere pannelli spaziali e orbitanti a un frammento esistente

Utilizza un elemento ComposeView nel layout XML per aggiungere composabili e creare nuovi contenuti XR. Utilizza la Visualizzazione del binding o findViewById per trovare ComposeView nella funzione onCreateView.

Scopri di più sulle indicazioni per 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
}

Lavorare direttamente con la libreria Jetpack SceneCore

Compose for XR è basato su Jetpack SceneCore. Se stai spazializzando un'app basata su Views, puoi continuare a utilizzare il codice UI esistente in Compose for XR o scegliere di lavorare direttamente con Session di Jetpack SceneCore.

Puoi creare riquadri direttamente da SceneCore utilizzando PanelEntity. Imposta le dimensioni del riquadro in metri utilizzando Dimensions o in pixel utilizzando PixelDimensions. Puoi scegliere di rendere i pannelli spostabili o ridimensionabili utilizzando i componenti corrispondenti. Per maggiori informazioni, consulta Aggiungere un comportamento comune alle entità.

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