Erstellen einer OpenGL ES-Anwendung für Android und iOS

Sie können Visual Studio-Projekte und -Projektmappen für iOS-Apps und Android-Apps erstellen, die gemeinsamen Code nutzen. Dieser Artikel führt Sie durch eine kombinierte Lösungsvorlage. Sie erstellt sowohl eine iOS-App als auch eine Android Native Activity-App. Die Apps verwenden gemeinsamen C++-Code, der OpenGL ES verwendet, um denselben animierten rotierenden Cube auf jeder Plattform anzuzeigen. OpenGL ES (OpenGL for Embedded Systems oder GLES) ist eine 2D- und 3D-Grafik-API. Es wird auf vielen mobilen Geräten unterstützt.

Anforderungen

Wichtig

OpenGL-Support ist nicht mehr verfügbar. Sie war zuletzt in Visual Studio 17.3 verfügbar.

Hier sind die Systemanforderungen zum Erstellen einer OpenGL ES-App für iOS und Android. Installieren Sie die Workload „Mobile-Entwicklung mit C++“ im Visual Studio-Installer, sofern dies nicht bereits erfolgt ist. Zum Abrufen der OpenGL ES-Vorlagen und Entwickeln für iOS binden Sie die optionalen C++-Entwicklungstools für iOS ein. Um für Android zu erstellen, installieren Sie die C++-Android-Entwicklungstools und die erforderlichen Tools von Drittanbietern: Android NDK, Apache Ant und Google Android Emulator.

Um eine bessere Emulatorleistung auf Intel-Plattformen zu erzielen, besteht eine Option darin, den Intel Hardware Accelerated Execution Manager (HAXM) zu installieren. Ausführliche Anweisungen finden Sie unter Installieren plattformübergreifender mobiler Entwicklung mit C++.

Zum Erstellen und Testen der iOS-App benötigen Sie einen Mac-Computer. Richten Sie sie gemäß den Installationsanweisungen ein. Weitere Informationen zum Einrichten der iOS-Entwicklung finden Sie unter Installieren und Konfigurieren von Tools zum Erstellen mit iOS.

Erstellen eines neuen OpenGLES-Anwendungsprojekts

In diesem Tutorial erstellen Sie zunächst ein neues OpenGL ES-Anwendungsprojekt, und dann erstellen Sie die Standard-App und führen sie im Android-Emulator aus. Als Nächstes erstellen Sie die App für iOS und führen sie auf einem iOS-Gerät aus.

  1. Wählen Sie in Visual Studio Datei>Neu>Projekt.

  2. Wählen Sie im Dialogfeld Neues Projekt unter Vorlagen die Option Visual C++>Plattformübergreifend und dann die Vorlage OpenGLES-Anwendung (Android, iOS) aus.

  3. Geben Sie der App einen Namen wie MyOpenGLESApp, und klicken Sie dann auf OK.

    Screenshot of the New Project dialog where the OpenGLES Application project template is selected, with MyOpenGLESApp in the Name textbox.

    Visual Studio erstellt die neue Projektmappe und öffnet den Projektmappen-Explorer.

    Screenshot of MyOpenGLESApp in Solution Explorer.

  1. Wählen Sie in Visual Studio Datei>Neu>Projekt.

  2. Wählen Sie im Dialogfeld Neues Projekt erstellen die Vorlage OpenGLES-Anwendung (Android, iOS) aus, und klicken Sie dann auf Weiter.

  3. Geben Sie im Dialogfeld Neues Projekt konfigurieren einen Namen wie MyOpenGLESApp in Projektname ein, und klicken Sie dann auf Erstellen.

    Visual Studio erstellt die neue Projektmappe und öffnet den Projektmappen-Explorer.

    Screenshot of MyOpenGLESApp in Solution Explorer.

