為以 Android View 為基礎的應用程式開發 UI

試試 Compose 的方式

使用 Jetpack XR SDK 的 Jetpack Compose 是 Android XR 的推薦 UI 工具包。

使用 Jetpack XR SDK 進行開發 →

使用 Android Jetpack Compose 架構是充分利用 Android UI 開發最新進展的最佳方式，可確保應用程式持續採用業界最佳做法。

不過，如果您尚未遷移，且正在將以 Android 檢視畫面 為基礎的應用程式轉為空間化，則可以採用幾種方法。

在 SpatialPanel 中重複使用現有的 View

雖然 SpatialPanel 是 XR 程式庫 Jetpack Compose 的一部分，但也接受 View。在 MainActivity 中使用 setSubspaceContent 時，請將現有檢視畫面放入 SpatialPanel，如以下範例所示。

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

使用 Android View 和 Compose 互通性 API

請參閱View 和 Compose 之間互通性的指南。本文件說明如何同時使用這些架構，並提供可用的程式碼範例連結。

使用 ComposeView 將空間面板和軌道器新增至現有片段

在 XML 版面配置中使用 ComposeView，即可新增可組合函式並建立新的 XR 內容。使用檢視畫面繫結或 findViewById 找出 onCreateView 函式中的 ComposeView。

進一步瞭解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

直接使用 Jetpack SceneCore 程式庫

Compose for XR 以 Jetpack SceneCore 為基礎。如果您要將以 View 為基礎的應用程式轉為空間化，可以繼續使用 Compose for XR 中的現有 UI 程式碼，也可以選擇直接使用 Jetpack SceneCore 的 Session。

您可以使用 PanelEntity 直接從 SceneCore 建構面板。使用元件讓面板可移動或調整大小。詳情請參閱「為實體新增常見行為」。

val panelContent = MyCustomView(this)
val panelEntity = PanelEntity.create(
    session = xrSession,
    view = panelContent,
    surfaceDimensionsPx = Dimensions(500f, 500f),
    dimensions = Dimensions(1f, 1f, 1f),
    name = "panel entity"
)
Views.kt