Mit der AR Foundation von Unity ein AR-Spiel erstellen

1. Übersicht

ARCore ist das Framework von Google zum Erstellen von Augmented Reality-Funktionen auf Smartphones. Mit der AR Foundation von Unity können Sie plattformübergreifende AR-Apps erstellen.

Aufgaben

In diesem Codelab entwickeln Sie mit AR Foundation ein einfaches Spiel. Ziel des Spiels ist es, Pakete mit einem Auto zu sammeln, das du über dein Handheld steuerst.

In einer vollständig virtuellen Welt wird dies jedoch nicht passieren. Du mischst physische Atome und digitale Bits, um eine neue Art von Spielerlebnis zu schaffen, indem du ein Spiel entwickelst, das die Umgebung des Spielers versteht.

Am Ende dieses Codelabs kannst du mit deinem Spiel Folgendes tun:

• Damit lassen sich reale Flugzeuge erkennen und ein Spielfeld darüber zeichnen.
• Wirf Strahlen aus dem Sichtfeld der Kamera aus und erkennt Schnittpunkte mit Ebenen.
• Reagiere auf reale Lichtverhältnisse, um dein Spiel noch realistischer zu gestalten.

Lerninhalte

• Hier erfahren Sie, wie Sie ein Projekt einrichten, das die AR Foundation von Unity verwendet.
• So abonnieren Sie mit ARPlaneManager neue Flugzeuge.
• Raycast verwenden, um Schnittpunkte mit virtueller Geometrie zu finden
• Mit ARLightEstimationData eine Szene ausleuchten

Voraussetzungen

• Ein unterstütztes ARCore-Gerät, das über ein USB-Kabel mit dem Entwicklungscomputer verbunden ist.
• Google Play-Dienste für AR 1.23 oder höher.
• Eine Installation von Unity Hub oder Unity 2020 LTS

2. Entwicklungsumgebung einrichten

In diesem Schritt bereiten Sie Ihre Umgebung auf die Entwicklung mit der AR Foundation von Unity vor.

Prüfen, ob Ihr Gerät mit AR kompatibel ist

Die AR-Funktionen auf Android-Geräten basieren auf ARCore, das auf von ARCore unterstützten Geräten verfügbar ist. Prüfen Sie, ob Ihr Entwicklungsgerät mit AR kompatibel ist. Alternativ können Sie eine korrekt konfigurierte AR-kompatible Android-Emulator-Instanz verwenden.

USB-Debugging auf Ihrem Gerät einrichten

Damit Sie Debug-Apps ausführen können, müssen Sie die Entwickleroptionen auf Ihrem Gerät aktivieren. Weitere Informationen finden Sie in der Android-Dokumentation unter Entwickleroptionen und USB-Debugging aktivieren.

Unity (2020.3 LTS) installieren

Installieren Sie auf Ihrer Workstation Unity 2020 LTS. In diesem Codelab sehen Sie Screenshots der Unity-Benutzeroberfläche in der Version 2020.3 (LTS). Andere Versionen von Unity funktionieren möglicherweise, es sind jedoch möglicherweise zusätzliche Schritte erforderlich. Die Abbildung kann von den hier gezeigten Screenshots abweichen.

Erstellen Sie ein neues Projekt

Erstellen Sie mit der Vorlage Universelle Render-Pipeline ein neues Projekt. Geben Sie einen aussagekräftigen Namen und einen geeigneten Ort ein und klicken Sie auf ERSTELLEN.

Erforderliche Frameworks installieren

Die AR Foundation von Unity finden Sie im Unity Package Manager.

1. Öffnen Sie es, indem Sie auf Fenster > Paketmanager.

2. Installieren Sie in diesem Fenster die Pakete, die Sie in diesem Codelab verwenden werden. Rufen Sie die neuesten Versionen dieser Frameworks auf, indem Sie den Eintrag mit dem Symbol ► maximieren. Installieren Sie die neuesten Versionen für jedes der folgenden Frameworks:
   • AR Foundation
   • ARCore XR-Plug-in

Wenn Sie fertig sind, sollte der Paketmanager ungefähr so aussehen:

