Phát triển giao diện người dùng cho ứng dụng Android dựa trên Khung hiển thị

Thử dùng Compose

Jetpack Compose sử dụng Jetpack XR SDK là bộ công cụ giao diện người dùng được đề xuất cho Android XR.

Phát triển bằng Jetpack XR SDK →

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 vẫn tuân thủ các phương pháp hay nhất trong ngành.

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

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

Mặc dù SpatialPanel là một phần của thư viện Jetpack Compose cho XR, nhưng chúng cũng chấp nhận các Thành phần 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) }
    }
}
Views.kt

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 trình bày cách sử dụng các khung này cùng nhau và chứa các đường liên kết đến mẫu mã mà bạn có thể sử dụng.

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

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

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

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 từ SceneCore bằng cách dù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 các 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 chung vào các thực thể.

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