Die neue OpenGL ES-Anwendungsprojektmappe umfasst drei Bibliotheksprojekte und zwei Anwendungsprojekte. Der Ordner "Bibliotheken" enthält ein freigegebenes Codeprojekt. Und zwei plattformspezifische Projekte, die auf den freigegebenen Code verweisen:

  • MyOpenGLESApp.Android.NativeActivity enthält die Verweise und den Verbindungscode, mit denen Ihre App als eine systemeigene Aktivität auf Android implementiert werden kann. Die Einstiegspunkte aus dem Verbindungscode sind in der Datei main.cpp implementiert, die den gemeinsamen Code in MyOpenGLESApp.Shared enthält. Vorkompilierte Header befinden sich in pch.h. Das Native Activity-App-Projekt wird in eine gemeinsam genutzte Bibliotheksdatei (SO) kompiliert, die durch das MyOpenGLESApp.Android.Packaging-Projekt ausgewählt wird.

  • MyOpenGLESApp.iOS.StaticLibrary erstellt eine statische iOS-Bibliotheksdatei (A)-Datei mit dem freigegebenen Code in MyOpenGLESApp.Shared. Diese ist mit der vom MyOpenGLESApp.iOS.Application-Projekt erstellten App verknüpft.

  • MyOpenGLESApp.Shared enthält den freigegebenen Code, der plattformübergreifend verwendet werden kann. Die App verwendet Präprozessormakros für die bedingte Kompilierung von plattformspezifischem Code. Der freigegebene Code wird durch den Projektverweis sowohl in MyOpenGLESApp.Android.NativeActivity als auch MyOpenGLESApp.iOS.StaticLibrary übernommen.

Die Projektmappe enthält zwei Projekte zum Erstellen der Apps für die Android- und iOS-Plattform:

  • MyOpenGLESApp.Android.Packaging erstellt die APK-Datei für die Bereitstellung auf einem Android-Gerät oder -Emulator. Diese Datei enthält die Ressourcen sowie die Datei „AndroidManifest.xml“, in der Sie Manifesteigenschaften festlegen. Es enthält zudem die Datei build.xml, die den Ant-Buildprozess steuert. Es ist standardmäßig als Startprojekt festgelegt, sodass es bereitgestellt und direkt in Visual Studio ausgeführt werden kann.

  • MyOpenGLESApp.iOS.Application enthält die Ressourcen und Objective-C-Verbindungscode zum Erstellen einer iOS-App, die mit dem Code der statischen C++-Bibliothek in MyOpenGLESApp.iOS.StaticLibrary verknüpft ist. Dieses Projekt erstellt ein Buildpaket, das von Visual Studio und dem Remote-Agent auf Ihren Mac übertragen wird. Beim Erstellen dieses Projekts sendet Visual Studio die Dateien und Befehle zum Erstellen und Bereitstellen der App auf dem Mac.

Erstellen und Ausführen der Android-App

Durch die von der Vorlage erstellte Projektmappe wird die Android-App als Standardprojekt festgelegt. Sie können die App erstellen und ausführen, um die Installation und Einrichtung zu überprüfen. Führen Sie die App in einem ersten Test in einem der Geräteprofile aus, die vom Emulator für Android installiert werden. Wenn Sie Ihre App lieber auf einem anderen Ziel testen möchten, können Sie den Ziel-Emulator laden. Oder verbinden Sie ein Gerät mit Ihrem Computer.