Starterpaket installieren

Für dieses Codelab haben wir ein Starterpaket mit Prefabs und Scripts bereitgestellt, die einige Teile des Codelabs beschleunigen, damit Sie sich auf die Verwendung von AR Foundation konzentrieren können.

1. Starterpaket herunterladen
2. Installieren Sie das Starterpaket, indem Sie Assets > Paket importieren > Benutzerdefiniertes Paket... und starter-package.unitypackage werden geöffnet.
3. Vergewissern Sie sich, dass in dem Fenster, das sich öffnet, alle Elemente ausgewählt sind.
4. Klicken Sie auf Importieren.

Build-Einstellungen ändern

Da die App unter Android ausgeführt wird, ändern Sie die Build-Plattform in Android:

1. Öffnen Sie Datei > Build-Einstellungen.
2. Wählen Sie im Bereich Plattform die Option Android aus.
3. Optional können Sie Development Build und Script Debugging aktivieren, um Debugging-Informationen beizubehalten, während Ihre App ausgeführt wird.
4. Klicken Sie auf Plattform wechseln.

Projekteinstellungen ändern

AR Foundation muss so konfiguriert sein, dass XR-Systeme beim Start initialisiert werden.

1. Öffnen Sie Bearbeiten > Project Settings... (Projekteinstellungen...) und klicken Sie auf den Abschnitt XR Plug-in Management (XR-Plug-in-Verwaltung).
2. Aktivieren Sie auf dem Tab Android die Option ARCore.

3. Klicke links auf den Abschnitt Player.
4. Entfernen Sie auf dem Tab Android unter Other Settings (Weitere Einstellungen) die Option Vulkan aus den Grafik-APIs.

5. Für AR-fähige Apps, die ARCore verwenden, ist ein API-Level von mindestens 24 erforderlich. Scrollen Sie nach unten und suchen Sie nach Mindest-API-Level. Setze das minimale API-Level auf 24.

Erforderliche Szenenelemente hinzufügen

Die Vorlage für die Universal Render Pipeline enthält einige Spielobjekte, die Sie in dieser Anleitung nicht verwenden werden.

1. Lösche alle Spielobjekte in SampleScene.

2. AR Foundation-Objekte hinzufügen Klicken Sie mit der rechten Maustaste in den Bereich Hierarchie. Über dieses Menü können Sie Folgendes hinzufügen:

• XR > AR-Sitzung: Mit diesem Objekt wird der Lebenszyklus einer AR-Sitzung gesteuert.
• XR > Ursprung der AR-Sitzung: Dieses Objekt wandelt AR-Koordinaten in Unity-Weltkoordinaten um.
• Hell > Richtlicht: Mit dieser Lichtquelle werden Gegenstände in Spielen beleuchtet.

Ihre Hierarchie sollte wie folgt aussehen:

3. Maximieren Sie den Ursprung der AR Session, den Sie in der Hierarchie erstellt haben, und wählen Sie das Objekt AR Camera aus. Ändern Sie im Inspector das Tag in MainCamera.

Rendering einrichten

Die Universal Render Pipeline von Unity erfordert eine Änderung, damit sie mit AR Foundation kompatibel ist.

1. Gehen Sie im Bereich Projekt zu Assets > Einstellungen, um das ForwardRenderer-Asset zu finden.

2. Wählen Sie ForwardRenderer aus.
3. Verwenden Sie im Bereich „Inspector“ die Option Renderer-Element hinzufügen, um eine AR-Hintergrund-Renderer-Funktion hinzuzufügen. Diese Komponente rendert den Kamerafeed in Ihrer Szene.

Einrichtung prüfen

1. Prüfen Sie, ob das Gerät angeschlossen und die ADB-Fehlerbehebung aktiviert ist.
2. Klicken Sie auf Datei > Erstellen und ausführen... Dadurch wird die App auf Ihr Gerät hochgeladen und nach der Installation gestartet.
3. Sie sollten den Kamerafeed auf dem Bildschirm Ihres Geräts sehen.

Im nächsten Schritt beginnen Sie, Ihrer App Funktionen hinzuzufügen.

