अपने ऐप्लिकेशन में 3D मॉडल को पसंद के मुताबिक बनाना

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

किसी 3D मॉडल को पसंद के मुताबिक बनाने से पहले, आपको उसे अपने ऐप्लिकेशन में जोड़ना होगा. अपने ऐप्लिकेशन में 3D मॉडल जोड़ने के बाद, उसे दिखने और हिलने-डुलने के तरीके को पसंद के मुताबिक बनाया जा सकता है. इससे, विज़ुअल और इंटरैक्टिव अनुभव को बेहतर बनाया जा सकता है.

उदाहरण के लिए, एम्बेड किए गए glTF ऐनिमेशन चलाए और कंट्रोल किए जा सकते हैं. साथ ही, आपके मॉडल को बनाने वाले नोड ऐक्सेस किए जा सकते हैं और उन्हें एक जगह से दूसरी जगह ले जाया जा सकता है. इसके अलावा, कस्टम टेक्सचर लोड किए जा सकते हैं और इंटरनल मेश को बदलने के लिए, मटीरियल प्रॉपर्टी तय की जा सकती हैं. इन सुविधाओं की मदद से, रनटाइम में किसी ऑब्जेक्ट के लुक और व्यवहार में डाइनैमिक तरीके से बदलाव किया जा सकता है.

Android XR में 3D ऑब्जेक्ट

Jetpack XR SDK, 3D मॉडल के लिए Khronos Group के glTF 2.0 ओपन स्टैंडर्ड के साथ काम करता है. साथ ही, glTF 2.0 स्टैंडर्ड में बताई गई फ़िज़िकली बेस्ड रेंडरिंग (पीबीआर) तकनीकों का इस्तेमाल करके, इन ऑब्जेक्ट को रेंडर करता है. इसके अलावा, यह एक्सटेंशन के साथ भी काम करता है. glTF (ग्राफ़िक्स लाइब्रेरी ट्रांसमिशन फ़ॉर्मैट), 3D सीन और मॉडल को ट्रांसमिट और लोड करने के लिए इस्तेमाल किया जाने वाला स्टैंडर्ड फ़ाइल फ़ॉर्मैट है. glTF मॉडल, इंटरनल कॉम्पोनेंट के हैरारिकल स्ट्रक्चर से बना होता है.

यहां कुछ मुख्य कॉम्पोनेंट दिए गए हैं:

  • नोड: इनसे मॉडल के स्ट्रक्चर और क्रम के बारे में पता चलता है. हर नोड की अपनी पोज़िशन, रोटेशन, और स्केल हो सकती है.
  • मेश: यह स्ट्रक्चरल, 3D जियॉमेट्री होती है. इससे 3D ऑब्जेक्ट की शेप बनती है.
  • मटीरियल: ये मेश के विज़ुअल अपीयरेंस को तय करते हैं. जैसे, उनका रंग, खुरदरापन या वे रोशनी पर कैसी प्रतिक्रिया देते हैं.
  • टेक्सचर: यह एक इमेज ऐसेट होती है. जैसे, PNG फ़ाइल. इसका इस्तेमाल 3D मॉडल की सतह पर किया जा सकता है. इससे कस्टम पैटर्न, रंग, बारीकियां या अन्य विज़ुअल इफ़ेक्ट बनाए जा सकते हैं.

XR के लिए Jetpack Compose में, इन फ़ाइलों को SpatialGltfModel का इस्तेमाल करके रेंडर किया जाता है. साथ ही, SpatialGltfModelState का इस्तेमाल करके, इसके लोड होने की स्थिति को ट्रैक किया जाता है. ज़्यादा जानकारी के लिए, अपने ऐप्लिकेशन में 3D मॉडल जोड़ना लेख पढ़ें.

नोड में बदलाव करना: पोज़ और रोटेशन

किसी मॉडल के कुछ हिस्सों में बदलाव करने और उसकी प्रॉपर्टी बदलने के लिए, आपको SpatialGltfModelState का इस्तेमाल करके, glTF मॉडल के इंटरनल nodes को क्वेरी करना होगा. जैसे, रोटेशन या पोज़.

// Retrieve the list of nodes (individual components/meshes) defined within the glTF model.
val entityNodes = modelState.nodes

// Find a specific node by name to apply modifications, such as material overrides.
val node = entityNodes.find { it.name == "node_name" }

