आइए मेम्स के लिए एक ऑगमेंटेड रियलिटी ऐप बनाएं!: 8 कदम

2024 लेखक: John Day | [email protected]. अंतिम बार संशोधित: 2024-01-30 09:22

इस निर्देशयोग्य में हम Android और IOS के लिए Unity3D में एक संवर्धित वास्तविकता ऐप बनाने जा रहे हैं जो मेम की खोज के लिए Google API का उपयोग करता है। हम एकता में वुफोरिया के ग्राउंड प्लेन डिटेक्शन का उपयोग करने जा रहे हैं, इसलिए यह मोबाइल ऐप अधिकांश एंड्रॉइड और आईओएस उपयोगकर्ताओं के लिए काम करेगा। वुफोरिया का उपयोग करने से हमें चित्रों को एक स्थान पर लंगर डालने की भी अनुमति मिलेगी ताकि हम चित्रों के इस क्षेत्र से चल सकें और वस्तुएं वहीं रहेंगी जहां वे हैं।

हम नए आईबीएम वाटसन एपीआई का भी परीक्षण करने जा रहे हैं ताकि हम इन खोजों को अपनी आवाज से कर सकें और उनकी प्राकृतिक भाषा प्रसंस्करण का लाभ उठा सकें।

तो बुरी खबर यह है कि इनमें से कोई भी एपीआई पूरी तरह से मुफ्त नहीं है, लेकिन अच्छी खबर यह है कि वे दोनों कोशिश करने के लिए स्वतंत्र हैं। Google कस्टम खोज API आपको प्रति दिन 100 निःशुल्क खोज देता है, और IBM Watson API आपको पहला महीना निःशुल्क देता है।

संक्षेप में, यह ऐप हमारे भाषण को एकता में माइक्रोफ़ोन से प्राप्त करेगा, उसे आईबीएम वाटसन सर्वर को भेजें, जो हमें पाठ वापस कर देगा। फिर हम उस टेक्स्ट को ले लेंगे और उसे Google सर्वर को भेज देंगे जो हमें JSON फॉर्म में इमेज यूआरएल की एक सूची लौटाएगा।

चरण 1: आईबीएम वाटसन एसडीके को एकता में स्थापित करें।

वाटसन एपीआई को चालू करने के लिए आपको पहले उनकी साइट से अपनी साख प्राप्त करनी होगी। Console.bluemix.net पर जाएं, बनाएं और खाता बनाएं, और लॉग इन करें। अपने आईबीएम खाते में जाएं और क्लाउड फाउंड्री ऑर्ग्स पर नेविगेट करें और एक नया स्थान बनाएं। अब अपने डैशबोर्ड पर जाएं और सेवाओं को ब्राउज़ करने के लिए क्लिक करें, भाषण को टेक्स्ट सेवा में जोड़ें क्योंकि यही हम उपयोग करने जा रहे हैं। अपना क्षेत्र, संगठन और स्थान चुनें और प्रोजेक्ट बनाएं। अब आप सबसे नीचे अपने एपीआई क्रेडेंशियल देखेंगे।

यदि आपके पास पहले से यूनिटी नहीं है तो डाउनलोड करें और यूनिटी में एसेट स्टोर से आईबीएम वाटसन एसडीके आयात करें। हम एक खाली गेम ऑब्जेक्ट बनाकर इसका परीक्षण कर सकते हैं और इसे आईबीएम वाटसन कह सकते हैं और उदाहरण स्ट्रीमिंग स्क्रिप्ट जोड़ सकते हैं। यह स्क्रिप्ट पहले से ही ऑडियो को एकता से रिकॉर्ड करने और प्रसंस्करण के लिए वाटसन सर्वर पर भेजने के लिए तैयार है।

अभी के लिए हम इस उदाहरण स्क्रिप्ट का उपयोग करने जा रहे हैं क्योंकि हमारे पास करने के लिए बहुत कुछ है लेकिन शायद अगली बार हम वाटसन के सामान में गहराई से जा सकते हैं क्योंकि मैं विज़न एपीआई के साथ कुछ करना चाहता हूं।