3. In der realen Welt Flugzeuge erkennen

Nachdem Sie nun eine Grundszene erstellt haben, können Sie mit der Entwicklung des Spiels beginnen. In diesem Schritt erkennen Sie Flugzeuge und zeichnen sie in das Bild.

ARPlaneManager-Komponente hinzufügen

Ein ARPlaneManager erkennt ARPlane-Elemente und erstellt, aktualisiert und entfernt Spielobjekte, wenn sich die Umgebung durch das Gerät ändert.

1. Erstellen Sie im Bereich „Hierarchie“ ein leeres GameObject-Objekt.
2. Benennen Sie es in Driving Surface Manager um. Diese Komponente zeigt Flugzeuge an, bis der Player eins auswählt.
3. Wählen Sie das neue Spielobjekt aus. Klicken Sie im Bereich „Inspector“ auf Add Component (Komponente hinzufügen), um einen AR Plane Manager hinzuzufügen.

4. Konfigurieren Sie ARPlaneManager, indem Sie das Feld Plane Prefab festlegen:
   1. Klicken Sie auf die Schaltfläche neben None, um das Fenster Select GameObject (GameObject auswählen) aufzurufen.
   2. Wähle den Tab Assets aus und suche nach Oberflächenansicht.

Dieses Prefab aus dem Starterpaket bietet eine grobkörnige Bodentextur, die als Dekoration des Flugzeugs verwendet wird.

5. Ändern Sie die Detection Mode in Horizontal. Dadurch wird das ARPlaneManager so konfiguriert, dass nur horizontale Ebenen bereitgestellt werden, die sich ideal zum Fahren eignen.

ARRaycastManager-Komponente hinzufügen

Ein ARRaycastManager stellt Raycast-Funktionen zur Verfügung. Im nächsten Schritt stellen wir dem Nutzer mithilfe dieses Objekts die Steuerelemente bereit.

1. Das Objekt Driving Surface Manager muss im Bereich „Hierarchie“ ausgewählt sein.
2. Klicken Sie im Prüftool auf Komponente hinzufügen, um Ihrem Spielobjekt eine ARRaycastManager-Komponente hinzuzufügen.

Für diese Komponente ist keine weitere Konfiguration erforderlich.

DrivingSurfaceManager-Komponente hinzufügen

Ein DrivingSurfaceManager ist ein Hilfsskript aus dem Starterpaket, mit dem eine ARPlane ausgewählt werden kann. Sobald ein ARPlane ausgewählt ist, werden alle anderen Flugzeuge ausgeblendet und neue Flugzeuge deaktiviert.

1. Das Objekt Driving Surface Manager muss im Bereich „Hierarchie“ ausgewählt sein.
2. Klicken Sie im Prüftool auf Komponente hinzufügen, um Ihrem Spielobjekt eine DrivingSurfaceManager-Komponente hinzuzufügen.

Für diese Komponente ist keine weitere Konfiguration erforderlich.

Anwendung ausführen

1. Klicken Sie auf Datei > Erstellen und ausführen, um Ihre Änderungen zu testen.
2. Richten Sie Ihr Gerät auf eine horizontale, reale Oberfläche und bewegen Sie es hin und her, damit ARCore die Welt besser versteht.

3. Wenn ARCore ein Flugzeug erkannt hat, sollten echte Oberflächen mit einer Schmutztextur bedeckt sein. ARPlaneManager instanziiert den angegebenen Plane Prefab für jede erkannte Ebene. Die Prefab Driving Surface Plane hat die Komponente ARPlaneMeshVisualizer, die ein Mesh-Netzwerk für eine bestimmte ARPlane erstellt.

Im nächsten Schritt verwenden Sie ein erkanntes Flugzeug als Spielfeld.

4. Treffertest mit erkannten Flugzeugen durchführen

Im vorherigen Schritt haben Sie eine Anwendung programmiert, die Flugzeuge erkennen kann. Diese Flugzeuge spiegeln sich in der Szene Ihres Spiels wider. Jetzt erweitern Sie die Interaktivität dieser Flugzeuge, indem Sie ein Zielfadenkreuz und ein Auto erstellen, das auf der Oberfläche des erkannten Flugzeugs fährt.