सही नोड ढूंढने के बाद, इसकी localPose प्रॉपर्टी सेट करके, इसकी 3D पोज़िशन और रोटेशन को इसके पैरंट GltfModelNode के हिसाब से बदला जा सकता है. इसके अलावा, modelPose का इस्तेमाल करके, इसकी पोज़िशन को GltfModelEntity रूट के हिसाब से सेट किया जा सकता है. इसी तरह, localScale/modelScale का इस्तेमाल करके, मॉडल के स्केल को उसके पैरंट या रूट के हिसाब से बदला जा सकता है.

LaunchedEffect(node, degrees) {
    val rotation = Quaternion.fromEulerAngles(degrees, 0f, degrees)
    node?.let {
        it.localPose = Pose(it.localPose.translation, rotation)
    }
}

अपने 3D मॉडल के मटीरियल की प्रॉपर्टी को पसंद के मुताबिक बनाना

रनटाइम के दौरान, मटीरियल एट्रिब्यूट में बदलाव किया जा सकता है. इससे, उपयोगकर्ता के इनपुट या ऐप्लिकेशन की मौजूदा स्थिति के आधार पर, किसी ऑब्जेक्ट की बनावट को डाइनैमिक तरीके से बदला जा सकता है.

Jetpack XR में, इन मटीरियल को बनाने और उनमें बदलाव करने के लिए, KhronosPbrMaterial और KhronosUnlitMaterial क्लास का इस्तेमाल किया जाता है. नाम से पता चलता है कि KhronosUnlitMaterials में रोशनी नहीं होती है. साथ ही, सीन की रोशनी का इन पर कोई असर नहीं पड़ता. KhronosPbrMaterial की मदद से, कई प्रॉपर्टी को पसंद के मुताबिक बनाया जा सकता है. जैसे, चमक का रंग, कोई ऑब्जेक्ट कितना मेटैलिक या खुरदरा है, और क्या वह रोशनी देता है.

Android XR में काम करने वाली हर प्रॉपर्टी और पसंद के मुताबिक बनाए जा सकने वाले पैरामीटर के बारे में ज़्यादा जानने के लिए, हमारा रेफ़रंस दस्तावेज़ देखें. इन प्रॉपर्टी को बेहतर तरीके से समझने के लिए, Khronos की शब्दावली देखें.

पहली इमेज. 3D मॉडल पर बेस कलर बदलने का उदाहरण.

अपने 3D मॉडल की मटीरियल प्रॉपर्टी को पसंद के मुताबिक बनाने के लिए, सबसे पहले KhronosPbrMaterial का इस्तेमाल करके नया मटीरियल बनाएं. आपको अपनी पसंद के मुताबिक विज़ुअल बनाने के लिए, सही AlphaMode सेट करना होगा:

इसके बाद, उन प्रॉपर्टी को तय करें जिनमें आपको बदलाव करना है. इस उदाहरण में, setBaseColorFactor का इस्तेमाल करके, मेश के बेस कलर को बैंगनी रंग में बदला गया है. इस तरीके के लिए Vector4 की ज़रूरत होती है. इसमें x, y, z और w कॉम्पोनेंट, RGBA (लाल, हरा, नीला, और ऐल्फ़ा) वैल्यू के हिसाब से होते हैं:

// Maintain a reference to the custom material to avoid re-creating it on every recomposition.
var pbrMaterial by remember { mutableStateOf<KhronosPbrMaterial?>(null) }

