Mit der AR Foundation von Unity ein AR-Spiel erstellen

1. Übersicht

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

Aufgaben

In diesem Codelab erstellen Sie ein einfaches Spiel mit AR Foundation. Ziel des Spiels ist es, mit einem Auto, das Sie über Ihr Mobilgerät steuern, Pakete einzusammeln.

In einer rein virtuellen Welt ist das jedoch nicht möglich. Sie kombinieren physische Atome und digitale Bits, um ein neues Spielerlebnis zu schaffen, indem Sie ein Spiel entwickeln, das die Umgebung des Spielers versteht.

Am Ende dieses Codelabs kann Ihr Spiel:

  • Ebenen in der realen Welt erkennen und ein Spielfeld darüber zeichnen
  • Strahlen aus der Sicht der Kamera aussenden und Schnittpunkte mit Ebenen erkennen.
  • Auf reale Lichtverhältnisse reagieren, um Ihrem Spiel mehr Realismus zu verleihen

Lerninhalte

  • So richten Sie ein Projekt ein, in dem AR Foundation von Unity verwendet wird.
  • So abonnieren Sie mit ARPlaneManager neue Tarife.
  • Mit Raycast Schnittpunkte mit virtueller Geometrie finden
  • So verwenden Sie ARLightEstimationData, um Ihre Szene zu beleuchten.

Voraussetzungen

2. Entwicklungsumgebung einrichten

In diesem Schritt bereiten Sie Ihre Umgebung für die Entwicklung mit AR Foundation von Unity vor.

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

AR-Funktionen auf Android-Geräten werden von ARCore unterstützt, das auf Geräten mit ARCore-Unterstützung 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

Sie müssen die Entwickleroptionen auf Ihrem Gerät aktivieren, um Debug-Apps auszuführen. Falls noch nicht geschehen, lesen Sie die Android-Dokumentation zum Aktivieren der Entwickleroptionen und des USB-Debugging.

Unity 2020.3 LTS installieren

Installieren Sie Unity 2020 LTS auf Ihrer Workstation. In diesem Codelab werden Screenshots der Unity-Benutzeroberfläche in der Version 2020.3 (LTS) gezeigt. Andere Unity-Versionen funktionieren möglicherweise auch, erfordern aber zusätzliche Schritte. Die Benutzeroberfläche kann anders aussehen als auf den Screenshots.

Neues Projekt erstellen

Erstellen Sie ein neues Projekt mit der Vorlage Universal Render Pipeline. Geben Sie einen beschreibenden Namen und einen geeigneten Speicherort an und drücken Sie auf ERSTELLEN.

Erforderliche Frameworks installieren

AR Foundation von Unity finden Sie im Unity Package Manager.

  1. Öffnen Sie ihn, indem Sie auf Window > Package Manager klicken.

  1. Installieren Sie in diesem Fenster die Pakete, die Sie in diesem Codelab verwenden werden. Wenn Sie den Eintrag mit dem Symbol  erweitern, sehen Sie die neuesten Versionen dieser Frameworks. Installieren Sie die neuesten Versionen der folgenden Frameworks:
    • AR Foundation
    • ARCore XR-Plug-in

Wenn Sie fertig sind, sollte Ihr Paketmanager in etwa so aussehen:

Starterpaket installieren

Für dieses Codelab haben wir ein Starterpaket mit Prefabs und Skripten bereitgestellt, die einige Teile des Codelabs beschleunigen, damit Sie sich darauf konzentrieren können, wie AR Foundation verwendet wird.

  1. Installieren Sie das Starterpaket, indem Sie Assets > Import Package > Custom Package... öffnen und starter-package.unitypackage öffnen.
  2. Prüfen Sie im Pop‑up-Fenster, ob alle Optionen ausgewählt sind.
  3. Klicken Sie auf Importieren.

Build-Einstellungen ändern

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

  1. Öffnen Sie File > Build Settings (Datei > Einstellungen für den Build).
  2. Wählen Sie im Bereich Plattform die Option Android aus.
  3. Aktivieren Sie optional Development Build (Entwicklungs-Build) und Script Debugging (Script-Debugging), um Debugging-Informationen während der Ausführung Ihrer App beizubehalten.
  4. Klicken Sie auf Plattform wechseln.