चरण 2: आईबीएम वाटसन टेक्स्ट टू स्पीच का परीक्षण करें।

यह स्क्रिप्ट एक UI टेक्स्ट ऑब्जेक्ट की तलाश में है, इसलिए एक नया UI बटन बनाएं इससे हमें वह टेक्स्ट मिलेगा जिसकी हमें आवश्यकता है, हम बाद में बटन का उपयोग करेंगे। स्क्रीन के आकार के अनुसार कैनवास को स्केल पर सेट करें और बटन को थोड़ा सा आकार दें। इसे नीचे बाईं ओर एंकर करें। उस टेक्स्ट को खाली स्लॉट में ड्रैग करें। स्क्रिप्ट खोलें और हमारे आईबीएम वाटसन क्रेडेंशियल्स को जोड़ने दें, यह पता लगाएं कि "resultsField" टेक्स्ट का उपयोग कहां किया गया है और इसे केवल "alt.transscript" पर सेट करें क्योंकि हम Google को खोजने के लिए इस टेक्स्ट का उपयोग करने जा रहे हैं। अब इससे पहले कि हम इसका परीक्षण कर सकें, हमें टेक्स्ट आकार को गतिशील रूप से बनाने की आवश्यकता है ताकि हम जो कुछ भी कहें वह बॉक्स के अंदर फिट हो जाए। टेक्स्ट पर वापस जाएं और इसे बेस्ट फिट पर सेट करें। इसका परीक्षण करने के लिए कुछ पाठ टाइप करें। अब जब हम play पर क्लिक करेंगे तो हमारे शब्द वाटसन टेक्स्ट से स्पीच एपीआई तक टेक्स्ट में ट्रांसक्राइब हो जाएंगे।

चरण 3: Google कस्टम खोज API सेट करें।

अगला भाग जो हमें करने की आवश्यकता है वह है Google कस्टम खोज एपीआई को एकता में उपयोग करने के लिए स्थापित करना। उच्च स्तर पर हम एकता से Google सर्वरों के लिए एक HTTP अनुरोध करेंगे जो हमें JSON प्रारूप में एक प्रतिक्रिया देगा।

तो Google Custom Search JSON API सेट अप पेज पर जाएं, API कुंजी प्राप्त करने के लिए क्लिक करें और एक नया ऐप बनाएं। इसे खुला रखें। अब हम कंट्रोल पैनल पर जा सकते हैं। साइटों को खोजने के लिए कुछ भी डालें, इसे जो भी नाम दें, और बनाएं पर क्लिक करें।

नियंत्रण कक्ष पर क्लिक करें और कुछ संशोधन करें: हम मुख्य रूप से मेम खोजना चाहते हैं, और छवि खोज चालू करना चाहते हैं। खोज के लिए साइटों के अंतर्गत उसे संपूर्ण वेब पर स्विच करें। सब कुछ सहेजने के लिए अपडेट पर क्लिक करें।

अब गूगल एपीआई एक्सप्लोरर ढूंढें और कस्टम सर्च एपीआई पर जाएं। यह हमें Google से प्राप्त JSON प्रतिक्रिया को प्रारूपित करने की अनुमति देगा। तो अभी के लिए क्वेरी के लिए कुछ भी डालें, अपनी खोज इंजन आईडी में पेस्ट करें, फ़िल्टर के लिए 1 डालें ताकि हमें डुप्लिकेट न मिले, संख्या के तहत 10 डालें क्योंकि एक बार में हम अधिकतम परिणाम वापस कर सकते हैं, खोज प्रकार के लिए छवि डालें क्योंकि हम सब वापस लौटना चाहते हैं। शुरुआत के लिए 1 डालें, और अंत में "आइटम/लिंक" में डाल दें क्योंकि प्रत्येक आइटम के लिए हम केवल छवि लिंक चाहते हैं। अब जब आप एक्जीक्यूट पर क्लिक करेंगे तो आप देखेंगे कि हमें १० अच्छे इमेज लिंक्स मिले हैं।