// Create and apply the custom material once the session is ready and the target node is available.
LaunchedEffect(node) {
    val material = KhronosPbrMaterial.create(
        session = xrSession,
        alphaMode = AlphaMode.OPAQUE
    ).also {
        pbrMaterial = it
        // Apply a base color factor (RGBA) to change the color of the model.
        it.setBaseColorFactor(
            Vector4(
                x = 0.5f,
                y = 0.0f,
                z = 0.5f,
                w = 1.0f
            )
        )
    }

अपने 3D मॉडल के लिए कस्टम टेक्सचर लोड करना

Texture एक इमेज ऐसेट होती है. इसे 3D मॉडल की सतह पर लागू किया जा सकता है, ताकि रंग, जानकारी या सतह की अन्य जानकारी दी जा सके. Jetpack XR Texture API की मदद से, इमेज डेटा लोड किया जा सकता है. जैसे, PNG फ़ाइलों को आपके ऐप्लिकेशन के /assets/ फ़ोल्डर से एसिंक्रोनस तरीके से लोड किया जा सकता है.

टेक्स्चर लोड करते समय, TextureSampler तय किया जा सकता है. इससे यह कंट्रोल किया जा सकता है कि टेक्स्चर कैसे रेंडर होगा. सैंपलर, फ़िल्टर करने की प्रॉपर्टी तय करता है. इनका इस्तेमाल तब किया जाता है, जब टेक्सचर अपने ओरिजनल साइज़ से छोटा या बड़ा दिखता है. साथ ही, यह रैपिंग मोड तय करता है. इनका इस्तेमाल, स्टैंडर्ड [0, 1] रेंज से बाहर के कोऑर्डिनेट को मैनेज करने के लिए किया जाता है. किसी 3D मॉडल पर विज़ुअल इफ़ेक्ट डालने के लिए, KhronosPbrMaterial को Texture असाइन करना ज़रूरी है.

दूसरी इमेज. 3D मॉडल के टेक्सचर को बदलने का उदाहरण.

कस्टम टेक्सचर लोड करने के लिए, आपको सबसे पहले इमेज फ़ाइल को अपने /assets/ फ़ोल्डर में सेव करना होगा. सबसे सही तरीका यह है कि आप उस फ़ोल्डर में भी एक textures सबडायरेक्ट्री बनाएं.

फ़ाइल को सही डायरेक्ट्री में सेव करने के बाद, Texture एपीआई की मदद से टेक्सचर बनाएं. अगर ज़रूरत हो, तो यहां वैकल्पिक TextureSampler भी लागू किया जा सकता है.

इस उदाहरण में, ऑक्लूज़न टेक्सचर लागू किया गया है और ऑक्लूज़न की इंटेंसिटी सेट की गई है:

LaunchedEffect(node) {
    val material = KhronosPbrMaterial.create(
        session = xrSession,
        alphaMode = AlphaMode.OPAQUE
    ).also {
        pbrMaterial = it

        // Load a texture
        val texture = Texture.create(
            session = xrSession,
            path = Path("textures/texture_name.png")
        )

        // Set the texture and configure occlusion to define how the material surface handles ambient lighting.
        it.setOcclusionTexture(
            texture = texture,
            strength = 1.0f
        )
    }
    node?.setMaterialOverride(
        material = material
    )
}

अपने 3D ऑब्जेक्ट में मटीरियल और टेक्सचर जोड़ना

नया मटीरियल या टेक्स्चर लागू करने के लिए, अपने glTF node पर मौजूद किसी नोड के लिए, मौजूदा मटीरियल को बदलें. इसके लिए, setMaterialOverride को कॉल करें:

node?.setMaterialOverride(
    material = material
)

नए बनाए गए मटीरियल को हटाने के लिए, पहले से बदले गए नोड पर clearMaterialOverride कॉल करें. इससे आपका 3D मॉडल अपनी डिफ़ॉल्ट स्थिति में वापस आ जाता है:

if (removeMaterial) {
    node?.clearMaterialOverride()
}

3D मॉडल को ऐनिमेट करना

3D मॉडल में एम्बेड किए गए ऐनिमेशन हो सकते हैं. इंटरनल तौर पर, ऐनिमेशन में सैंपलर का इस्तेमाल किया जाता है. इससे किसी मूवमेंट की टाइमिंग और वैल्यू तय की जाती हैं. साथ ही, चैनल का इस्तेमाल किया जाता है. इससे उन मूवमेंट को अलग-अलग नोड और मेश से कनेक्ट किया जाता है. Jetpack XR SDK में, KHR_animation_pointer glTF एक्सटेंशन की मदद से बनाए गए स्केलेटल ऐनिमेशन और मटीरियल ऐनिमेशन काम करते हैं.

ऐनिमेशन को सिर्फ़ SceneCore के GltfAnimation का इस्तेमाल करके कंट्रोल किया जा सकता है. इसके लिए, GltfModelEntity का इस्तेमाल करना ज़रूरी है. इस इकाई को Compose for XR लेआउट में जोड़ने के लिए, आपको SpatialGltfModel के बजाय SceneCoreEntity का इस्तेमाल करना होगा.

अपने GltfModelEntity में मौजूद animations की सूची से, किसी ट्रैक का नाम डालें. ऐनिमेशन चलाने की सुविधा को कंट्रोल करने के लिए, GltfAnimationStartOptions का इस्तेमाल करें. इसके अलावा, स्पीड, सीक टाइम, और यह भी तय किया जा सकता है कि ऐनिमेशन लूप में चलना चाहिए या नहीं:

val animation = gltfEntity.getAnimations().find { it.name == "Walk" }
animation?.start(GltfAnimationStartOptions(shouldLoop = true))


glTF और glTF का लोगो, Khronos Group Inc. के ट्रेडमार्क हैं.