Projekteinstellungen ändern

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

  1. Öffnen Sie Bearbeiten > Projekteinstellungen… und klicken Sie auf den Bereich XR-Plug-in-Verwaltung.
  2. Aktivieren Sie auf dem Tab Android die Option ARCore.

  1. Klicken Sie im linken Bereich auf den Abschnitt Player.
  2. Entfernen Sie auf dem Tab Android unter Other Settings (Weitere Einstellungen) Vulkan aus Graphics APIs (Grafik-APIs).

  1. Für AR-Apps, die ARCore verwenden, ist ein Mindest-API-Level von 24 erforderlich. Scrollen Sie nach unten und suchen Sie nach Mindest-API-Level. Legen Sie das minimale API-Level auf 24 fest.

Erforderliche Szenenelemente hinzufügen

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

  1. Löschen Sie alle Spielobjekte in SampleScene.

  1. 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: Dieses Objekt steuert den Lebenszyklus einer AR-Anwendung.
  • XR > AR Session Origin: Dieses Objekt wandelt AR-Koordinaten in Unity-Weltkoordinaten um.
  • Light > Directional Light: Damit wird eine Lichtquelle zum Beleuchten von Spielobjekten bereitgestellt.

Ihre Hierarchie sollte so aussehen:

  1. Maximieren Sie den AR Session Origin, 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

Für die Universal Render Pipeline von Unity ist eine Änderung erforderlich, damit sie mit AR Foundation kompatibel ist.

  1. Suchen Sie im Bereich Projekt unter Assets > Einstellungen nach dem Asset ForwardRenderer.

  1. Wählen Sie den ForwardRenderer aus.
  2. Fügen Sie im Bereich „Inspector“ mit Add Renderer Feature (Renderer-Funktion hinzufügen) eine AR Background Renderer Feature (AR-Hintergrund-Renderer-Funktion) hinzu. Mit dieser Komponente wird der Kamerafeed in Ihrer Szene gerendert.

Einrichtung prüfen

  1. Achten Sie darauf, dass Ihr Gerät angeschlossen ist und die ADB-Fehlerbehebung aktiviert ist.
  2. Klicken Sie auf File > Build And Run... (Datei > Erstellen und ausführen…). Die Anwendung wird auf Ihr Gerät hochgeladen und nach der Installation gestartet.
  3. Auf dem Bildschirm Ihres Geräts sollte jetzt der Kamerastream zu sehen sein.

Im nächsten Schritt fügen Sie Ihrer App Funktionen hinzu.

3. Flugzeuge in der realen Welt erkennen

Nachdem eine einfache Szene eingerichtet wurde, können Sie mit der Entwicklung des Spiels beginnen. In diesem Schritt erkennen Sie Ebenen und zeichnen sie in die Szene ein.

ARPlaneManager-Komponente hinzufügen

Ein ARPlaneManager erkennt ARPlanes und erstellt, aktualisiert und entfernt Spielobjekte, wenn sich das Verständnis des Geräts von der Umgebung ändert.

  1. Erstellen Sie im Bereich „Hierarchie“ eine leere GameObject.
  2. Benennen Sie sie in Driving Surface Manager um. In dieser Komponente werden Flugzeuge angezeigt, bis eines vom Nutzer ausgewählt wird.
  3. Wählen Sie das neue Spielobjekt aus. Klicken Sie im Bereich „Inspector“ auf Add Component (Komponente hinzufügen), um einen AR Plane Manager (AR-Ebenenmanager) hinzuzufügen.

  1. Konfigurieren Sie ARPlaneManager, indem Sie das Feld Plane Prefab festlegen:
    1. Klicken Sie auf die Schaltfläche neben None, um das Fenster GameObject auswählen aufzurufen.
    2. Wählen Sie den Tab Assets aus und suchen Sie nach Driving Surface Plane.

Dieses Prefab aus dem Starterpaket bietet eine raue Bodenstruktur, die als Dekoration für die Ebene verwendet wird.

  1. Ändern Sie die Detection Mode in Horizontal. Damit werden nur horizontale Ebenen bereitgestellt, die sich ideal für die Navigation mit dem Auto eignen.ARPlaneManager

ARRaycastManager-Komponente hinzufügen