So erstellen und führen Sie die Android Native Activity-App aus

  1. Wählen Sie x86 aus der Dropdownliste Projektmappenplattformen aus (falls diese Plattform nicht bereits ausgewählt ist).

    Screenshot of the Solution Platform dropdown with x86 highlighted.

    Wählen Sie "x86" aus, wenn Sie den Emulator als Ziel verwenden möchten. Um ein Gerät als Ziel zu verwenden, wählen Sie je nach Geräteprozessor die entsprechende Projektmappenplattform aus. Wenn die Liste Projektmappenplattformen nicht angezeigt wird, wählen Sie Projektmappenplattformen aus der Liste Schaltflächen hinzufügen/entfernen aus, und wählen Sie dann Ihre Plattform aus.

  2. Öffnen Sie im Projektmappen-Explorer das Kontextmenü für das MyOpenGLESApp.Android.Packaging-Projekt, und wählen Sie dann Erstellen aus.

    Screenshot of the Solution Explorer window with the shortcut menu for the Android Packaging Project showing the Build command.

    Das Ausgabefenster zeigt die Ausgabe des Buildprozesses für die freigegebene Android-Bibliothek und die Android-App an.

    Screenshot of Build Output for Android projects.

  3. Wählen Sie eins der emulierten Android-Geräteprofile als Bereitstellungsziel aus.

    Choose deployment target.

    Möglicherweise haben Sie andere Emulatoren installiert oder ein Android-Gerät angeschlossen. Sie können sie in der Dropdownliste für das Bereitstellungsziel auswählen. Damit die App ausgeführt werden kann, muss die integrierte Projektmappenplattform mit der Plattform des Zielgeräts übereinstimmen.

  4. Drücken Sie F5, um mit dem Debuggen zu beginnen, oder UMSCHALT+F5, um ohne Debuggen zu beginnen.

    Visual Studio startet den Emulator, wobei das Laden und Bereitstellen Ihres Codes mehrere Sekunden in Anspruch nimmt. So wird die App im Emulator angezeigt:

    Screenshot of the app running in an Android Emulator.

    Nachdem Ihre App gestartet wurde, können Sie Haltepunkte festlegen und den Debugger verwenden, um den Code schrittweise zu durchlaufen, lokale Variablen zu prüfen und Werte anzuzeigen.

  5. Drücken Sie UMSCHALT+ShiftF5, um den Debugvorgang zu beenden.

    Der Emulator ist ein separater Prozess, der weiterhin ausgeführt wird. Sie können Ihren Code mehrfach auf demselben Emulator bearbeiten, kompilieren und bereitstellen. Die App wird in der App-Sammlung für den Emulator angezeigt und kann direkt von dort aus gestartet werden.

    Die generierten Android Native Activity-App- und Bibliotheksprojekte fügen den gemeinsam genutzten C++-Code in eine dynamische Bibliothek ein. Es enthält "Glue"-Code für die Schnittstelle mit der Android-Plattform. Der großteil des App-Codes befindet sich in der Bibliothek. Die Manifest-, Ressourcen- und Buildanweisungen befinden sich im Paketprojekt. Der freigegebene Code wird von "main.cpp" im NativeActivity-Projekt aufgerufen. Weitere Informationen über das Programmieren einer Android Native Activity-App finden Sie im Android Developer NDK auf der Seite Konzepte .

    Visual Studio erstellt Android Native Activity-Projekte mit android NDK. Es verwendet Clang als Plattformtoolset. Visual Studio ordnet die Eigenschaften des Projekts der Kompilierung, Verknüpfung und Debugbefehle auf der Zielplattform zu. Um weitere Informationen zu erhalten, öffnen Sie das Dialogfeld Eigenschaftenseiten des MyOpenGLESApp.Android.NativeActivity-Projekts. Weitere Informationen zu den Befehlszeilenschaltern finden Sie im Clang Compiler-Benutzerhandbuch (in englischer Sprache).

Erstellen und Ausführen der iOS-App auf einem iOS-Gerät

Sie erstellen und bearbeiten das iOS-App-Projekt in Visual Studio. Aufgrund von Lizenzierungseinschränkungen muss sie auf einem Mac erstellt und bereitgestellt werden. Visual Studio kommuniziert mit einem Remote-Agent, der auf dem Mac ausgeführt wird, um Projektdateien zu übertragen und Build-, Bereitstellungs- und Debugbefehle auszuführen. Sie müssen Ihren Mac und Visual Studio für die Kommunikation einrichten und konfigurieren, bevor Sie die iOS-App erstellen können. Ausführliche Anweisungen finden Sie unter Installieren und Konfigurieren von Tools zum Erstellen mit iOS. Führen Sie den Remote-Agent auf Ihrem Mac aus, und koppeln Sie ihn mit Visual Studio. Anschließend können Sie die iOS-App erstellen und ausführen, um Ihre Installation und Einrichtung zu überprüfen.

Um Ihre App auf einem iOS-Gerät bereitzustellen, richten Sie zuerst die automatische Anmeldung in Xcode ein. Die automatische Signierung erstellt ein Bereitstellungsprofil, um einen Build der App zu signieren.

