Créer une application 3D Flight Simulator pour iOS et Android - Exportation de projet

Dans cette série de didacticiels, nous allons créer une application de simulateur de vol utilisant ShiVa3D Suite. Afin de construire cette application, nous allons couvrir tous les sujets nécessaires à la création de jeux 3D, d'applications éducatives et d'applications 3D innovantes. Dans ce tutoriel, le quatrième et dernier volet, nous allons nous concentrer sur l'exportation de l'application pour plusieurs plates-formes..

La partie 3 de cette série s’est concentrée sur l’ajout du code et l’unité de test du produit final. Dans la quatrième partie, le dernier volet de la série, nous allons exporter l'application depuis l'éditeur ShiVa et l'importer dans l'outil de création ShiVa. Ensuite, nous expliquerons comment convertir l’application en un exécutable spécifique à la plate-forme via ShiVa Authoring Tool. Les plates-formes que nous allons considérer sont Android, iPad et iPhone. Nous donnerons des images d'écran du simulateur à partir de véritables appareils utilisés pour les tests, un téléphone Motorola Droid avec Android OS 2.2, un iPad2 avec iOS 4.3 et un iPod Touch avec iOS 4.3. Enfin, dans les "Remarques finales", nous allons conclure la série.


Aussi disponible dans cette série:

  1. Créer une application 3D Flight Simulator pour iOS et Android - Présentation théorique
  2. Créer une application 3D Flight Simulator pour iOS et Android - Création d'environnement
  3. Créer une application 3D Flight Simulator pour iOS et Android - Programmation sur simulateur
  4. Créer une application 3D Flight Simulator pour iOS et Android - Exportation de projet

Exporter le jeu

Actuellement, le développement du jeu Simulator est terminé. Nous allons maintenant exporter le simulateur vers deux plates-formes différentes pour la création: iOS, pour le déploiement sur des appareils iPad et iPhone / iPod Touch, et Android OS, pour le déploiement sur des appareils Android..

Exporter pour iOS

Dans l'explorateur de données, sous le dossier Jeux, sélectionnez Simulateur. Dans le menu contextuel, sélectionnez Exporter le jeu (si vous êtes invité à enregistrer quoi que ce soit avec le jeu, sélectionnez Oui)..


Dans la boîte de dialogue Exporter, laissez le nom du champ Exporter être "Simulator". Assurez-vous que la case Dossier local est cochée et choisissez un dossier local pour exporter le jeu. Cochez également la case Package d'exécution (.stk) et choisissez iOS pour la plate-forme correspondante..


Appuyez sur "Exporter" pour exporter le jeu. L'exportation peut prendre un certain temps. Une fois terminé, vous verrez une boîte de confirmation comme suit:


Exporter pour Android

Ceci est similaire à l'exportation pour iOS sauf que la plate-forme du package Runtime doit être sélectionnée en tant qu'Android..



L'outil de création ShiVa

Jusqu'à présent, nous avons développé le simulateur sans écrire de code spécifique aux plateformes iOS ou Android. Nous allons maintenant utiliser l'outil de création ShiVa Authoring pour convertir le simulateur en trois applications différentes, une pour Android, une pour iPhone / iPod touch et une pour iPad..

La plateforme Android

Affichez l'outil de création ShiVa. Sélectionnez l'onglet Android. Appuyez sur la flèche sous «Ou lancez-vous maintenant…».


L'étape 1 de l'outil de création est affichée. Pour "Application pack", sélectionnez dans votre système de fichiers le fichier Simulator.stk exporté à partir de ShiVa Editor for Android. Pour 'Icon', sélectionnez le fichier flight-48-48.png qui fait partie de l'archive source accompagnant cette série. Pour 'Startup splashscreen', sélectionnez le fichier flight-480-800.png, qui fait également partie de l'archive source accompagnant cet article. Observez que ShiVa Authoring Tool affiche un aperçu des fichiers image spécifiés dans les sélections 'Icon' et 'Startup splashscreen'. Appuyez sur 'Étape 2: Création' en haut de l'écran..