अब हमें इन तस्वीरों को एकता में लाना है।

चरण 4: वुफोरिया को एकता में स्थापित करें।

चलो वुफोरिया को काम करते हैं ताकि हम उनके ग्राउंड प्लेन डिटेक्शन का लाभ उठा सकें। अपना वर्तमान दृश्य सहेजें और बिल्ड सेटिंग पर जाएं। अपने प्लेटफ़ॉर्म को Android या IOS पर स्विच करें और यदि आप IOS पर बंडल पहचानकर्ता के लिए कुछ डालते हैं, तो एक कैमरा और माइक्रोफ़ोन उपयोग विवरण जोड़ें। XR सेटिंग्स के तहत वुफोरिया ऑगमेंटेड रियलिटी सपोर्टेड चेक करें।

अब दृश्य में मुख्य कैमरा हटाएं और एक वुफोरिया ARCamera जोड़ें। कॉन्फ़िगरेशन अनुभाग पर जाएं और ट्रैकिंग मोड को स्थितिगत में बदलें। सभी डेटाबेस को अनचेक करें क्योंकि हमें उनकी आवश्यकता नहीं है।

अब एक प्लेन फ़ाइंडर जोड़ें और हमें इसके डिफ़ॉल्ट व्यवहार को ओवरराइड करने की आवश्यकता है क्योंकि हम ग्राउंड प्लेन स्टेज को केवल एक बार परिनियोजित करना चाहते हैं, इसलिए वुफोरिया वेबसाइट पर एक बार डिप्लॉय स्टेज की स्क्रिप्ट खोजें। उस स्क्रिप्ट को यूनिटी में लाएँ और पुरानी स्क्रिप्ट को हटाते हुए उसे प्लेन फ़ाइंडर पर रख दें। मोड को इंटरएक्टिव में बदलें और सुनिश्चित करें कि उस यूनिटी इवेंट में "ऑनइंटरएक्टिवहिटटेस्ट" फ़ंक्शन को कॉल किया जाता है। जब हम यहां हैं, तो हमने पहले बनाए गए बटन को सक्रिय करने के लिए सेट किया है, जब हमें ग्राउंड प्लेन मिल गया है, तो इसकी डिफ़ॉल्ट स्थिति को निष्क्रिय पर सेट करें। अब एक ग्राउंड प्लेन को सीन में डालें और इसे मिड एयर में बदलें क्योंकि हम चाहते हैं कि सभी तस्वीरें हवा में तैरें। इस ग्राउंड प्लेन को प्लेन फाइंडर के खाली स्लॉट में खींचें।

चरण 5: एक चित्र प्रीफ़ैब बनाएँ।

इससे पहले कि हम इन सभी टुकड़ों को एक साथ रखना शुरू करें, हमें एक प्रीफैब्रिकेटेड गेम ऑब्जेक्ट बनाने की जरूरत है जिसे हम हर बार एक तस्वीर लोड होने पर तुरंत चालू कर सकते हैं। तो ग्राउंड प्लेन स्टेज के नीचे एक खाली गेम ऑब्जेक्ट बनाएं और इसे "picPrefab" कहें। उस के बच्चे के रूप में एक क्वाड बनाएं और इसे 2 से स्केल करें, इसके y को 180 डिग्री तक घुमाएं ताकि माता-पिता आगे वेक्टर जो नीले तीर के रूप में दिखाया गया है वह क्वाड के सामने है।

"पिक्चरबिहेवियर" नामक एक नई स्क्रिप्ट बनाएं और इसे हमारे picPrefab में जोड़ें।

अब इस पिक प्रीफैब को अपने एसेट फोल्डर में खींचें और यही वह है जिसे हम प्रत्येक तस्वीर पर लगाने जा रहे हैं।

हमारी "पिक्चरबिहेवियर" स्क्रिप्ट इस तरह दिखनी चाहिए:

सिस्टम का उपयोग करना। संग्रह;