So richten Sie die automatische Signierung in Xcode ein

  1. Installieren Sie Xcode auf Ihrem Mac, sofern noch nicht geschehen.

  2. Öffnen Sie die Xcode-App auf Ihrem Mac.

  3. Erstellen Sie ein neues Xcode-Projekt für eine Einzelansichtanwendung. Füllen Sie bei der Projekterstellung die Pflichtfelder aus. Die Werte können beliebig sein, da das Projekt nur zum Erstellen eines Bereitstellungsprofils verwendet wird, mit dem später ein Build der App signiert werden soll.

  4. Fügen Sie dem Xcode Ihre Apple ID hinzu, die in einem Apple Developer Program-Konto registriert ist. Ihre Apple ID wird als Signierungsidentität zum Signieren von Apps verwendet. Um die Signierungsidentität zu Xcode hinzuzufügen, öffnen Sie das Menü Xcode, und wählen Sie Einstellungen aus. Wählen Sie Konten aus, und klicken Sie auf die Schaltfläche „Hinzufügen“ (+), um Ihre Apple ID hinzuzufügen. Detaillierte Anweisungen finden Sie unter Hinzufügen Ihres Apple ID-Kontos.

  5. Ändern Sie in den allgemeinen Einstellungen Ihres Xcode-Projekts den Paketbezeichner zu com.<NameOfVSProject>, wobei <NameOfVSProject> der Name des von Ihnen erstellten Visual Studio-Projektmappenprojekts ist. Ein Beispiel: Wenn Sie ein Projekt namens MyOpenGLESApp in Visual Studio erstellt haben, legen Sie den Paketbezeichner auf com.MyOpenGLESApp fest.

    Screenshot of the Xcode bundle identifier.

  6. Um das automatische Signieren zu aktivieren, aktivieren Sie das Kontrollkästchen **Signierung automatisch verwalten**.

    Screenshot of Xcode automatic signing value.

  7. Wählen Sie den Teamnamen der Apple ID aus, die Sie als Team für die Entwicklung hinzugefügt haben.

    Screenshot of the Xcode team value.

So erstellen Sie die iOS-App auf einem iOS-Gerät und führen sie aus

  1. Führen Sie den Remote-Agent auf Ihrem Mac aus, und stellen Sie sicher, dass Visual Studio mit dem Remote-Agent gekoppelt ist. Wenn Sie den Remote-Agent starten möchten, öffnen Sie ein Terminal-App-Fenster, und geben Sie vcremote. Weitere Informationen finden Sie unter Konfigurieren des Remote-Agents in Visual Studio.

    Mac Terminal window running vcremote.

  2. Schließen Sie ein iOS-Gerät an Ihren Mac an. Wenn Sie ein Gerät zum ersten Mal an einen Computer anschließen, werden Sie in einer Warnung gefragt, ob der Computer auf das Gerät zugreifen darf. Teilen Sie dem Gerät mit, dass es dem Mac-Computer vertrauen darf.

  3. Wählen Sie in Visual Studio aus der Dropdownliste Projektmappenplattformen die Projektmappenplattform aus, die dem Geräteprozessor entspricht (sofern diese nicht bereits ausgewählt ist). In diesem Beispiel handelt es sich um einen ARM64-Prozessor.

    Screenshot of setting the Solution Platform to ARM64.

  4. Öffnen Sie im Projektmappen-Explorer das Kontextmenü des MyOpenGLESApp.iOS.Application-Projekts, und wählen Sie Projekt entladen aus, um das Projekt zu entladen.

  5. Öffnen Sie erneut das Kontextmenü für das entladene MyOpenGLESApp.iOS.Application-Projekt, und wählen Sie „project.pbxproj“ bearbeiten aus, um die Projektdatei zu bearbeiten. Suchen Sie in der Datei project.pbxproj nach dem buildSettings-Attribut, und fügen Sie DEVELOPMENT_TEAM mit Ihrer Apple Team ID hinzu. Der Screenshot unten zeigt einen Beispielwert von 123456ABC für die Apple Team ID. Sie finden den Wert Ihrer Apple Team ID in Xcode. Wechseln Sie zu Buildeinstellungen, und halten Sie den Mauszeiger auf den Namen Ihres Entwicklungsteams, um eine QuickInfo anzuzeigen. Die QuickInfo zeigt Ihre Team-ID an.

    Screenshot of setting the development team.

  6. Schließen Sie die Datei project.pbxproj. Öffnen Sie dann das Kontextmenü für das entladene MyOpenGLESApp.iOS.Application-Projekt, und wählen Sie Projekt erneut laden aus, um das Projekt erneut zu laden.

  7. Erstellen Sie jetzt das MyOpenGLESApp.iOS.Application-Projekt, indem Sie das Kontextmenü des Projekts öffnen und Build auswählen.

    Using the shortcut menu to build the iOS Application project.

    Im Ausgabefenster wird die Ausgabe des Buildprozesses angezeigt. Sie zeigt Ergebnisse für die statische iOS-Bibliothek und die iOS-App an. Auf dem Mac zeigt das Terminal-Fenster, in dem der Remote-Agent ausgeführt wird, die Befehls- und Dateiübertragungsaktivitäten an.

    Auf Ihrem Mac-Computer werden Sie möglicherweise aufgefordert, Codesign den Zugriff auf Ihre Keychain zu ermöglichen. Wählen Sie Zulassen aus, um den Vorgang fortzusetzen.

  8. Wählen Sie auf der Symbolleiste Ihr iOS-Gerät aus, um die App auf dem Gerät auszuführen, das an Ihren Mac angeschlossen ist. Wenn die App nicht gestartet wird, vergewissern Sie sich, dass das Gerät der bereitgestellten Anwendung die Berechtigung für die Ausführung auf dem Gerät erteilt hat. Diese Berechtigung kann auf dem Gerät festgelegt werden: Einstellungen>Allgemein>Geräteverwaltung. Wählen Sie das Konto Ihrer Developer-App aus, legen Sie das Konto als vertrauenswürdig fest, und überprüfen Sie die App. Versuchen Sie erneut, die App in Visual Studio auszuführen.

    Screenshot of the iOS app on an iOS device.

    Nachdem Ihre App gestartet wurde, können Sie Haltepunkte festlegen und den Visual Studio-Debugger verwenden, um lokale Variablen zu prüfen, die Aufrufliste anzuzeigen und Werte zu überwachen.

    Screenshot of the Debugger at a breakpoint in the iOS app.

  9. Drücken Sie UMSCHALT+ShiftF5, um den Debugvorgang zu beenden.

    Der C++-Code wird von den generierten iOS-App- und -Bibliotheksprojekten in einer statischen Bibliothek abgelegt, die nur den freigegebenen Code implementiert. Der Hauptteil des Anwendungscodes befindet sich im Application-Projekt. Die Aufrufe des freigegebenen Bibliothekscodes in diesem Vorlagenprojekt werden in der Datei GameViewController.m ausgeführt. Zur Erstellung der iOS-App verwendet Visual Studio das Xcode-Plattformtoolset, das die Kommunikation mit einem Remoteclient erfordert, der auf einem Mac ausgeführt wird.

    Visual Studio überträgt die Projektdateien an den Remoteclient. Anschließend werden Befehle gesendet, um die App mit Xcode zu erstellen. Der Remoteclient sendet Buildstatusinformationen zurück an Visual Studio. Wenn die App erfolgreich erstellt wurde, kann Visual Studio Befehle senden, um die App auszuführen und zu debuggen. Der Debugger in Visual Studio steuert die App, die auf dem an Ihren Mac angeschlossenen iOS-Gerät ausgeführt wird. Visual Studio ordnet Projekteigenschaften den Optionen zu, die zum Kompilieren, Verknüpfen und Debuggen auf der iOS-Zielplattform verwendet werden. Um ausführliche Informationen zur Compiler-Befehlszeilenoption zu erhalten, öffnen Sie das Dialogfeld Eigenschaftenseiten für das MyOpenGLESApp.iOS.StaticLibrary-Projekt.