Zielfadenkreuz erstellen

Zur Steuerung dieser App zeigt der Spieler sein Smartphone auf eine Oberfläche. Um ein klares visuelles Feedback für den angegebenen Ort zu geben, verwenden Sie ein Zielfadenkreuz.

Um zu bleiben, dieses Fadenkreuzes an ein AR-Flugzeug an. Ein Treffertest ist eine Technik, mit der Kreuzungen berechnet werden, wenn ein Strahl in eine bestimmte Richtung geworfen wird. Sie verwenden einen Treffertest, um eine Kreuzung in der Richtung der Kamerablick zu erkennen.

Fadenkreuz hinzufügen

1. Gehen Sie im Bereich Projekt unten auf dem Bildschirm zu Assets > Starterpaket.
2. Fügen Sie das Reticle Prefab in die Szene ein, indem Sie es in den Hierarchiebereich des Projekts ziehen.
3. Wählen Sie das Fadenkreuz in der Hierarchie aus.
4. Klicken Sie im Inspector auf Komponente hinzufügen. Fügen Sie das Skript ReticleBehaviour aus dem Starterpaket hinzu. Dieses Skript enthält Textbausteine zur Steuerung des Fadenkreuzes.
5. Das Skript ReticleBehaviour ist von der zuvor erstellten Driving Surface Manager abhängig. Fügen Sie die Abhängigkeit hinzu, indem Sie auf die Driving Surface Manager-Auswahl klicken. Wählen Sie den Tab Szene und dann Driving Surface Manager aus.

ReticleBehaviour bearbeiten

Das Skript ReticleBehavior positioniert das Fadenkreuz auf der Ebene, die sich in der Mitte des Darstellungsbereichs des Geräts befindet.

1. Öffnen Sie das Skript ReticleBehaviour.cs, indem Sie auf das Feld Script doppelklicken.
2. Ermitteln Sie mit der KameraViewToScreenPoint die Mitte des Bildschirms. Fügen Sie in der Methode Update() Folgendes hinzu:

var screenCenter = Camera.main.ViewportToScreenPoint(new Vector3(0.5f, 0.5f));

3. Führen Sie an diesem Punkt einen Raycast durch. Geben Sie folgende Ausdrücke ein. (Verwenden Sie hier und im weiteren Verlauf des Labs jeweils nur die englischen Begriffe):

var hits = new List<ARRaycastHit>();
DrivingSurfaceManager.RaycastManager.Raycast(screenCenter, hits, TrackableType.PlaneWithinBounds);

Wenn bei der Verwendung von Camera.main ein NullReferenceException angezeigt wird, prüfen Sie, ob AR Camera der Szene unter Hierarchie > Ursprung der AR-Sitzung ist mit dem Tag MainCamera versehen.

Die Variable hits enthält ARRaycastHits, die Punkte auf Trackables beschreiben, die sich mit ray überschneiden.

TrackableType.PlaneWithinBounds ist ein Wert in TrackableType. Damit wird angegeben, welche Arten von Trackables mit diesem Strahlencast erkannt werden können. Weitere Informationen finden Sie in der Unity-Dokumentation zu TrackableType.

4. Bestimmen Sie den Schnittpunkt, indem Sie die hits-Liste abfragen. Die in DrivingSurfaceManager enthaltene gesperrte Ebene wird priorisiert. Falls sie nicht vorhanden ist, wird der erste Treffer verwendet. Fügen Sie am Ende von Update() Folgendes hinzu:

CurrentPlane = null;
ARRaycastHit? hit = null;
if (hits.Length > 0)
{
    // If you don't have a locked plane already...
    var lockedPlane = DrivingSurfaceManager.LockedPlane;
    hit = lockedPlane == null
        // ... use the first hit in `hits`.
        ? hits[0]
        // Otherwise use the locked plane, if it's there.
        : hits.SingleOrDefault(x => x.trackableId == lockedPlane.trackableId);
}