System. Collections. Generic का उपयोग करना; यूनिटीइंजिन का उपयोग करना; पब्लिक क्लास पिक्चर बिहेवियर: मोनोबिहेवियर { पब्लिक रेंडरर क्वाडरेंडरर; निजी वेक्टर3 वांछित स्थिति; शून्य प्रारंभ () {// कैमरा ट्रांसफॉर्म को देखें। लुकएट (Camera.main.transform); वेक्टर ३ वांछितकोण = नया वेक्टर ३ (0, परिवर्तन। स्थानीय यूलरएंगल्स। वाई, ०); ट्रांसफॉर्म.रोटेशन = क्वाटरनियन। यूलर (वांछित एंगल); // हवा में बल वांछित स्थिति = परिवर्तन। स्थानीय स्थिति; ट्रांसफॉर्म। लोकलपोजिशन + = नया वेक्टर 3 (0, 20, 0); } शून्य अद्यतन () {transform.localPosition = Vector3. Lerp (transform.localPosition, वांछित स्थिति, Time.deltaTime * 4f); } सार्वजनिक शून्य लोडइमेज (स्ट्रिंग यूआरएल) {StartCoroutine (LoadImageFromURL (url)); } IEnumerator LoadImageFromURL (स्ट्रिंग url) { WWW www = नया WWW (url); उपज वापसी www; quadRenderer.material.mainTexture = www.texture; } }

चरण 6: Google API के लिए एक स्क्रिप्ट बनाएं।

अब हमारे "picPrefab" से क्वाड रेंडरर के संदर्भ में ड्रैग करें।

हमारे पास बनाने के लिए केवल दो स्क्रिप्ट बची हैं, इसलिए GoogleService.cs और PictureFactroy.cs नामक एक C# स्क्रिप्ट बनाते हैं।

"GoogleService" के अंदर यह कोड पेस्ट करें जो हमारा अनुरोध करता है:

सिस्टम का उपयोग करना। संग्रह;

System. Collections. Generic का उपयोग करना; यूनिटीइंजिन का उपयोग करना; UnityEngine. UI का उपयोग करना; पब्लिक क्लास गूगल सर्विस: मोनोबिहेवियर { पब्लिक पिक्चर फैक्ट्री पिक्चर फैक्ट्री; सार्वजनिक टेक्स्ट बटन टेक्स्ट; निजी कॉन्स्ट स्ट्रिंग API_KEY = "यहां एपीआई कुंजी डालें !!!!!"; सार्वजनिक शून्य GetPictures () { StartCoroutine (PictureRoutine ()); } IEnumerator PictureRoutine(){ buttonText.transform.parent.gameObject. SetActive (झूठा); स्ट्रिंग क्वेरी = buttonText.text; query = WWW. EscapeURL (क्वेरी + "मेम्स"); // पुरानी छवियों को हटाएं तस्वीर फैक्ट्री। हटाएं ओल्ड पिक्चर्स (); // कैमरा फॉरवर्ड वेक्टर को सेव करें ताकि जब ऑब्जेक्ट रखे जा रहे हों तो हम इधर-उधर जा सकें // हम एक बार में केवल १० परिणाम प्राप्त कर सकते हैं, इसलिए हमें प्रत्येक १० int rowNum = १ के बाद प्रारंभ संख्या को बदलते हुए लूप करना होगा और अपनी प्रगति को सहेजना होगा; for (int i = 1; i <= 60; i += 10) { string url = "https://www.googleapis.com/customsearch/v1?q=" + query + "&cx=011535004225295624669%3Afeb1gwic6bs&filter=1&num =10&searchType=image&start=" + i + "&fields=items%2Flink&key=" + API_KEY; WWW www = नया WWW (url); उपज वापसी www; पिक्चरफैक्टरी.क्रिएटइमेज (ParseResponse(www.text), RowNum, cameraForward); पंक्ति संख्या++; } यील्ड रिटर्न नया WaitForSeconds (5f); buttonText.transform.parent.gameObject. SetActive (सच); } सूची ParseResponse (स्ट्रिंग पाठ) { सूची urlList = नई सूची (); स्ट्रिंग यूआरएल = टेक्स्ट। स्प्लिट ('\ n'); foreach (urls में स्ट्रिंग लाइन) {if (line. Contains("link")){ string url = line. Substring (12, line. Length-13); // png या jpg द्वारा फ़िल्टर करना Google से काम नहीं करता है इसलिए हम इसे यहां करते हैं: if (url. Contains (".jpg") || url. Contains (".png")) { urlList. Add (url); } } } वापसी urlList; } }

चरण 7: हमारी पिक्चर फैक्ट्री बनाएं।

PictureFactory.cs के अंदर हमारे सभी चित्र बनाने के लिए यह कोड डालते हैं और एक URL से उनकी बनावट लोड करते हैं।

सिस्टम का उपयोग करना। संग्रह;

System. Collections. Generic का उपयोग करना; यूनिटीइंजिन का उपयोग करना; पब्लिक क्लास पिक्चर फैक्ट्री: मोनोबिहेवियर {सार्वजनिक गेमऑब्जेक्ट picPrefab; सार्वजनिक GoogleService googleService; सार्वजनिक शून्य DeleteOldPictures () {if (transform.childCount> 0) {foreach (इसमें बच्चे को रूपांतरित करें। रूपांतरित करें) {नष्ट करें (child.gameObject); } } } सार्वजनिक शून्य CreateImages(ListurlList, int resultNum, Vector3 camForward){ int picNum = 1; वेक्टर ३ केंद्र = कैमरा। मुख्य। परिवर्तन। स्थिति; foreach (urlList में स्ट्रिंग url) {वेक्टर3 pos = GetPosition (picNum, resultNum, camForward); GameObject तस्वीर = तत्काल (picPrefab, स्थिति, Quaternion.identity, this.transform); pic. GetComponent ()। लोड इमेज (यूआरएल); तस्वीरनम++; } } Vector3 GetPosition (int picNum, int rowNum, Vector3 camForward){वेक्टर3 पॉज़ = वेक्टर3.शून्य; अगर (picNum <= 5) { pos = camForward + new Vector3 (picNum * -3, 0, rowNum * 3.5f); } और { pos = कैमफॉरवर्ड + नया वेक्टर ३ ((पिकनम% ५) * ३, ०, रोन्यूम * ३.५ एफ); } वापसी स्थिति; } }

चरण 8: हम कर रहे हैं

GoogleService नामक खाली गेमऑब्जेक्ट बनाएं और उस पर "GoogleSerivice" स्क्रिप्ट डालें।

"पिक्चर फैक्ट्री" स्क्रिप्ट को ग्राउंड प्लेन स्टेज पर खींचें क्योंकि हमारे सभी चित्र इस गेम ऑब्जेक्ट के बच्चों के रूप में बनाए जाने वाले हैं।

इंस्पेक्टर में उपयुक्त संदर्भों में खींचें, Google सेवा के लिए भी यही काम करें।

आखिरी चीज जो हमें करने की ज़रूरत है वह यह सुनिश्चित करती है कि हमारा "गेट पिक्चर्स" फ़ंक्शन कॉल हो। तो चलिए हमारे बटन के "ऑनक्लिक" ईवेंट पर जाते हैं और इसे वहां से कॉल करते हैं।

अब हम play पर क्लिक कर सकते हैं और इसका परीक्षण कर सकते हैं। ग्राउंड प्लेन स्टेज और बटन को सक्षम करना सुनिश्चित करें। एक शब्द बोलें, और उस टेक्स्ट पर खोज करने के लिए बटन पर क्लिक करें!

अब इस ऐप को अपने फोन में लाने के लिए, इसे प्लग इन करें और फाइल-> बिल्ड सेटिंग्स पर जाएं। हिट बिल्ड एंड रन!

मुझे टिप्पणियों में बताएं यदि आपके कोई प्रश्न हैं!