สารบัญ:
- ขั้นตอนที่ 1: เริ่มโครงการใหม่
- ขั้นตอนที่ 2: มาตั้งค่า Vuforia กัน
- ขั้นตอนที่ 3: เพิ่มสคริปต์ใหม่
- ขั้นตอนที่ 4: มาเพิ่มรถกันเถอะ
- ขั้นตอนที่ 5: วางรถไว้บนท้องฟ้า
- ขั้นตอนที่ 6: ประตู Lambo
- ขั้นตอนที่ 7: เล่นวิดีโอใน AR
- ขั้นตอนที่ 8: ใส่แอพในโทรศัพท์ของคุณ
วีดีโอ: Augmented Reality Vuforia 7 การตรวจจับเครื่องบินภาคพื้นดิน: 8 ขั้นตอน
2024 ผู้เขียน: John Day | [email protected]. แก้ไขล่าสุด: 2024-01-30 13:05
SDK ความเป็นจริงเสริมของ Vuforia สำหรับ Unity 3D ใช้ ARCore และ ARKit เพื่อตรวจจับระนาบพื้นใน AR บทช่วยสอนวันนี้จะใช้การผสานรวมดั้งเดิมใน Unity เพื่อสร้างแอป AR สำหรับ Android หรือ IOS เราจะให้รถตกลงมาจากฟ้าสู่พื้น และประตูจะเปิดโดยอัตโนมัติเมื่อเราเข้าใกล้ เราจะไปทำวิดีโอใน AR ด้วย ในการปฏิบัติตาม คุณจะต้องติดตั้ง Unity 3D บนคอมพิวเตอร์ของคุณ (ฟรี) คำแนะนำเหล่านี้มีไว้สำหรับผู้เริ่มต้นทั้งหมด ดังนั้นเราจะอธิบายทุกอย่างอย่างละเอียด!
ส่วนที่ดีที่สุดเกี่ยวกับ SLAM ของ Vuforia คือจำนวนอุปกรณ์ IOS และ Android ที่รองรับ รายการอุปกรณ์ทั้งหมดสามารถพบได้ที่นี่:
library.vuforia.com/articles/Solution/grou…
ขั้นตอนที่ 1: เริ่มโครงการใหม่
ดาวน์โหลด Unity 3D จากที่นี่ หากคุณยังไม่มี:
ตรวจสอบให้แน่ใจว่าได้ติดตั้งการรองรับ Vuforia Augmented Reality และ Android หรือ IOS ขึ้นอยู่กับอุปกรณ์ที่คุณมี
เปิด Unity และเริ่มโครงการ Unity ใหม่ เรียกมันว่าอะไรก็ได้ที่คุณต้องการ
อันดับแรก ให้ตั้งค่าแอปเพื่อสร้างออกมาก่อน เราจะได้ไม่ลืม ดังนั้นบันทึกฉากและเรียกมันว่า "หลัก"
ไปที่ไฟล์ สร้างการตั้งค่า และเปลี่ยนแพลตฟอร์มบิลด์ของคุณเป็น Android หรือ IOS ไปที่การตั้งค่า XR ในการตั้งค่าผู้เล่น และเลือก Vuforia Augmented Reality Supported
หากคุณใช้ Android คุณจะไม่ต้องทำอย่างอื่น แต่ใน IOS ให้ไปที่การตั้งค่าอื่นและตรวจดูให้แน่ใจว่าได้ใส่ข้อมูลบางอย่างสำหรับตัวระบุบันเดิลของคุณ ใช้รูปแบบ "com. YourCompanyName. YourAppName"
ใส่อะไรก็ได้สำหรับคำอธิบายการใช้งานกล้องและเปลี่ยนเวอร์ชันบิลด์ขั้นต่ำของเป้าหมายเป็นอย่างน้อย 9.0
ปิดแล้วมาตั้งค่าอย่างอื่นกัน
ขั้นตอนที่ 2: มาตั้งค่า Vuforia กัน
ตอนนี้เรามาตั้งค่าทุกอย่างกันเถอะ
ไปที่ gameobject ในเมนูด้านบนแล้วคลิก ARCamera ตอนนี้ลบกล้องหลักออกจากฉากของคุณ
เลือก ARCamera และทางด้านขวาในตัวตรวจสอบให้คลิกที่ Open Vuforia Configuration คลิกการรวบรวมชุดข้อมูลและยกเลิกการเลือกทุกอย่างเนื่องจากเราไม่ได้ใช้เป้าหมายรูปภาพใดๆ ที่นี่
คลิกที่ตัวติดตามอุปกรณ์และคลิกติดตามท่าทางอุปกรณ์ เปลี่ยนการติดตามจากการหมุนเป็นตำแหน่ง
กลับไปที่แท็บวัตถุของเกมแล้วคลิก Vuforia, Ground Plane และ Plane finder นี่เป็นที่เก็บสคริปต์ที่พบระนาบภาคพื้นดินของเรา
สิ่งสุดท้ายที่เราต้องการคือฉากระนาบพื้น ดังนั้นไปที่วัตถุเกมอีกครั้งในเมนูด้านบน แล้วคลิก Vuforia, Ground Plane และเลือก Ground Plane Stage ตอนนี้ทุกสิ่งที่เราทำสิ่งนี้จะปรากฏใน AR
ขั้นตอนที่ 3: เพิ่มสคริปต์ใหม่
พฤติกรรมเริ่มต้นของการตรวจจับระนาบพื้นนี้คือการวางวัตถุใหม่ทุกครั้งที่คุณกดบนหน้าจอ สิ่งที่เราต้องการคือเพียงแค่เปลี่ยนตำแหน่งวัตถุทุกครั้งที่คุณกดบนหน้าจอ คลิกขวาในโฟลเดอร์ทรัพย์สินของคุณและสร้างสคริปต์ C # ใหม่ เรียกมันว่า "DeployStageOnce" และแทนที่ทุกอย่างด้วยรหัสนี้:
การใช้ระบบ
ใช้ UnityEngine; ใช้ Vuforia; คลาสสาธารณะ DeployStageOnce: MonoBehaviour { GameObject AnchorStage สาธารณะ; PositionalDeviceTracker ส่วนตัว _deviceTracker; GameObject ส่วนตัว _previousAnchor; โมฆะสาธารณะ เริ่ม () { ถ้า (AnchorStage == null) { Debug. Log ("ต้องระบุ AnchorStage"); กลับ; } AnchorStage. SetActive (เท็จ); } โมฆะสาธารณะ Awake () { VuforiaARController. Instance. RegisterVuforiaStartedCallback (OnVuforiaStarted); } โมฆะสาธารณะ OnDestroy () { VuforiaARController. Instance. UnregisterVuforiaStartedCallback (OnVuforiaStarted); } โมฆะส่วนตัว OnVuforiaStarted () { _deviceTracker = TrackerManager. Instance. GetTracker (); } โมฆะสาธารณะ OnInteractiveHitTest (ผล HitTestResult) { if (ผลลัพธ์ == null || AnchorStage == null) { Debug. LogWarning ("การทดสอบ Hit ไม่ถูกต้องหรือไม่ได้ตั้งค่า AnchorStage"); กลับ; } var anchor = _deviceTracker. CreatePlaneAnchor(Guid. NewGuid(). ToString(), ผลลัพธ์); ถ้า (anchor != null) { AnchorStage.transform.parent = anchor.transform; AnchorStage.transform.localPosition = Vector3.zero; AnchorStage.transform.localRotation = Quaternion.identity; AnchorStage. SetActive(จริง); } ถ้า (_previousAnchor != null) { ทำลาย (_previousAnchor); } _previousAnchor = สมอ; } }
เพื่อให้แน่ใจว่าสคริปต์นี้ถูกใช้ เราจำเป็นต้องเรียกใช้ฟังก์ชัน OnInteractiveHitTest() ดังนั้น ให้กลับไปที่ Unity แล้วคลิกวัตถุเกมตัวค้นหาเครื่องบิน เปลี่ยนโหมดจากอัตโนมัติเป็นโต้ตอบ ลากสคริปต์ที่เราเพิ่งสร้างไปยังวัตถุเกมค้นหาเครื่องบิน ลบสคริปต์ ContentPositioningBehavior คุณจะเห็นจุดสำหรับวัตถุเกมในสคริปต์ DeployStageOnce ลากตัวค้นหาเครื่องบินเข้าไปที่นั่น และค้นหาสคริปต์นี้ เลือกฟังก์ชัน OnInteractiveHitTest จากด้านบนของรายการ ตอนนี้ฟังก์ชันของเราจะถูกเรียกเมื่อใดก็ตามที่ผู้ใช้คลิกบนหน้าจอ!
ขั้นตอนที่ 4: มาเพิ่มรถกันเถอะ
ดาวน์โหลดโมเดลรถยนต์ 3 มิติฟรีจากที่นี่ (ตรวจสอบให้แน่ใจว่าได้รับเวอร์ชัน.obj):
www.turbosquid.com/3d-models/max-exterior-…
ดาวน์โหลดเสียงนี้ด้วยเพราะเราจะเล่นมันเมื่อรถชนพื้น:
freesound.org/people/PaulMorek/sounds/1967…
แตกไฟล์ทั้งสองไฟล์แล้วลากไปไว้ในโฟลเดอร์ทรัพย์สินของคุณ
คลิกที่รถแล้วมองไปทางขวา เปลี่ยน Use Embedded Materials to Use External Materials(Legacy) จากเมนูแบบเลื่อนลงที่ด้านบน ตอนนี้เราจะสามารถเปลี่ยนสีของวัสดุทั้งหมดบนรถได้แล้ว
ลากรถขึ้นไปบนระนาบพื้นของคุณทำให้เป็นเด็ก เปลี่ยนมาตราส่วนเป็น.035 บน x, y และ z
ตอนนี้ไปผ่านวัตถุเกมเด็กในรถแต่ละคันและเปลี่ยนวัสดุเป็นสีใดก็ได้ที่คุณต้องการ
เพิ่มส่วนประกอบตัวถังที่แข็งแกร่งให้กับวัตถุเกมรูทของรถ และเพิ่มตัวชนกล่อง ปรับขนาดเพื่อให้ครอบคลุมทั้งรถ เพิ่มกล่อง collider ไปที่ระนาบพื้นและปรับขนาดให้กว้างกว่าระยะระนาบพื้นสองสามเท่า ด้วยวิธีนี้เราสามารถปล่อยรถลงจากท้องฟ้าและรถจะกระแทกพื้นโดยใช้เครื่องยนต์ฟิสิกส์ในตัวของ Unity
ขั้นตอนที่ 5: วางรถไว้บนท้องฟ้า
เพิ่มส่วนประกอบแหล่งกำเนิดเสียงให้กับวัตถุเกมรูทของรถ ลากเสียงรถชนไปที่จุดคลิปเสียง
ตอนนี้เราต้องสร้างสคริปต์ที่จะนำรถขึ้นไปในอากาศเมื่อผู้ใช้กดบนหน้าจอแล้วเล่นเสียงชนเมื่อรถตกลงพื้น ดังนั้น ให้คลิกขวาในโฟลเดอร์ asset และสร้างสคริปต์ C# ใหม่และเรียกมันว่า "CarController"
แทนที่รหัสทั้งหมดที่นั่นด้วยสิ่งนี้:
ใช้ System. Collections;
ใช้ System. Collections. Generic; ใช้ UnityEngine; CarController คลาสสาธารณะ: MonoBehaviour { บูลส่วนตัว soundPlayed = false; // Update ถูกเรียกหนึ่งครั้งต่อเฟรม void Update () { if (!soundPlayed && transform.localPosition.y <.05f) { soundPlayed = true; StartCoroutine (DelayPlaySound ()); } } โมฆะสาธารณะ MoveCar(){ transform.localPosition += ใหม่ Vector3 (0, 10, 0); transform.eulerAngles += ใหม่ Vector3 (5, 20, 5); soundPlayed = เท็จ; } IEnumerator DelayPlaySound () { ให้ผลตอบแทน WaitForSeconds ใหม่ (.2f); GetComponent (). เล่น (); } }
เพิ่มฟังก์ชัน MoveCar ให้กับเหตุการณ์ OnInteractiveHitTest เหมือนในภาพด้านบน ตอนนี้มันจะถูกเรียกเมื่อผู้ใช้คลิกบนหน้าจอ
ขั้นตอนที่ 6: ประตู Lambo
ดังนั้น หากคุณขยายวัตถุในเกมรถและหาประตู คุณจะสังเกตเห็นประตูทั้งสองบานเป็นตาข่ายเดียว ถ้าเราต้องการเปิดประตู ทางเลือกเดียวของเราคือประตู Lambo ที่เปิดในแนวตั้ง ในการทำงานนี้ เราต้องเปลี่ยนจุดหมุนก่อน
สร้างวัตถุเกมเปล่าที่เป็นลูกของรถ ลากประตูเข้ามาและทำให้พวกเขาเป็นลูกของวัตถุเกมใหม่นี้ ย้ายวัตถุเกมหลักไปยังจุดหมุนที่ควรจะเป็น ข้างบานพับประตู ตอนนี้ย้ายประตูเด็กกลับเข้าที่ ตอนนี้เมื่อเราหมุนพาเรนต์ของประตู จุดหมุนอยู่ในตำแหน่งที่ถูกต้อง
เรากำลังจะสร้างสคริปต์ที่เปิดประตูเมื่อคุณเข้าใกล้รถ แต่ก่อนที่เราจะทำนั้น เราต้องมีวิธี "กระตุ้น" เหตุการณ์ก่อน เพิ่มกล่อง collider ไปที่วัตถุเกมหลักที่ประตูของคุณและปรับขนาดเพื่อให้มันข้ามรถไปทั้งสองทิศทางเล็กน้อย ตรวจสอบ "isTrigger" ตอนนี้เพิ่มกล่อง collider ให้กับกล้องหลักและปรับขนาดให้เหมาะสม ตรวจสอบ "isTrigger" ด้วย เพิ่มส่วนประกอบ Rigid Body ให้กับกล้องของคุณและยกเลิกการเลือก "useGravity" เมื่อเลือกกล้องแล้ว ให้เปลี่ยนแท็กเป็น "MainCamera" ที่ด้านบนของตัวตรวจสอบ
เพิ่มสคริปต์ใหม่ชื่อ "LamboDoorBehavior" และเพิ่มโค้ดด้านล่าง ลากสคริปต์ไปที่ผู้ปกครองของประตูของคุณ
ใช้ System. Collections;
ใช้ System. Collections. Generic; ใช้ UnityEngine; LamboDoorBehavior คลาสสาธารณะ: MonoBehavior {currAngle ลอยส่วนตัว = 0; ทุ่นส่วนตัวที่ต้องการมุม = 0; // Update ถูกเรียกหนึ่งครั้งต่อเฟรม void Update () { currAngle = Mathf. LerpAngle (currAngle, requireAngle, Time.deltaTime * 3f); transform.localEulerAngles = Vector3 ใหม่ (currAngle, 0, 0); } เป็นโมฆะสาธารณะ OpenDoors () { requireAngle = 60f; } เป็นโมฆะสาธารณะ CloseDoors () { requireAngle = 0; } โมฆะ OnTriggerEnter (Collider col) { if (col. CompareTag ("MainCamera")) { OpenDoors (); } } โมฆะ OnTriggerExit (Collider col) { if (col. CompareTag ("MainCamera")) { CloseDoors (); } } }
สคริปต์นี้จะทำให้ประตูของคุณเปิดช้าเมื่อคุณปิดประตูใน AR โดยใช้ฟังก์ชัน Lerp() ในความสามัคคีซึ่งสอดแทรกระหว่างจุดสองจุด (หรือในกรณีนี้คือสองมุม)
ขั้นตอนที่ 7: เล่นวิดีโอใน AR
สิ่งสุดท้ายที่เราต้องทำคือเล่นวิดีโอใน AR
คลิกขวาที่วัตถุเกมใด ๆ ที่เป็นลูกของรถของคุณและสร้างวัตถุ 3 มิติ Quad วิธีนี้จะทำให้แน่ใจว่ารถควอดนั้นเป็นลูกของรถคุณ จัดตำแหน่งและปรับขนาดรูปสี่เหลี่ยมนี้ให้พอดีกับภายในแผงหน้าปัดรถของคุณและดูเหมือนว่ามันควรจะอยู่ที่นั่น นี่คือสิ่งที่เราจะเล่นวิดีโอ
เพิ่มองค์ประกอบเครื่องเล่นวิดีโอให้กับควอดของคุณ เปลี่ยนแหล่งที่มาเป็น URL และค้นหาฮาร์ดลิงก์ไปยังไฟล์. MP4 หรือลากไฟล์วิดีโอลงในโฟลเดอร์แอสเซทของคุณ จากนั้นลากคลิปนั้นลงในช่องว่าง หากคุณต้องการสตรีมในวิดีโอจาก URL Instragram เป็นแหล่งที่ดี คลิกขวาที่วิดีโอ Instagram ใน Google Chrome แล้วคลิกตรวจสอบ ค้นหา div ที่มีวิดีโอและคัดลอกลิงก์จากที่นั่น (ฉันมีวิธีการนี้ดังภาพด้านบน)
ตรวจสอบให้แน่ใจว่าได้ตรวจสอบลูปหากคุณต้องการให้เล่นมากกว่าหนึ่งครั้ง เพิ่มส่วนประกอบแหล่งเสียงให้กับวัตถุเกมนี้และเปลี่ยนแหล่งสัญญาณออกเป็นแหล่งเสียงในเครื่องเล่นวิดีโอ ลากแหล่งเสียงที่คุณสร้างขึ้นใหม่ลงในช่องนั้น
ในที่สุดเราก็ทำเสร็จแล้ว!
ขั้นตอนที่ 8: ใส่แอพในโทรศัพท์ของคุณ
หากคุณกำลังสร้างสำหรับ Android คุณสามารถไปที่ไฟล์และกดสร้างและเรียกใช้โดยเสียบโทรศัพท์ไว้
หากคุณกำลังสร้าง iPhone หรือ iPad ให้ดาวน์โหลด Xcode จาก App Store ลงชื่อสมัครใช้บัญชีนักพัฒนา Apple ฟรีจาก www.apple.developer.com ไปที่ไฟล์และกดสร้าง เปิดไฟล์ที่สร้างจาก Xcode แล้วเสียบโทรศัพท์ของคุณ เลือกทีมพัฒนาของคุณและกดปุ่มเล่น
คุณอาจต้องขยับกล้องไปรอบๆ เล็กน้อย แต่ให้เวลากับกล้องสักครู่แล้วแตะที่หน้าจอ แล้วคุณจะเห็นรถของคุณตกลงมาจากท้องฟ้าบนพื้น! ตอนนี้คุณสามารถเดินเข้าไปชมวิดีโอของคุณในแดชบอร์ดได้แล้ว!
ขอให้สนุกและแจ้งให้เราทราบหากคุณมีคำถามใด ๆ ในความคิดเห็น!
แนะนำ:
GlobalARgallery - Global Augmented Reality Gallery: 16 ขั้นตอน
#GlobalARgallery - Global Augmented Reality Gallery: #GlobalARgallery เป็นโอกาสสำหรับโรงเรียน (และอื่น ๆ ) ในการเชื่อมต่อแบบอะซิงโครนัสทั่วโลกและแบ่งปันประสบการณ์ งานศิลปะ เรื่องราว ไทม์ไลน์ นิทรรศการ การนำเสนอ และสิ่งอื่น ๆ ที่คุณสามารถจินตนาการได้ ทั้งหมดนี้ปรากฏใน A
อุปกรณ์โทรศัพท์ Augmented Reality: 7 ขั้นตอน
อุปกรณ์โทรศัพท์ Augmented Reality: ราคาถูก ง่าย เจ๋ง
Augmented Reality (AR) สำหรับ Dragonboard410c หรือ Dragonboard820c โดยใช้ OpenCV และ Python 3.5: 4 ขั้นตอน
Augmented Reality (AR) สำหรับ Dragonboard410c หรือ Dragonboard820c โดยใช้ OpenCV และ Python 3.5: คำแนะนำนี้จะอธิบายวิธีการติดตั้ง OpenCV, Python 3.5 และการพึ่งพาสำหรับ Python 3.5 เพื่อเรียกใช้แอปพลิเคชัน Augmented Reality
เว็บเบราว์เซอร์ Augmented Reality: 9 ขั้นตอน
เว็บเบราว์เซอร์ Augmented Reality: วันนี้เราจะมาทำเว็บเบราว์เซอร์ Augmented Reality สำหรับ Android กัน แนวคิดนี้เริ่มต้นเมื่อ ExpressVPN ขอให้ฉันสร้างวิดีโอ YouTube ที่ได้รับการสนับสนุน เนื่องจากนี่เป็นครั้งแรกของฉัน ฉันจึงอยากทำอะไรบางอย่างที่เกี่ยวข้องกับผลิตภัณฑ์ของพวกเขา ปร
แอพ Augmented Reality สำหรับผู้เริ่มต้น: 8 ขั้นตอน
แอป Augmented Reality สำหรับผู้เริ่มต้น: บทช่วยสอนนี้จะแสดงวิธีสร้างแอป Augmented Reality สำหรับผู้เริ่มต้น เราจะใช้การตรวจจับระนาบพื้นของ Unity3D และ Vuforia เพื่อสร้างแอป AR แบบไม่มีเครื่องหมายสำหรับ Android หรือ IOS เราจะดำเนินการเพิ่มโมเดล 3 มิติให้กับ Unity และย้ายไปยัง