5. Wenn hit ein Ergebnis enthält, wird die Transformation dieser GameObject an die Trefferposition verschoben.

if (hit.HasValue)
{
    CurrentPlane = DrivingSurfaceManager.PlaneManager.GetPlane(hit.Value.trackableId);
    // Move this reticle to the location of the hit.
    transform.position = hit.Value.pose.position;
}
Child.SetActive(CurrentPlane != null);

Fadenkreuz testen

1. Klicken Sie auf Datei > Erstellen und ausführen, um Ihre Änderungen zu testen.
2. Wenn Sie Ihr Gerät auf ein Flugzeug richten, sollte das Fadenkreuz den Bewegungen der Kamera folgen.

Auto erstellen

Der Spieler steuert ein Spielzeugauto, das auf die Position des Fadenkreuzes fährt. Ein Modell und Verhalten für dieses Auto sind im Starterpaket enthalten.

CarManager zur Szene hinzufügen

1. Erstellen Sie in der Hierarchie ein neues leeres GameObject.
2. Benennen Sie es in Car Spawner um.
3. Wählen Sie das erstellte Objekt aus. Klicken Sie im Bereich Hierarchie auf Komponente hinzufügen, um die Komponente CarManager hinzuzufügen.
4. Richten Sie die Abhängigkeiten von CarManager ein, indem Sie für jedes Feld auf die Auswahl klicken:
   • Auto Fertigung: Wählen Sie unter Assets die Option Auto Fertigung aus.
   • Fassabdruck: Wählen Sie unter Szene die Option Fassabdruck Fertig aus.
   • Driving Surface Manager: Wählen Sie unter Scene (Szene) die Option Driving Surface Manager aus.

Durch dieses CarManager-Verhalten wird in dem Flugzeug, in dem sich das Fadenkreuz befindet, ein Spielzeugauto ausgelöst. Wenn du möchtest, kannst du dir das Skript CarBehaviour ansehen, um zu erfahren, wie das Auto programmiert ist.

Testfahrten

1. Klicken Sie auf Datei > Erstellen und ausführen, um Ihre Änderungen zu testen.
2. Wenn Sie auf ein Flugzeug tippen, sollte an dieser Position ein kleines Auto angezeigt werden. Dieses Auto folgt dem Fadenkreuz.

Spielelement hinzufügen

Nun, da der Spieler ein Element in der Szene steuern kann, geben Sie ihm ein Ziel, zu dem er fahren soll.

1. Erstellen Sie eine neue leere GameObject in der Hierarchie.
2. Benennen Sie es in Package Spawner um.
3. Wählen Sie das erstellte Objekt aus. Klicken Sie im Bereich Hierarchie auf Komponente hinzufügen, um die Komponente PackageSpawner hinzuzufügen.
4. Richten Sie die Abhängigkeiten von PackageSpawner ein, indem Sie für jedes Feld auf die Auswahl klicken:
   • Paket-Fertigung: Wählen Sie unter Assets die Option Paket-Fertigung aus.
   • Driving Surface-Manager: Wählen Sie unter Szene die Option Driving Surface-Manager aus.

Durch dieses PackageSpawner-Verhalten wird an einer zufälligen Position in einem gesperrten ARPlane ein neues Paket erzeugt, sofern noch kein Paket vorhanden ist.

Spiel testen

1. Klicken Sie auf Datei > Erstellen und ausführen, um Ihre Änderungen zu testen. 2. Nachdem Sie ein Auto erstellt haben, sollte ein Paket erzeugt werden.
2. Fahren Sie mit Ihrem Auto zum Paket.
3. Eine neue erscheint an einer zufälligen Stelle.

5. Belichtungsschätzung einrichten

Das einfache Spiel ist nun fertig und Sie können Ihrer AR-Szene einen Hauch von Realismus verleihen. In diesem Schritt verwenden Sie die Lighting Estimation API von ARCore, um das Licht in der realen Welt anhand von eingehenden Kamerabildern zu erkennen. Diese Informationen werden verwendet, um die Beleuchtung Ihrer Szene an die reale Beleuchtung anzupassen.

Belichtungsschätzung aktivieren

