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ử cách dùng Compose
Jetpack Compose sử dụng SDK Jetpack XR là bộ công cụ giao diện người dùng được đề xuất cho Android XR.

Sử dụng khung Android Jetpack Compose là cách tốt nhất để tận dụng các tiến bộ mới nhất trong quá trình phát triển giao diện người dùng Android và đảm bảo ứng dụng của bạn luôn tuân theo 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, 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 chúng cũng chấp nhận Khung hiển thị. Khi sử dụng setSubspaceContent trong MainActivity, hãy đặt một thành phần hiển thị hiện có vào SpatialPanel như trong ví dụ sau.

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

Sử dụng Khung hiển thị Android và API có khả năng tương tác với 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ã bạn có thể sử dụng.

Sử dụng ComposeView để thêm bảng điều khiển không gian và vệ tinh 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 [ViewBinding][ViewBinding] để gọi 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.fragment_first, container, false)
   val composeView = view.findViewById<ComposeView>(R.id.compose_view)
   composeView.apply {
       // Dispose of the Composition when the view's LifecycleOwner
       // is destroyed
       setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed)
       setContent {
           // In Compose world
           Orbiter(
               position = Edge.Top,
               offset = 10.dp,
               alignment = Alignment.End
           ) {
               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 for XR được xây dựng dựa trên Jetpack SceneCore. Nếu đang tạo không gian cho 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 trực tiếp từ SceneCore bằng cách sử dụng PanelEntity. Tạo các bảng điều khiển có thể di chuyển hoặc thay đổi kích thước bằng cách sử dụng các thành phần. Để biết thêm thông tin, hãy xem phần Thêm hành vi phổ biến vào các thực thể.

val panelContent = MyCustomView(this)
val panelEntity = xrSession.createPanelEntity(
   panelContent,
   surfaceDimensionsPx = Dimensions(500f,500f,500f),
   dimensions = Dimensions(1f,1f,1f),
   name = "panel entity"
)