เพิ่มพื้นที่ย่อยลงในแอป

พื้นที่ย่อยคือส่วนของพื้นที่ 3 มิติภายในแอปที่คุณวางโมเดล 3 มิติ สร้างเลย์เอาต์ 3 มิติ และเพิ่มมิติให้กับเนื้อหา 2 มิติได้ ระบบจะแสดงผลพื้นที่ย่อยก็ต่อเมื่อเปิดใช้การจัดวางเสียงเท่านั้น ใน Home Space หรือในอุปกรณ์ที่ไม่ใช่ XR ระบบจะไม่สนใจโค้ดภายในพื้นที่ย่อยนั้น

คุณสามารถใช้ @SubspaceComposable เช่น Volume และ SpatialPanel เพื่อวางโมเดล 3 มิติ คอมโพเนนต์ XR บางรายการ เช่น Orbiter หรือ SpatialDialog เป็นส่วนประกอบ 2 มิติมาตรฐานที่ใช้ได้ทุกที่ในลําดับชั้น UI 2 มิติ แต่ต้องเรียกใช้ SubspaceComposable ในเซบ์สเปซของแอป โดยจะใช้คอมโพสิเบิล Subspace

คุณสามารถเรียกใช้ Subspace ได้โดยตรงในลําดับชั้น UI 2 มิติเช่นเดียวกับคอมโพสิเบิลอื่นๆ อย่างไรก็ตาม โปรดคำนึงถึงผลที่ตามมาของตำแหน่งในลําดับชั้นที่คุณเรียกใช้ Subspace

เกี่ยวกับลําดับชั้นของพื้นที่ทำงานย่อย

พื้นที่ทำงานย่อยระดับบนสุดคือพื้นที่ทำงานย่อยด้านนอกสุดที่แอปเรียกใช้ พื้นที่ทำงานย่อยนี้ไม่มีขอบเขตที่สิ้นสุด และโดยปกติแล้วจะเป็นตําแหน่งที่คุณวางเลย์เอาต์เชิงพื้นที่และ SpatialPanel ของแอป

อย่างไรก็ตาม หากคุณฝังพื้นที่ทำงานย่อยอื่นภายในลําดับชั้น UI 2 มิติในแผงที่อยู่ในพื้นที่ทำงานย่อยระดับบนสุด พื้นที่ทำงานย่อยที่ฝังนั้นจะทํางานต่างจากเดิม

พื้นที่ทำงานย่อยที่ฝังมีความแตกต่างที่สำคัญ 2 ประการจาก Subspace ระดับบนสุด

• โดยจะอยู่ในเลย์เอาต์ 2 มิติที่เรียกใช้ ซึ่งหมายความว่าความสูงและความกว้างของพื้นที่ย่อยจะจำกัดตามความสูงและความกว้างของเลย์เอาต์หลัก 2 มิติ
• โดยจะทํางานเป็นองค์ประกอบย่อยของเอนทิตีที่เรียกใช้ ซึ่งหมายความว่าหากคุณเรียกใช้คอมโพสิเบิล Subspace ที่ฝังอยู่ภายใน SpatialPanel นั้น พื้นที่ทำงานย่อยจะเป็นส่วนหนึ่งของ SpatialPanel ที่เรียกใช้

ลักษณะการทํางานของพื้นที่ย่อยที่ซ้อนกันเหล่านี้จะเปิดใช้ความสามารถต่างๆ เช่น

• การย้ายเอนทิตีย่อยไปพร้อมกับเอนทิตีหลัก
• การปรับตำแหน่งของบุตรหลานโดยใช้ออฟเซต SubspaceModifier
• การนำเสนอวัตถุ 3 มิติที่วางอยู่เหนือ UI 2 มิติและตรงกับความสูงและความกว้างของพื้นที่ที่เหมาะสมในเลย์เอาต์ 2 มิติ

เพิ่มพื้นที่ย่อยลงในแอป

ตัวอย่างโค้ดต่อไปนี้แสดงวิธีเพิ่มพื้นที่ทำงานย่อยระดับบนสุดและที่ฝังลงในแอป

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    enableEdgeToEdge()
    setContent {
        // This is a top-level subspace
        Subspace {
            SpatialPanel {
                MyComposable()
            }
        }
    }
}
@Composable
private fun MyComposable() {
    Row {
        PrimaryPane()
        SecondaryPane()
    }
}
@Composable
private fun PrimaryPane() {
      ...
    // This is a nested subspace, because PrimaryPane is in a SpatialPanel
    // and that SpatialPanel is in a top-level Subspace
    Subspace {
        ObjectInAVolume(show3DObject)
    }
      ...
}