Dans cette série de didacticiels, vous apprendrez à créer un jeu comme Snake. L'objectif du jeu est de saisir les pommes à l'écran pour augmenter le score. Continuer à lire!
En utilisant des graphiques prédéfinis, nous coderons un jeu divertissant à l'aide de Lua et des API Corona SDK.
Le joueur pourra frapper un puck en faisant glisser la palette sur l’écran, vous pourrez modifier les paramètres du code pour personnaliser le jeu..
La première chose à faire est de sélectionner la plate-forme sur laquelle vous souhaitez exécuter notre application. Ainsi, nous pourrons choisir la taille des images que nous utiliserons..
La plateforme iOS présente les caractéristiques suivantes:
Android étant une plate-forme ouverte, il existe de nombreux appareils et résolutions. Voici quelques-unes des caractéristiques d'écran les plus courantes:
Dans ce didacticiel, nous nous concentrerons sur la plate-forme iOS avec la conception graphique, spécialement conçue pour la distribution sur un iPhone / iPod touch, mais le code présenté ici devrait également s'appliquer au développement Android avec le SDK Corona..
Une interface simple et conviviale sera utilisée. Cela implique plusieurs formes, boutons, bitmaps et plus.
Les ressources graphiques d'interface nécessaires à ce tutoriel sont disponibles dans le téléchargement ci-joint..
Selon le périphérique que vous avez sélectionné, vous devrez peut-être exporter les graphiques dans les ppi recommandés. Vous pouvez le faire dans votre éditeur d'images préféré..
J'ai utilisé le Ajuster la taille… fonction dans l'application Aperçu sur Mac OS X.
N'oubliez pas de donner un nom descriptif aux images et de les enregistrer dans votre dossier de projet..
Nous allons utiliser des effets sonores pour améliorer le jeu, les sons utilisés dans cette application ont été générés par AS3SFXR..
Un fichier externe sera utilisé pour que l’application passe en plein écran sur tous les appareils, le config.lua fichier. Ce fichier indique la taille d'écran d'origine et la méthode utilisée pour redimensionner ce contenu si l'application est exécutée dans une résolution d'écran différente..
application = contenu = largeur = 320, hauteur = 480, échelle = "boîte aux lettres",
Ecrivons l'application!
Ouvrez votre éditeur Lua préféré (tout éditeur de texte fonctionnera, mais vous n'aurez pas la coloration syntaxique) et préparez-vous à écrire votre superbe application. N'oubliez pas de sauvegarder le fichier sous main.lua dans votre dossier de projet.
Nous structurerons notre code comme s'il s'agissait d'une classe. Si vous connaissez ActionScript ou Java, la structure vous est familière..
Necesary Classes Variables et constantes Déclarer des fonctions méthodes de la classe contructor (fonction principale) (autres fonctions) appelle la fonction principale
display.setStatusBar (display.HiddenStatusBar)
Ce code masque la barre d'état. La barre d'état est la barre en haut de l'écran de l'appareil qui affiche l'heure, le signal et d'autres indicateurs..
Un graphique simple est utilisé comme arrière-plan pour l'interface de l'application, la ligne de code suivante le stocke.
-- Graphiques - [Arrière-plan] local bg = display.newImage ('bg.png')
Ceci est la vue du titre, ce sera le premier écran interactif à apparaître dans notre jeu. Ces variables stockent ses composants..
-- [Vue titre] local titleBg local playBtn local creditsBtn local titleView
Cette vue montrera le générique et le copyright du jeu, cette variable sera utilisée pour le stocker..
-- [CreditsView] crédits locauxVoir
Cette image sera placée sur notre arrière-plan précédent. Les lignes suivantes stockent également les graphiques pour le pavé à l'écran.
-- [Fond du jeu] gameBg local - [Pad] local en haut à gauche local en bas à droite local
C'est le graphique Apple, référencé dans la variable suivante. Saisir ces objets augmentera la taille / les parties du serpent.
-- [Pomme] pomme locale
La première partie du serpent, ce sera dans l'étape au début. UNE zone touchée sera créé dessus et les deux seront regroupés dans la tête variable.
-- Responsable local GFX responsable localHitArea responsable local
Ce graphique sera ajouté chaque fois que le serpent mange une pomme.
La ligne suivante gère le champ de texte qui affichera les scores.
-- Score score local
Ce sont les variables que nous allons utiliser, lisez les commentaires dans le code pour en savoir plus sur eux.
-- Variables dir local - direction actuelle du serpent local démarré - utilisé pour démarrer la minuterie locale timerSrc vitesse locale = 500 local mConst = 17 - # de pixels pour déplacer chaque compteur de minuterie locale pommes --apples groupe local lastPart --last pièce ajoutée à snake local firstPart pièces locales - groupe de pièces local actuel = 0 - un numéro attribué à chaque pièce
Déclarer toutes les fonctions comme local au début.
-- Fonctions local Main = startButtonListeners local = showCredits local = hideCredits local = showGameView local = gameListeners local = movePlayer local = hitTestObjects local = mise à jour locale =
Nous allons ensuite créer la fonction qui initialisera toute la logique du jeu:
fonction Main () - code… fin
Maintenant, nous plaçons TitleView dans la scène et appelons une fonction qui ajoutera le robinet les auditeurs aux boutons.
function Main () titleBg = display.newImage ('titleBg.png', display.contentCenterX - 100.5, 40.5) playBtn = display.newImage ('playBtn.png', display.contentCenterX - 27, display.contentCenterY + 10) creditsBtn = display.newImage ('creditsBtn.png', display.contentCenterX - 48, display.contentCenterY + 65) titleView = display.newGroup (titleBg, playBtn, creditsBtn) startButtonListeners ('add') end
Dans cette partie de la série, vous avez appris l'interface et la configuration de base du jeu. Dans la prochaine et dernière partie de la série, nous nous occuperons du mouvement du serpent, de la détection de collision et des dernières étapes à suivre avant la sortie de l'application, telles que tester, créer un écran de démarrage, ajouter une icône et enfin créer l'application. Restez à l'écoute pour la dernière partie!