Ein ARRaycastManager stellt Raycast-Funktionen zur Verfügung. Im nächsten Schritt verwenden wir dieses Objekt, um die Steuerelemente für den Nutzer bereitzustellen.

  1. Achten Sie darauf, dass das Objekt mit dem Namen Driving Surface Manager im Bereich „Hierarchie“ ausgewählt ist.
  2. Klicken Sie im Inspector 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 Starter-Paket, mit dem ein ARPlane ausgewählt werden kann. Sobald ein ARPlane ausgewählt ist, werden alle anderen Ebenen ausgeblendet und neue Ebenen deaktiviert.

  1. Achten Sie darauf, dass das Objekt mit dem Namen Driving Surface Manager im Bereich „Hierarchie“ ausgewählt ist.
  2. Klicken Sie im Inspector 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 Oberfläche in der realen Welt und bewegen Sie es, damit ARCore die Umgebung besser erfassen kann.

  1. Wenn ARCore eine Ebene erkannt hat, sollte eine Schmutzstruktur auf realen Oberflächen zu sehen sein. Mit ARPlaneManager wird die angegebene Plane Prefab für jede erkannte Ebene instanziiert. Das Driving Surface Plane-Prefab hat eine ARPlaneMeshVisualizer-Komponente, die ein Mesh für eine bestimmte ARPlane erstellt.

Im nächsten Schritt verwenden Sie eine erkannte Ebene als Spielfeld.

4. Treffertest für erkannte Ebenen durchführen

Im vorherigen Schritt haben Sie eine Anwendung programmiert, die Ebenen erkennen kann. Diese Ebenen werden in der Szene Ihres Spiels berücksichtigt. Als Nächstes fügen Sie Interaktivität mit diesen Ebenen hinzu, indem Sie ein Zielvisier und ein Auto erstellen, das auf der Oberfläche der erkannten Ebene fährt.

Fadenkreuz erstellen

Das Steuerungsschema für diese App sieht vor, dass der Spieler sein Smartphone auf eine Oberfläche richtet. Um ein klares visuelles Feedback für den angegebenen Ort zu geben, verwenden Sie ein Zielkreuz.

Damit das Fadenkreuz an einer AR-Ebene „kleben“ bleibt, verwenden Sie einen Treffertest. Ein Treffertest ist eine Technik, mit der Schnittpunkte berechnet werden, wenn ein Strahl in eine bestimmte Richtung gesendet wird. Sie verwenden einen Hit-Test, um eine Überschneidung in Blickrichtung der Kamera zu erkennen.

Fadenkreuz hinzufügen

  1. Rufen Sie im Bereich Project (Projekt) unten auf dem Bildschirm Assets > Starter Package (Assets > Starter-Paket) auf.
  2. Platzieren Sie das Reticle Prefab in der Szene, indem Sie es in den Hierarchy pane 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 ReticleBehaviour-Script aus dem Starter-Paket hinzu. Dieses Skript enthält etwas Boilerplate-Code zum Steuern des Fadenkreuzes.
  5. Das Skript ReticleBehaviour hängt von der zuvor erstellten Driving Surface Manager ab. Fügen Sie die Abhängigkeit hinzu, indem Sie auf die Auswahl für Driving Surface Manager klicken. Wählen Sie den Tab Szene und dann die Driving Surface Manager aus.

ReticleBehaviour bearbeiten

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

  1. Öffnen Sie das ReticleBehaviour.cs-Skript, indem Sie doppelt auf das Feld Script klicken.
  2. Bestimmen Sie die Mitte des Bildschirms mit Camera's ViewToScreenPoint. Bearbeiten Sie die Methode Update(), um Folgendes hinzuzufügen:
var screenCenter = Camera.main.ViewportToScreenPoint(new Vector3(0.5f, 0.5f));
  1. Mit diesem Punkt können Sie einen Raycast durchführen. 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);

Die Variable hits enthält ARRaycastHit, die Punkte auf Trackables beschreiben, die von ray geschnitten werden.

  1. Ermitteln Sie den relevanten Schnittpunkt, indem Sie die Liste hits abfragen. Priorisieren Sie die gesperrte Ebene in DrivingSurfaceManager. Wenn sie nicht vorhanden ist, verwenden Sie die erste getroffene Ebene. 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);
}
  1. Wenn hit ein Ergebnis enthält, verschieben Sie die Transformation von GameObject an die Hit-Position.
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 Ihrer Kamera folgen.

Fahrzeug erstellen

Der Spieler steuert ein Spielzeugauto, das sich auf das Fadenkreuz zubewegt. Ein Modell und ein 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 sie in Car Spawner um.
  3. Wählen Sie das von Ihnen 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:
    • Car Prefab (Auto-Prefab): Wählen Sie unter Assets (Assets) die Option Car Prefab (Auto-Prefab) aus.
    • Fadenkreuz: Wählen Sie unter Szene die Option Fadenkreuz-Prefab aus.
    • Driving Surface Manager: Wählen Sie unter Szene die Option Driving Surface Manager aus.

