Spatial UI für vorhandene Android-Apps erstellen, die auf Ansichten basieren

XR‑Geräte, für die der Leitfaden gilt

Dieser Leitfaden hilft Ihnen dabei, Erlebnisse für die folgenden Arten von XR-Geräten zu entwickeln.

Informationen zu XR-Gerätetypen →

Informationen zu XR-Gerätetypen →

Mit dem Android Jetpack Compose-Framework können Sie die neuesten Fortschritte in der Android-UI-Entwicklung optimal nutzen und dafür sorgen, dass Ihre Anwendung den Best Practices der Branche entspricht.

Wenn Sie noch nicht migriert sind und eine auf Android-Ansichten basierende App räumlich darstellen möchten, gibt es einige Ansätze, die Sie verfolgen können.

Compose ausprobieren

Jetpack Compose mit dem Jetpack XR SDK ist das empfohlene UI-Toolkit zum Erstellen von räumlichen Benutzeroberflächen unter Android XR.

arrow_forward

Vorhandene Ansichten in SpatialPanels wiederverwenden

SpatialPanel ist zwar Teil der Jetpack Compose for XR-Bibliothek, akzeptiert aber auch Ansichten. Wenn Sie Subspace in Ihrer MainActivity verwenden, platzieren Sie eine vorhandene Ansicht in einer SpatialPanel, wie im folgenden Beispiel gezeigt.

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

Android-Ansichten und Compose-Interoperabilitäts-APIs verwenden

Lesen Sie den Leitfaden zur Interoperabilität zwischen Ansichten und Compose. In dieser Dokumentation wird die gemeinsame Verwendung dieser Frameworks beschrieben. Außerdem finden Sie hier Links zu Codebeispielen, die Sie verwenden können.

Mit einer ComposeView räumliche Bereiche und Orbiters zu einem vorhandenen Fragment hinzufügen

Verwenden Sie in Ihrem XML-Layout ein ComposeView, um Composables hinzuzufügen und neue XR-Inhalte zu erstellen. Verwenden Sie View Binding oder findViewById, um die ComposeView in der Funktion onCreateView() zu finden.

Weitere Informationen zu den Richtlinien für 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

Direkt mit der Jetpack SceneCore-Bibliothek arbeiten

Compose for XR basiert auf Jetpack SceneCore. Wenn Sie eine auf Views basierende App räumlich darstellen, können Sie Ihren vorhandenen UI-Code in Compose for XR weiterverwenden oder stattdessen direkt mit Session von Jetpack SceneCore arbeiten.

Sie können Bereiche mit PanelEntity direkt aus SceneCore erstellen. Legen Sie die Größe des Bereichs in Metern mit dimensions oder in Pixeln mit pixelDimensions fest. Sie können die Bereiche mithilfe der entsprechenden Komponenten verschiebbar oder in der Größe anpassbar machen. Weitere Informationen finden Sie unter Entitäten allgemeines Verhalten hinzufügen.

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