Anpassen der Apps

Sie können den freigegebenen C++-Code bearbeiten, um allgemeine Funktionen hinzuzufügen oder zu ändern. Ändern Sie die Aufrufe an den freigegebenen Code in den MyOpenGLESApp.Android.NativeActivity projekten, MyOpenGLESApp.iOS.Application damit sie übereinstimmen. Sie können Präprozessormakros verwenden, um plattformspezifische Abschnitte im gemeinsamen Code anzugeben. Der Präprozessormakro __ANDROID__ ist bei der Erstellung für Android vordefiniert. Der Präprozessormakro __APPLE__ ist bei der Erstellung für iOS vordefiniert.

Um intelliSense für eine bestimmte Projektplattform anzuzeigen, wählen Sie das Projekt in der Dropdownliste für die Kontextumstellung aus. Sie befindet sich in der Navigationsleiste am oberen Rand des Editorfensters.

Screenshot of the Project Context Switcher dropdown in the Editor.

IntelliSense-Probleme im vom aktuellen Projekt verwendeten Code sind durch eine rote Wellenlinie gekennzeichnet. Bei anderen Projekten wird ein Problem mit einer lila wellenförmigen Linie markiert. Visual Studio unterstützt weder eine farbliche Kennzeichnung von Code noch IntelliSense für Java- oder Objective-C-Dateien. Sie können jedoch weiterhin die Quelldateien und -ressourcen ändern. Verwenden Sie sie, um den Anwendungsnamen, das Symbol und andere Implementierungsdetails festzulegen.