Bei diesem CarManager-Verhalten wird ein Spielzeugauto auf der Ebene platziert, auf der sich das Fadenkreuz befindet. Wenn Sie möchten, können Sie sich das CarBehaviour-Script 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 Stelle ein kleines Auto angezeigt werden. Dieses Auto folgt dem Fadenkreuz.

Spielelement hinzufügen

Nachdem der Spieler eine Einheit in der Szene steuern kann, geben Sie ihm ein Ziel, auf das er zufahren kann.

  1. Erstellen Sie eine neue leere GameObject in der Hierarchie.
  2. Benennen Sie sie in Package Spawner um.
  3. Wählen Sie das von Ihnen 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-Prefab: Wählen Sie unter Assets (Assets) die Option Package Prefab (Paket-Prefab) aus.
    • Driving Surface Manager: Wählen Sie unter Szene die Option Driving Surface Manager aus.

Bei diesem PackageSpawner-Verhalten wird ein neues Paket an einem zufälligen Ort auf einem gesperrten ARPlane erstellt, 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 erscheinen.
  2. Fahren Sie mit Ihrem Auto zum Paket.
  3. Ein neues wird an einer zufälligen Stelle angezeigt.

5. Beleuchtungsschätzung einrichten

Nachdem das grundlegende Spiel fertiggestellt ist, können Sie Ihrer AR-Szene einen Hauch von Realismus verleihen. In diesem Schritt verwenden Sie die Lighting Estimation API von ARCore, um die Beleuchtung in der realen Welt anhand eingehender Kamerabilder zu erkennen. Diese Informationen werden verwendet, um die Beleuchtung Ihrer Szene an die Beleuchtung in der realen Welt anzupassen.

Beleuchtungsschätzung aktivieren

  1. Maximieren Sie in Hierarchy den AR Session Origin und wählen Sie das Objekt AR Camera aus.
  2. Maximieren Sie im Inspector das Script AR Camera Manager.
  3. Ändern Sie das Feld Beleuchtung schätzen in Alles.

Richtung des gerichteten Lichts ändern

  1. Wählen Sie unter Hierarchie das Objekt Directional Light (Gerichtetes Licht) aus.
  2. Fügen Sie die Komponente LightEstimation hinzu. Diese Komponente aus dem Starter-Paket bietet etwas Boilerplate-Code 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;
}

Änderungen testen

  1. Klicken Sie auf Datei > Erstellen und ausführen, um Ihre Änderungen zu testen.
  2. Wenn Sie sich die Objekte in der Szene ansehen, werden Sie feststellen, dass sie je nach Beleuchtung der Umgebung unterschiedlich gefärbt sind.
  3. Ändern Sie nach Möglichkeit die Beleuchtung. Schalten Sie beispielsweise das Licht in dem Raum aus, in dem Sie sich befinden. Die Beleuchtung der Objekte sollte sich an die Änderung der realen Beleuchtung anpassen.

6. Zusammenfassung

Das wars! Sie haben das Ende dieses Codelabs zur Unity AR Foundation erreicht.

Behandelte Themen

  • So richten Sie ein einfaches Projekt mit AR Foundation von Unity und der Universal Rendering Pipeline ein.
  • So abonnieren Sie mit ARPlaneManager neue Tarife.
  • So verwenden Sie Raycast, um Schnittpunkte mit virtueller Geometrie zu finden.
  • So verwenden Sie ARLightEstimationData, um Ihre Szene zu beleuchten.

Nächste Schritte

Bonuszuweisungen

Wenn Sie das hier erstellte Spiel weiterentwickeln möchten, haben Sie folgende Möglichkeiten:

  • Fügen Sie Ihrem Spiel einen Punktezähler hinzu, indem Sie ein TextMeshPro ändern, wenn ein PackageManager ein neues Paket erzeugt.
  • Wenn Sie das Leistungs-Overlay aktivieren, können Sie sich Leistungsinformationen anzeigen lassen, während Ihr Spiel ausgeführt wird.
  • Verwenden Sie Persistent Raycasts, um neue Objekte zuerst in Ihrer Szene zu platzieren. Wenn in diesem Bereich eine Ebene erkannt wird, wird das Objekt so aktualisiert, dass es an dieser Ebene ausgerichtet wird.