ऑर्बिटर

इस्तेमाल किए जा सकने वाले XR डिवाइस
इन दिशा-निर्देशों से आपको इस तरह के एक्सआर डिवाइसों के लिए अनुभव तैयार करने में मदद मिलती है.
एक्सआर हेडसेट
वायर वाले एक्सआर स्मार्ट ग्लास

Orbiter एक स्पेशलाइज़ किया गया कॉम्पोनेंट है. इसे किसी मिलते-जुलते स्पेशल पैनल या स्पेशल लेआउट कॉम्पोनेंट से अटैच किया जा सकता है. जैसे, SpatialColumn, SpatialRow या SpatialBox. ऑर्बिटर में आम तौर पर, उस इकाई से जुड़े नेविगेशन और काम की कार्रवाई वाले आइटम होते हैं जिससे उसे ऐंकर किया गया है. उदाहरण के लिए, अगर आपने वीडियो कॉन्टेंट दिखाने के लिए कोई स्पेशल पैनल बनाया है, तो ऑर्बिटर में वीडियो प्लेबैक कंट्रोल जोड़े जा सकते हैं.

पहली इमेज.: ऑर्बिटर का उदाहरण.

ऑर्बिटर बनाना

यहां दिए गए उदाहरण के मुताबिक, SpatialPanel में 2D लेआउट के अंदर ऑर्बिटर को कॉल करें, ताकि नेविगेशन जैसे उपयोगकर्ता कंट्रोल को रैप किया जा सके. ऐसा करने से, वे आपके 2D लेआउट से अलग हो जाते हैं और आपके कॉन्फ़िगरेशन के हिसाब से, स्पेशल पैनल से जुड़ जाते हैं.

Subspace {
    SpatialPanel(
        SubspaceModifier
            .height(824.dp)
            .width(1400.dp)
            .resizable()
            .movable(),
    ) {
        SpatialPanelContent()
        OrbiterExample()
    }
}

@Composable
fun OrbiterExample() {
    Orbiter(
        position = OrbiterPosition.BottomCenter(
            verticalEdgeAlignment = OrbiterPosition.EdgeAlignment.Outside,
            offset = DpVolumeOffset(y = 96.dp)
        ),
    ) {
        Surface(Modifier.clip(CircleShape)) {
            Row(
                Modifier
                    .background(color = Color.Black)
                    .height(100.dp)
                    .width(600.dp),
                horizontalArrangement = Arrangement.Center,
                verticalAlignment = Alignment.CenterVertically
            ) {
                Text(
                    text = "Orbiter",
                    color = Color.White,
                    fontSize = 50.sp
                )
            }
        }
    }
}

कोड के बारे में अहम बातें

  • ऑर्बिटर, स्पेशल यूआई कॉम्पोनेंट होते हैं. इसलिए, कोड को 2D या 3D लेआउट में फिर से इस्तेमाल किया जा सकता है. 2D लेआउट में, आपका ऐप्लिकेशन सिर्फ़ ऑर्बिटर के अंदर मौजूद कॉन्टेंट को रेंडर करता है. साथ ही, ऑर्बिटर को अनदेखा करता है.
  • ऑर्बिटर को इस्तेमाल और डिज़ाइन करने के तरीके के बारे में ज़्यादा जानने के लिए, डिज़ाइन से जुड़े हमारे दिशा-निर्देश देखें.

स्पेशल पैनल और लेआउट में ऑर्बिटर ऐंकर करना

ऑर्बिटर को SpatialPanel और Compose में बताए गए स्पेशल लेआउट कॉम्पोनेंट से ऐंकर किया जा सकता है. इसके लिए, यूज़र इंटरफ़ेस (यूआई) एलिमेंट के स्पेशल लेआउट में ऑर्बिटर का एलान करना होता है. जैसे, SpatialRow, SpatialColumn या SpatialBox. ऑर्बिटर, उस पैरंट से जुड़ता है जो आपके बताए गए पैरंट के सबसे नज़दीक होता है.

ऑर्बिटर का व्यवहार इस बात से तय होता है कि आपने इसे कहां डिक्लेयर किया है:

  • SpatialPanel में रैप किए गए 2D लेआउट में (जैसा कि पिछले कोड स्निपेट में दिखाया गया है), ऑर्बिटर उस SpatialPanel से ऐंकर होता है.
  • Subspace में, ऑर्बिटर सबसे नज़दीकी पैरंट इकाई से ऐंकर होता है. यह वह स्पेसियल लेआउट होता है जिसमें ऑर्बिटर को तय किया जाता है.

यहां दिए गए उदाहरण में, ऑर्बिटर को स्पेशल रो में ऐंकर करने का तरीका बताया गया है:

Subspace {
    SpatialRow {
        Orbiter(
            position = OrbiterPosition.TopCenter(
                verticalEdgeAlignment = OrbiterPosition.EdgeAlignment.Outside,
                offset = DpVolumeOffset(y = 8.dp)
            ),
            shape = SpatialRoundedCornerShape(size = CornerSize(50))
        ) {
            Text(
                "Hello World!",
                style = MaterialTheme.typography.titleMedium,
                modifier = Modifier
                    .background(Color.White)
                    .padding(16.dp)
            )
        }
        SpatialPanel(
            SubspaceModifier
                .height(824.dp)
                .width(1400.dp)
        ) {
            Box(
                modifier = Modifier
                    .background(Color.Red)
            )
        }
        SpatialPanel(
            SubspaceModifier
                .height(824.dp)
                .width(1400.dp)
        ) {
            Box(
                modifier = Modifier
                    .background(Color.Blue)
            )
        }
    }
}

कोड के बारे में अहम बातें

  • जब किसी ऑर्बिटर को 2D लेआउट के बाहर तय किया जाता है, तो ऑर्बिटर अपनी सबसे नज़दीकी पैरंट इकाई से ऐंकर हो जाता है. इस मामले में, ऑर्बिटर उस SpatialRow के सबसे ऊपर ऐंकर होता है जिसमें इसे तय किया गया है.
  • SpatialRow, SpatialColumn, SpatialBox जैसे स्पेशल लेआउट में, बिना कॉन्टेंट वाली इकाइयां होती हैं. इसलिए, स्पेशल लेआउट में एलान किया गया ऑर्बिटर, उस लेआउट से जुड़ जाता है.