Le deuxième tutoriel de cette série en trois parties a débuté avec "Game Geometry", axé sur les aspects géométriques sous-jacents du jeu, et a également commencé à présenter les étapes nécessaires à la création du jeu dans l'éditeur ShiVa. Cette dernière étape du didacticiel se poursuivra là où les étapes précédentes de l’éditeur ShiVa se sont arrêtées. Il montrera ensuite comment exporter le jeu sur les plateformes iOS ou Android..
Ce tutoriel poursuivra la discussion commencée dans la section précédente intitulée "Développer un puzzle avec l'éditeur ShiVa". Ici, nous allons décrire l’importation des composants du HUD et les derniers ajustements sur la progression du jeu jusqu’à présent. Ensuite, nous conclurons la section "Développement de casse-tête avec l'éditeur ShiVa" via un test unitaire. Dans la section "Authoring Tool", nous montrerons comment utiliser l'outil de création ShiVa Authoring Tool pour convertir le Puzzle en deux applications différentes, l'une pour Android OS et l'autre pour iPad. Nous allons terminer la série dans la section intitulée "Conclusions".
Nous allons maintenant importer les composants du HUD, y compris les polices, les boutons, les étiquettes, etc. Accédez à votre répertoire local où vous avez stocké l'archive de téléchargement accompagnant cet article. Sélectionnez PuzzleHUD.ste et appuyez sur Importer. Une fois l'importation terminée, vous devriez voir Bell_Gothic_Std_Light et Arial_Unicode_MS dans l'explorateur de données sous Casse-tête - Ressources - Polices.
De plus, dans l'explorateur de données sous Puzzle - Ressources - Textures, vous verrez les textures nommées Bell_Gothic_Std_Light et Arial_Unicode_MS..
En même temps, vous devriez voir les composants HUD importés via PuzzleHUD.ste. Premièrement, sous Puzzle - Ressources - HUD, observez que vous avez PuzzleHUD..
Deuxièmement, affichez l'éditeur de palette et l'explorateur de données côte à côte. Dans l'explorateur de données, double-cliquez sur PuzzleHUD, qui se trouve sous Puzzle - Ressources - HUD. Dans l’éditeur HUD, vous verrez ce qui suit.
Si vous faites défiler dans l'éditeur de HUD, cela devrait ressembler à ceci:
Une brève explication des composants du HUD est donnée ci-dessous. Pour plus de détails, voir la section "Affichage tête haute" dans le deuxième tutoriel de cette série.
Contexte
, Temps
et Barre d'outils
sont les étiquettes pour la couleur d'arrière-plan, la minuterie et la barre d'outils.p11
à travers p69
sont les étiquettes représentant les pièces du puzzle.Redémarrer
, Résoudre
et Démarrer Pause
sont les boutons avec les étiquettes "Nouveau", "Résoudre" et "Démarrer" (ou "Pause", en fonction de l'état), respectivement.restartAction
, resolAction
et startPauseAction
sont les actions déclenchées en appuyant sur Redémarrer
, Résoudre
et Démarrer Pause
, respectivement.Après avoir importé toutes les ressources nécessaires, nous allons maintenant procéder à certains ajustements. Placez Game Editor et Data Explorer côte à côte. Dans l'explorateur de données, sous Puzzle - Jeux, double-cliquez sur Puzzle. L'éditeur de jeu devrait maintenant avoir le jeu de puzzle chargé. Notez que la section AI principale de l'utilisateur est vide sous l'onglet Principal..
Dans l'explorateur de données, sous Puzzle - Ressources - AIModels, sélectionnez PuzzleAI. Glissez-le et déposez-le dans la section "IA principales utilisateurs" de l'éditeur de jeu, sous l'onglet Principal. PuzzleAI est désormais répertorié dans la section User AIs..
Dans l'éditeur de jeu, cliquez sur l'onglet Ressources. Cela aura l'air vide. Dans l'explorateur de données, sous Puzzle - Ressources - HUD, sélectionnez PuzzleHUD, puis faites-le glisser dans la section Ressources de l'Editeur de jeu. De même, dans l'explorateur de données, sous Puzzle - Ressources - SoundBanks, sélectionnez PuzzleSoundBank et faites-le glisser dans la section Ressources. L'onglet ressources devrait ressembler à ceci.
Dans l'explorateur de données, sous Puzzle - Ressources - Textures, sélectionnez les textures p11 à p69 et faites-les glisser dans la section Ressources de Game Editor. L'onglet ressources devrait ressembler à ceci.
Nous sommes maintenant tous ensemble. Pour tester notre jeu, cliquez sur le bouton Aperçu dans la barre d'outils de l'éditeur ShiVa. Dans le menu, sélectionnez Affichage> Taille> iPad> 768x1024..
De plus, dans le menu, sélectionnez Affichage> Mode d'affichage> Exécution..
Maintenant, dans le menu, appuyez sur Play. Vous devriez voir le jeu commencer.
Maintenant, vous pouvez jouer au jeu en utilisant des clics de souris pour émuler des événements tactiles à l'écran.
Dans cette section, nous verrons comment exporter le jeu depuis l'éditeur ShiVa pour l'importer dans l'outil de création ShiVa..
Dans l'explorateur de données, dans Puzzle - Ressources - Jeu, sélectionnez Puzzle et dans le menu contextuel, sélectionnez Exporter le jeu..
Pour le champ "Nom d'exportation", tapez Puzzle. Choisissez un dossier local pour générer le fichier d'exportation (par exemple, C: \ exports \). Assurez-vous également de sélectionner "Package d'exécution (.stk)" et Android.
Enfin, appuyez sur Exporter. Si vous exportez une archive pour la première fois à partir d'un projet, son exécution peut prendre plusieurs minutes. Lorsque l'exportation est terminée, vous pouvez appuyer sur OK pour fermer la boîte de dialogue..
Exporter pour iOS est très similaire. Dans Explorateur de données, dans Puzzle - Ressources - Jeu, sélectionnez Puzzle et dans le menu contextuel, sélectionnez Exporter le jeu. Pour le champ "Nom d'exportation", tapez Puzzle. Choisissez un dossier local pour générer le fichier d'exportation (par exemple, C: \ exports \). Assurez-vous également de sélectionner "Package d'exécution (.stk)" et iOS (Remarque: si vous souhaitez utiliser le même dossier et les mêmes noms de fichiers d'exportation pour les exportations Android OS et iOS, assurez-vous que ces exportations ne se écrasent pas.).
Enfin, appuyez sur Exporter. Une fois l'exportation terminée, vous pouvez appuyer sur OK pour fermer la boîte de dialogue..
Pour des raisons d'espace, nous ne fournissons pas de révision de code explicite pour l'application Puzzle. Toutes les fonctions et tous les gestionnaires fournis avec PuzzleAI.ste ont des commentaires détaillés pour décrire leurs fonctionnalités particulières. Le lecteur intéressé est invité à consulter ces scripts pour plus de détails sur le code..
Nous avons développé le jeu Puzzle sans écrire de code spécifique aux plateformes iOS ou Android. Nous allons maintenant utiliser l'outil ShiVa Authoring pour convertir le Puzzle en deux applications différentes, une pour Android OS et une pour iPad..
Pour suivre les instructions ci-dessous, vous aurez besoin de ios-icon-72-72.png, ios-splash-768-1024.png, android-icon-48-48.png et android-splash-480-800.png qui font partie des archives de téléchargement accompagnant cet article.
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 "Pack d'application", sélectionnez dans votre système de fichiers le fichier Puzzle.stk exporté à partir de l'éditeur ShiVa pour Android. Pour "Icon", sélectionnez android-icon-48-48.png, qui fait partie de l'archive source accompagnant cet article. Pour "Startup splashscreen", sélectionnez le fichier android-splash-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 "Icône" et "Écran d'accueil en démarrage". Appuyez sur "Étape 2: Création" au sommet 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" comme "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 cet article). Pour "Identifiant de paquet", entrez com.shiva3d.test. Soit "Version" et "Code de version" les versions 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". Depuis que je souhaite installer le Puzzle sur mon appareil Android dans le cadre de la construction, j'ai coché la case "Installer sur un appareil connecté"..
Pour que cette option fonctionne, vous devez avoir terminé les étapes décrites dans "Préparation du périphérique Android en vue de 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 Puzzle dans "Dossier de sortie", qui pourra être installé ultérieurement à l'aide de l'outil ADB sous Android..
Laissez "backend audio" sur "Default". 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 "Script de post-construction personnalisé" demeurer en tant qu'option "Aucun 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 un appareil connecté", l'application Puzzle est à ce stade installée sur l'appareil connecté. Que cette option soit cochée ou non, un exécutable Android appelé Puzzle-debug.apk a été créé dans le dossier de sortie que vous avez défini à l'étape 3..
Affichez l'outil de création ShiVa. Sélectionnez l'onglet iPad. Appuyez sur la flèche sous "Ou commencez maintenant…".
L'étape 1 de l'outil de création est affichée. Pour le pack d'applications, sélectionnez dans votre système de fichiers le fichier Puuzle.stk exporté à partir de ShiVa Editor pour iOS. Pour Icon, sélectionnez ios-icon-72-72.png qui fait partie de l’archive source accompagnant ce didacticiel. Pour Startup splashscreen, sélectionnez le fichier ios-splash-768-1024.png, qui fait également partie de l’archive source accompagnant ce didacticiel. Appuyez sur Étape 2: Création au sommet 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 iPad. Sélectionnez le type de création en tant que projet. Pour l'identifiant du paquet, entrez com.shiva3d.test. Pour le profil Provision, indiquez le profil de provisionnement de développement de Apple Provisioning Portal. 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: Construisez 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. Fournissez un dossier de sortie pour que l'outil de création puisse 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/Puzzle_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 le jeu de réflexion sur un appareil iPad comme vous le feriez normalement avec d'autres projets Xcode..
Dans cet article, nous avons abordé le développement de jeux multi-plateformes pour tablettes Android et iPad à l'aide de la suite ShiVa3D. Bien que principalement destiné au développement de jeux en 3D, ShiVa3D Suite peut également être utilisé pour créer des jeux en 2D. L'exemple d'application étudié dans ce didacticiel est un jeu 2D construit à l'aide d'éléments HUD (Head Up Display) de ShiVa3D..
res
et res / drawable
Dossiers.