Tạo giao diện người dùng không gian cho các ứng dụng Android hiện có dựa trên Khung hiển thị

Các thiết bị XR được hỗ trợ
Hướng dẫn này giúp bạn xây dựng các trải nghiệm cho những loại thiết bị XR sau.
Tìm hiểu về các loại thiết bị XR →
Thiết bị đeo đầu XR
Kính thông minh XR có dây
Tìm hiểu về các loại thiết bị XR →

Sử dụng khung Android Jetpack Compose là cách tốt nhất để tận dụng những tiến bộ mới nhất trong quá trình phát triển giao diện người dùng Android và để xác minh rằng ứng dụng của bạn luôn cập nhật các phương pháp hay nhất trong ngành.

Tuy nhiên, nếu chưa di chuyển và đang nỗ lực tạo không gian cho một ứng dụng dựa trên Android Views, thì bạn có thể áp dụng một số phương pháp.

Sử dụng lại Khung hiển thị hiện có trong SpatialPanels

Mặc dù SpatialPanel là một phần của thư viện Jetpack Compose cho XR, nhưng thành phần này cũng chấp nhận Khung hiển thị. Khi sử dụng Subspace trong MainActivity, hãy đặt một khung hiển thị hiện có vào SpatialPanel như trong ví dụ sau.

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

Sử dụng Khung hiển thị Android và API có khả năng tương tác của Compose

Tham khảo hướng dẫn về khả năng tương tác giữa Khung hiển thị và Compose. Tài liệu này đề cập đến việc sử dụng các khung này cùng nhau và chứa các đường liên kết đến mã mẫu mà bạn có thể sử dụng.

Sử dụng ComposeView để thêm bảng điều khiển không gian và bảng điều khiển quỹ đạo vào một mảnh hiện có

Sử dụng ComposeView trong bố cục XML để thêm thành phần kết hợp và tạo nội dung XR mới. Sử dụng Liên kết khung hiển thị hoặc findViewById để tìm ComposeView trong hàm onCreateView().

Đọc thêm về hướng dẫn của 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
}

Làm việc trực tiếp với thư viện Jetpack SceneCore

Compose cho XR được xây dựng dựa trên Jetpack SceneCore. Nếu đang không gian hoá một ứng dụng dựa trên Khung hiển thị, bạn có thể tiếp tục sử dụng mã giao diện người dùng hiện có trong Compose cho XR hoặc chọn làm việc trực tiếp với Session của Jetpack SceneCore.

Bạn có thể tạo bảng điều khiển ngay trong SceneCore bằng PanelEntity. Đặt kích thước của bảng điều khiển bằng mét bằng cách sử dụng dimensions hoặc bằng pixel bằng cách sử dụng pixelDimensions. Bạn có thể chọn làm cho bảng điều khiển có thể di chuyển hoặc đổi kích thước bằng cách sử dụng các thành phần tương ứng. Để biết thêm thông tin, hãy xem phần Thêm hành vi phổ biến vào thực thể.

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