Les alertes sont une méthode système prédéfinie permettant d'afficher des informations à l'utilisateur. Elles sont généralement utilisées pour afficher des messages courts et peuvent inclure une ou plusieurs options permettant de déterminer une action postérieure. Dans ce didacticiel, nous allons découvrir comment mettre en œuvre ces alertes et comment créer des boutons de base et ouvrir une URL dans Safari. Continue de lire!
Utiliser la couronne originaire de la classe et la showAlert () méthode, nous afficherons une alerte personnalisée à l'aide d'un simple bouton sur scène.
La première chose à faire est de sélectionner la plate-forme sur laquelle vous souhaitez exécuter votre application. Ainsi, vous pourrez choisir la taille des images que vous utiliserez..
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 tutoriel, nous allons nous concentrer sur la plate-forme iOS, spécialement conçue pour la distribution sur un iPhone / iPod touch..
Nous allons créer une interface de base avec un bouton qui déclenchera une alerte lorsque vous appuierez dessus. Le titre de l'alerte, le message et les noms des boutons seront définis dans le code..
Selon le périphérique que vous avez sélectionné, vous devrez exporter les graphiques dans l'IPP recommandé. 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 sous Mac OS X.
N'oubliez pas de donner un nom descriptif aux images et de les enregistrer dans votre dossier de projet..
Temps d'écrire notre 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.
Tout d’abord, nous masquons la barre d’état, c’est la barre en haut de l’écran qui indique l’heure, le signal et d’autres indicateurs..
display.setStatusBar (display.HiddenStatusBar)
Maintenant, nous ajoutons le fond de l'application.
fond local = display.newImage ("background.png")
Cette ligne crée la variable locale Contexte et utilise le afficher API pour ajouter l'image spécifiée à la scène. Par défaut, l'image est ajoutée à 0,0 en utilisant le coin supérieur gauche comme point de référence..
Répétez le processus avec l'image du bouton, en le plaçant au centre de la scène. La fonction de bouton sera créée plus tard dans le code.
local alertButton = display.newImage ("alertButton.png") alertButton: setReferencePoint (display.CenterReferencePoint) alertButton.x = 160 alertButton.y = 240
Lorsque l'utilisateur clique sur l'un des boutons d'option dans la fenêtre Alerte a cliqué événement est déplacé, nous devons vérifier la indice du bouton cliqué afin de savoir quelle option a été sélectionnée. Une alerte permet d'inclure jusqu'à 6 boutons. Son index est défini par l'ordre dans lequel il a été écrit dans l'appel d'alerte..
La fonction suivante gère ce processus, son écouteur est créé dans l'appel d'alerte (affiché à l'étape suivante).
fonction locale onClick (e) si e.action == "a cliqué" puis si e.index == 1 alors - Une action elseif e.index == 2 puis system.openURL ("http://mobile.tutsplus.com ") fin fin fin
Cette fonction sera exécutée lorsque vous appuierez sur le bouton d'alerte. Elle utilisera le native.showAlert () méthode d'affichage de l'alerte. L'alerte sera liée à une variable qui servira d'identifiant d'alerte, de cette manière, elle pourra être localisée, réutilisée ou supprimée par l'utilisateur. native.cancelAlert () méthode.
fonction alertButton: tapez sur (e)
alerte locale = native.showAlert ("MobileTuts +", "Didacticiels de développement mobile", "OK", "En savoir plus", onClick)
fin
Cette méthode a quatre paramètres, examinons-les:
native.showAlert (titre, message, badges, écouteur)
Le bouton a maintenant une fonction à exécuter lorsque vous appuyez dessus, mais cette fonction seule ne pourra pas réagir sans un auditeur.
La ligne de code suivante définit cet auditeur:
alertButton: addEventListener ("tap", alertButton)
Si tout fonctionne comme prévu, nous sommes presque prêts à créer notre application pour tester les appareils. Encore une chose: notre icône d'application.
En utilisant les graphiques que vous avez créés avant de pouvoir créer une belle et jolie icône, la taille de l'icône pour les icônes de l'iPhone est 57x57px, mais l'iTunes Store utilise un format de 512x512px. Si vous souhaitez optimiser vos images pour l'écran Retina de l'iPhone 4, vous aurez également besoin d'une version de 114x114px de l'icône de l'application..
Il n’est pas nécessaire d’avoir les angles arrondis ni l’éblouissement transparent, iTunes et le système d’exploitation iPhone l’appliqueront pour vous..
Avec ce tutoriel, vous apprendrez à afficher des alertes pour montrer un message à l'utilisateur et exécuter un code prédéterminé en fonction de l'option sélectionnée..
Merci d'avoir lu ce tutoriel, j'espère que vous l'avez trouvé utile!