1. Maximieren Sie in der Hierarchie die Option Ursprung der AR-Sitzung und wählen Sie das Objekt AR-Kamera aus.
2. Maximieren Sie im Inspector das Skript AR Camera Manager.
3. Ändern Sie das Feld Beleuchtungsschätzung zu Alles.

Richtungslicht ändern

1. Wählen Sie unter Hierarchie das Objekt Richtungslicht aus.
2. Fügen Sie die Komponente LightEstimation hinzu. Diese Komponente aus dem Starterpaket enthält Textbausteine zum Abonnieren von Änderungen an der Beleuchtung.
3. Fügen Sie in der Funktion FrameReceived() Folgendes hinzu:

ARLightEstimationData lightEstimation = args.lightEstimation;

if (lightEstimation.averageBrightness.HasValue)
    Light.intensity = lightEstimation.averageBrightness.Value;

if (lightEstimation.averageColorTemperature.HasValue)
    Light.colorTemperature = lightEstimation.averageColorTemperature.Value;

if (lightEstimation.colorCorrection.HasValue)
    Light.color = lightEstimation.colorCorrection.Value;

if (lightEstimation.mainLightDirection.HasValue)
    Light.transform.rotation = Quaternion.LookRotation(lightEstimation.mainLightDirection.Value);

if (lightEstimation.mainLightColor.HasValue)
    Light.color = lightEstimation.mainLightColor.Value;

if (lightEstimation.mainLightIntensityLumens.HasValue)
    Light.intensity = lightEstimation.averageMainLightBrightness.Value;

if (lightEstimation.ambientSphericalHarmonics.HasValue)
{
    RenderSettings.ambientMode = AmbientMode.Skybox;
    RenderSettings.ambientProbe = lightEstimation.ambientSphericalHarmonics.Value;
}

Weitere Informationen zu den einzelnen Parametern finden Sie in der Dokumentation zu AR Foundation auf ARLightEstimationData.

Änderungen testen

1. Klicken Sie auf Datei > Erstellen und ausführen, um Ihre Änderungen zu testen.
2. Wenn Sie die Objekte in der Szene betrachten, stellen Sie möglicherweise fest, dass diese je nach Umgebungsbeleuchtung gefärbt sind.
3. Ändere nach Möglichkeit die Beleuchtung. Du kannst beispielsweise versuchen, das Licht in dem Raum auszuschalten, in dem du dich aufhältst. Sie sollten sehen, dass sich die Beleuchtung der Objekte an die veränderten Lichtverhältnisse in der realen Welt anpasst.

6. Zusammenfassung

Glückwunsch! Du bist am Ende dieses Codelabs zur Unity AR Foundation angelangt.

Behandelte Themen

• Anleitung zum Einrichten eines Basisprojekts mit der AR Foundation von Unity und der Universal Rendering Pipeline
• So abonnieren Sie mit ARPlaneManager neue Flugzeuge.
• So verwenden Sie Raycast, um Schnittpunkte mit virtueller Geometrie zu finden.
• Mit ARLightEstimationData eine Szene ausleuchten

Nächste Schritte

• Sehen Sie sich die AR Foundation-Beispiele von Unity an.
• Sehen Sie sich die Dokumentation zu AR Foundation an.
• Weitere Informationen finden Sie in der Google-Dokumentation zu ARCore-Erweiterungen für die AR-Grundlagen von Unity.

Bonusaufgaben

Wenn Sie das Spiel, das Sie hier entwickelt haben, weiter ausbauen möchten, können Sie Folgendes verfolgen:

• Du kannst deinem Spiel einen Punktezähler hinzufügen, indem du einen TextMeshPro änderst, wenn eine PackageManager ein neues Paket erzeugt.
• Wenn du die Funktion Leistungs-Overlay aktivierst, werden dir Leistungsdaten angezeigt, während dein Spiel läuft.
• Verwenden Sie Persistent Raycasts, um neue Objekte zuerst in Ihrer Szene zu platzieren. Wenn in diesem Bereich eine Ebene erkannt wird, wird das Objekt aktualisiert und an die jeweilige Ebene ausgerichtet.