การใช้เฟรมเวิร์ก Android Jetpack Compose เป็นวิธีที่ดีที่สุดในการใช้ประโยชน์จากการพัฒนา UI ของ Android เวอร์ชันล่าสุด และช่วยให้แอปพลิเคชันของคุณทันสมัยตามแนวทางปฏิบัติแนะนำของอุตสาหกรรม
อย่างไรก็ตาม หากคุณยังไม่ได้ย้ายข้อมูลและกำลังทํางานเพื่อจัดวางแอปที่อิงตาม Android Views ให้เป็นแบบพื้นที่ คุณจะทําได้ 2 วิธีดังนี้
ใช้มุมมองที่มีอยู่ซ้ำภายใน SpatialPanel
แม้ว่า SpatialPanel
จะเป็นส่วนหนึ่งของไลบรารี Jetpack Compose สำหรับ XR แต่ SpatialPanel
ก็ยอมรับ Views ด้วย เมื่อใช้ setSubspaceContent
ใน MainActivity ให้วางมุมมองที่มีอยู่ไว้ใน SpatialPanel
ดังที่แสดงในตัวอย่างต่อไปนี้
setSubspaceContent {
SpatialPanel(
view = MyCustomView(this),
modifier = SubspaceModifier.height(500.dp).width(500.dp).depth(25.dp)
)
}
ใช้ API การทํางานร่วมกันของ Android Views และ Compose
โปรดดูคําแนะนําเกี่ยวกับความสามารถในการทํางานร่วมกันระหว่าง Views กับ Compose เอกสารประกอบนี้ครอบคลุมการใช้เฟรมเวิร์กเหล่านี้ร่วมกันและมีลิงก์ไปยังตัวอย่างโค้ดที่คุณใช้ได้
ใช้ ComposeView เพื่อเพิ่มแผงเชิงพื้นที่และภาพโคจรไปยังส่วนที่อยู่แล้ว
ใช้ ComposeView
ในเลย์เอาต์ XML เพื่อเพิ่ม Composable และสร้างเนื้อหา XR ใหม่ ใช้ [ViewBinding
][ViewBinding] เพื่อเรียกใช้ ComposeView
ในฟังก์ชัน onCreateView
อ่านข้อมูลเพิ่มเติมเกี่ยวกับคำแนะนำสำหรับ 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
}
}
ทำงานร่วมกับไลบรารี Jetpack SceneCore โดยตรง
Compose สำหรับ XR สร้างขึ้นจาก Jetpack
SceneCore หากกำลังจัดวางแอปตามมุมมองให้เป็นเชิงพื้นที่ คุณอาจใช้โค้ด UI ที่มีอยู่ภายใน Compose for XR ต่อ หรือเลือกที่จะทํางานกับ Session
ของ Jetpack SceneCore โดยตรงแทนก็ได้
คุณสร้างแผงจาก SceneCore ได้โดยตรงโดยใช้ PanelEntity
ทำให้แผงย้ายตำแหน่งหรือปรับขนาดได้โดยใช้คอมโพเนนต์ โปรดดูข้อมูลเพิ่มเติมที่หัวข้อเพิ่มลักษณะการทำงานทั่วไปให้กับเอนทิตี
val panelContent = MyCustomView(this)
val panelEntity = xrSession.createPanelEntity(
panelContent,
surfaceDimensionsPx = Dimensions(500f,500f,500f),
dimensions = Dimensions(1f,1f,1f),
name = "panel entity"
)