L'étape 2 de l'outil de création est affichée. Nous allons créer ici un fichier exécutable Android pouvant être directement installé sur un appareil Android. Sélectionnez 'Type de création' en tant que 'Package APK' (si vous souhaitez créer un projet Eclipse au lieu d'un exécutable, sélectionnez 'Projet'. L'option Projet n'a pas été testée dans cette série). Pour «Identifiant du paquet», entrez com.shiva3d.simulator. Laissons «Version» et «Code de version» comme 1.0.0 et 1, respectivement. Appuyez sur 'Étape 3: Construire' au sommet de l'écran.


L'étape 3 de l'outil de création est affichée. Sélectionnez 'Type de construction' comme 'Développement'. La case à cocher 'Utiliser OpenGLES 1.1' doit être décochée (nous n'avons pas testé la construction avec cette case cochée). Puisque nous souhaitons installer le simulateur sur notre appareil Android dans le cadre de la construction, nous avons coché la case "Installer sur un appareil connecté". Pour que cette option fonctionne, vous devez avoir suivi les étapes décrites dans «Préparation du périphérique Android pour l'installation» ci-dessous. Si la case "Installer sur un périphérique connecté" n'est pas cochée, l'outil de création créera l'exécutable Android de l'application Simulator dans le "Dossier de sortie", qui pourra être installé ultérieurement à l'aide de l'outil adb dans Android.

Laissez le "backend audio" comme "par défaut". Sélectionnez "Prise en charge minimale du système d'exploitation" en tant que "Android 2.2 (niveau d'API: 8)"..


Définissez un dossier de sortie pour que l’outil de création stocke les fichiers qu’il génère pendant le processus de construction. Laisser la sélection 'Custom post build script' demeurer en tant qu'option 'Pas de script'. Appuyez sur le bouton Construire.


Il faudra un certain temps pour terminer la construction. Une fois la construction terminée, vous verrez une confirmation dans la console indiquant que la construction est terminée avec succès..


Si vous avez sélectionné l'option "Installer sur le périphérique connecté", l'application Simulator est à ce stade installée sur le périphérique connecté. Que cette option soit cochée ou non, un exécutable Android appelé Simulator-debug.apk a été créé dans le dossier de sortie que vous avez défini à l'étape 3..

Préparer le périphérique Android pour l'installation

Si vous souhaitez que Shiva 3D Authoring Tool installe le simulateur sur le périphérique Android dans le cadre de la construction, vous devez préparer le périphérique en vue de son installation. Tout d'abord, dans les paramètres de l'application, cochez la case "Sources inconnues", comme indiqué ci-dessous..


Ensuite, dans les options de développement de votre appareil, cochez la case 'Débogage USB' comme indiqué ci-dessous..


Assurez-vous également que votre périphérique est connecté à votre ordinateur de développement via un câble USB (notez que lorsque vous connectez un périphérique Android à votre PC Windows pour la première fois, le système d’exploitation Windows installe le pilote de périphérique approprié sur votre ordinateur. besoin de pointer l’assistant d’ajout de matériel sur l’emplacement du dossier d’installation du SDK Android pour que l’assistant trouve un pilote approprié).

Écrans de simulateur pour le périphérique Android

Le simulateur a été déployé sur un téléphone Motorola Droid équipé du système d'exploitation Android 2.2. La figure ci-dessous montre le raccourci pour Simulator dans le menu Démarrer d'Android (l'icône de démarrage est le fichier image nommé flight-48-48.png utilisé ci-dessus dans l'outil de création)..


Ce qui suit est une capture d'écran du simulateur sur un appareil Android.


La plateforme iPad

Nous allons maintenant utiliser l'outil de création ShiVa pour créer l'application Simulator en vue de son déploiement sur un périphérique iPad. Affichez l'outil de création ShiVa. Sélectionnez l'onglet iPad. Appuyez sur la flèche sous «Ou lancez-vous maintenant…».


L'étape 1 de l'outil de création est affichée. Pour "Application pack", sélectionnez dans votre système de fichiers le fichier Simulator.stk exporté à partir de ShiVa Editor for iOS. Pour 'Icon', sélectionnez le fichier flight-72-72.png qui fait partie de l'archive source accompagnant cette série. Pour 'Startup splashscreen', sélectionnez le fichier flight-768-1024.png, qui fait également partie de l'archive source accompagnant cette série. Observez que ShiVa Authoring Tool affiche un aperçu des fichiers image spécifiés dans les sélections "Icône" et "Écran d'accueil en démarrage". Appuyez sur 'Étape 2: Création' en haut de l'écran..


L'étape 2 de l'outil de création est affichée. Nous allons créer ici un projet Xcode pouvant être utilisé pour créer et installer l’application sur un périphérique iPad. Sélectionnez 'Type de création' en tant que 'Projet'. Pour 'Identifiant de paquet', entrez com.shiva3d.simulator. Pour «Profil d'approvisionnement», indiquez le profil d'approvisionnement de développement à partir du portail d'approvisionnement Apple. Pour «Identité de signature», indiquez le nom du développeur (ou de l'organisation) dans le trousseau associé au certificat dans votre ordinateur de développement Mac OS. Soit 'Version' 1.0.0. Appuyez sur 'Étape 3: Construire' au sommet de l'écran.


L'étape 3 de l'outil de création est affichée. Sélectionnez "Développement" comme "Type de construction". La case à cocher 'Utiliser OpenGLES 1.1' doit être décochée (nous n'avons pas testé la construction avec cette case cochée). Fournissez un dossier de sortie à l'outil de création pour créer un dossier de projet Xcode. Par exemple, nous définissons le dossier de sortie comme étant / Users / cocoderkatz / Desktop / tmpiPad. Ensuite, l'outil de création créera un dossier nommé /Users/cocoderkatz/Desktop/tmpiPad/Simulator_iPad.s3dxproj et copiera les fichiers / dossiers du projet Xcode dans ce dossier. Ne changez pas les autres options. Appuyez sur le bouton Construire.


Une fois la construction terminée, vous verrez un message sur la console indiquant que l'outil de création a créé un dossier de projet Xcode et copié les fichiers associés dans ce dossier. Maintenant, vous pouvez utiliser xCode pour créer et exécuter l'application Simulator sur un périphérique iPad comme vous le feriez normalement avec d'autres projets Xcode..


Écrans de simulateur sur un iPad 2

Le simulateur a été déployé sur un iPad 2 avec iOS 4.3. La figure ci-dessous montre le raccourci du menu de démarrage du simulateur sur un iPad 2 (l'icône de démarrage est le fichier image nommé flight-72-72.png utilisé ci-dessus dans l'outil de création)..


Ce qui suit est une capture d'écran du jeu sur un iPad 2.


La plateforme iPhone

Nous allons maintenant utiliser l'outil de création ShiVa pour créer l'application Simulator en vue de son déploiement sur un appareil iPhone / iPod touch. Affichez l'outil de création ShiVa. Sélectionnez l'onglet iPhone. Appuyez sur la flèche sous «Ou lancez-vous maintenant…».


L'étape 1 de l'outil de création est affichée. Pour "Application pack", sélectionnez dans votre système de fichiers le fichier Simulator.stk exporté à partir de ShiVa Editor for iOS. Pour 'Icon', sélectionnez le fichier flight-114-114.png qui fait partie de l'archive source accompagnant cette série. Pour 'Startup splashscreen', sélectionnez le fichier flight-640-960.png, qui fait également partie de l'archive source accompagnant cette série. Notez que ShiVa Authoring Tool affiche un aperçu des fichiers image spécifiés dans les sélections "Icône" et "Écran d'accueil en démarrage". Appuyez sur 'Étape 2: Création' en haut de l'écran..


L'étape 2 de l'outil de création est affichée. Nous allons créer ici un projet Xcode pouvant être utilisé pour créer et installer l’application sur votre iPhone ou votre iPod touch. Définissez le «Type de création» sur «Projet». Pour 'Identifiant de paquet', entrez com.shiva3d.simulator. Pour «Profil d'approvisionnement», indiquez le profil d'approvisionnement de développement à partir du portail d'approvisionnement Apple. Pour «Identité de signature», indiquez le nom du développeur (ou de l'organisation) dans le trousseau associé au certificat dans votre ordinateur de développement Mac OS. Soit 'Version' 1.0.0. Appuyez sur 'Étape 3: Construire' au sommet de l'écran.


L'étape 3 de l'outil de création est affichée. Sélectionnez "Développement" comme "Type de construction". La case à cocher 'Utiliser OpenGLES 1.1' doit être décochée (nous n'avons pas testé la construction avec cette case cochée).


Fournissez un dossier de sortie à l'outil de création pour créer un dossier de projet Xcode. Par exemple, nous définissons le dossier de sortie comme étant / Utilisateurs / cocoderkatz / Desktop / tmp. Ensuite, l’outil de création crée un dossier nommé /Users/cocoderkatz/Desktop/tmp/Simulator_iPhone.s3dxproj et copie les fichiers / dossiers du projet Xcode dans ce dossier. Ne changez pas les autres options. Appuyez sur le bouton Construire.


Une fois la construction terminée, vous verrez un message sur la console indiquant que l'outil de création a créé un dossier de projet Xcode et copié les fichiers associés dans ce dossier. Maintenant, vous pouvez utiliser Xcode pour créer et exécuter l'application Simulator sur un iPhone ou un iPod Touch comme vous le feriez normalement avec d'autres projets Xcode..


Écrans de simulateur sur les appareils iPod Touch

Le simulateur a été déployé sur un iPod touch avec iOS 4.3. La figure ci-dessous montre le raccourci pour Simulator dans le menu de démarrage de l'iPod touch. L'icône de démarrage est le fichier image nommé flight-114-114.png utilisé ci-dessus dans l'outil de création..


Ce qui suit est une capture d'écran du jeu sur un iPod touch.



Remarques finales

Dans cette série, nous avons développé un simulateur de vol simple utilisant la suite ShiVa 3D et l'avons déployé sur des appareils Android et iOS. Les principaux outils de développement que nous avons utilisés sont l'éditeur ShiVa et l'outil de création ShiVa. ShiVa Editor est utilisé pour développer un jeu en 3D de manière indépendante de la plate-forme. Il permet au développeur de créer des graphiques 3D de l'application et du code correspondant. La sortie de l'éditeur ShiVa est un fichier d'exportation spécifique à la plate-forme, par exemple. un pour Android OS ou un pour iOS. Le fichier d'exportation de l'éditeur ShiVa est ensuite importé dans l'outil de création ShiVa pour générer un fichier exécutable ou un fichier de projet pour la plate-forme spécifique. Pour Android, nous avons généré un fichier exécutable Android à l’aide de ShiVa Authoring Tool. Pour iPad2 et iPhone / iPod, nous avons généré les projets Xcode correspondants à l'aide de l'outil de création ShiVa..

Suite de produits permettant de développer des applications multiplates-formes sans écrire de code spécifique à la plate-forme, ShiVa 3D Suite est une aide précieuse pour ceux qui souhaitent créer des applications 3D pour les appareils iOS et Android. Visitez la suite ShiVa3D pour connaître les autres plates-formes prises en charge par l'éditeur ShiVa et l'outil de création ShiVa..

Ci-dessous, nous donnons des commentaires supplémentaires sur l'application Simulator dont nous avons discuté dans cette série.

Création de terrain

Lors du développement du simulateur, nous avons introduit diverses fonctionnalités de base de la fonctionnalité de création de terrain dans ShiVa Editor. Des effets visuels plus sophistiqués peuvent être ajoutés à un terrain. Par exemple, vous pouvez ajouter de la neige aux montagnes, définir différentes textures telles que la roche, le sol, la végétation ou l’eau. Cependant, certains de ces effets visuels nécessiteront l'importation de fichiers image représentant la texture de terrain particulière. En d'autres termes, vous aurez besoin de ressources créées en dehors de ShiVa 3D Suite..

Le terrain que nous avons créé a des dimensions limitées. Il faut des techniques spéciales pour développer un terrain qui ne finit jamais, c’est-à-dire un terrain aux dimensions infinies. Pour une discussion à ce sujet, voir http://www.stonetrip.com/developer/forum/viewtopic.php?f=39&t=20668.

Unités Et Variables

La notion d'unité de distance dans Shiva3D Editor n'est pas un concept absolu. Il doit être interprété en fonction de l'application et du périphérique particulier sur lequel l'application va s'exécuter. Dans le simulateur, trois paramètres importants liés à l’unité de distance sont:

  • taille du terrain, soit 4 096 x 4 096 unités;
  • altitude initiale de l'avion, soit 50 unités, définie comme la coordonnée initiale de l'axe Y,
  • la variable V, représentant la vitesse, dont la valeur est 0,25.

À partir d’un examen de la fonction move () où nous utilisons la variable V, il est facile de voir que le plan se déplace à 0,25 unité par image. (Rappelez-vous que la fonction move () est appelée à chaque image.) Si vous déployez l'application sur un périphérique affichant 20 images / seconde, la vitesse simulée sera de 18 000 unités / heure. Supposons maintenant qu'une unité de distance correspond à 30 pieds. Ensuite, en gardant à l’esprit que 1 mile = 5 280 pieds:

  • la taille du terrain est d'environ 23,3 milles (= 4 096 unités x 30 pieds x 1 mile / 5 280 pieds)
  • l'altitude initiale de l'avion est de 1 500 pieds (= 50 unités x 30 pieds)
  • la vitesse de l'avion est d'environ 102,3 miles / heure (= 18 000 unités / heure x 30 pieds x 1 mile / 5 280 pieds)

On aurait pu supposer qu'une unité de distance correspond à 50 pieds. Ensuite, la taille du terrain, l'altitude initiale de l'avion et la vitesse de l'avion changeraient en conséquence. Nous faisons simplement des commentaires sur le fait qu’une unité de distance n’est pas une valeur physique absolue. C'est une entrée de paramètre pour diverses fonctions dans notre jeu de simulateur. Ce qui compte vraiment, c'est si l'utilisateur percevra la dynamique simulée comme sensible ou non..

Les deux autres variables importantes pour créer une expérience de vol réaliste sont dP et dR (voir pitch () et bank () ci-dessus). Le dP est utilisé pour contrôler le taux de tangage, tandis que dR est utilisé pour contrôler le taux de roulis et le taux de virage. Nous avons déterminé les valeurs finales de V, dP et dR par essais et erreurs après le déploiement du simulateur à plusieurs reprises..

Nous notons enfin que les valeurs actuelles pour V, dP et dR dans les listes de codes ci-dessus semblent mieux convenir aux appareils iPad 2 et iPod touch que Motorola Droid. C'est probablement parce que Motorola Droid, étant l'un des premiers exemples de téléphones Android, dispose d'un processeur plus lent que les deux autres. Avec les valeurs révisées définies comme suit, nous avons observé une dynamique plus réaliste dans Motorola Droid.

  • V = 0,75 (au lieu de 0,25)
  • dP = 0,2 (au lieu de 0,04)
  • dR = 0,15 (au lieu de 0,05)

Comment étendre le simulateur

Le lecteur intéressé pourrait étendre le simulateur pour le rendre plus attrayant. Certaines idées sont énumérées ci-dessous par ordre croissant de complexité..

  • Ajoutez du son au jeu qui se joue quand une manœuvre commence. Un bon point de départ est le tutoriel du chapitre 7 du Shiva Book de Shando.
  • Ajoutez des repères sur le terrain pour que l’avion puisse slalomer. Pour chaque cible manquée, attribuez un point de pénalité et affichez-le à l'écran..
  • Ajoutez un modèle d'avion 3D à suivre devant la caméra. Attribuez les boutons de commande pour manœuvrer ce plan. Laissez les actions du pouce contrôler la caméra. L'utilisateur naviguera dans l'avion et la caméra pour que l'avion ne soit jamais perdu de vue.