Mobiletuts + couvrira toutes les principales plates-formes mobiles - iPhone, Windows, Android et Blackberry. Ce tutoriel traite du développement avec le SDK pour iPhone. Vous apprendrez des informations sur la plate-forme iPhone, comment configurer et configurer votre environnement de développement, ainsi que sur les étapes nécessaires à la création d'une simple application de cookie de fortune.!
iOS est une variante optimisée pour les mobiles de Mac OS X créée par Apple Inc. Elle est distribuée avec tous les appareils iPod touch, iPhone et iPad et n'occupe qu'environ 500 Mo d'espace de stockage..
Il existe trois approches distinctes pour le développement iOS:
L'iPhone OS 1.0 d'origine nécessitait que toutes les applications non Apple soient basées sur le Web et exécutées dans le navigateur Web de Mobile Safari. Mobile Safari ne prenant pas en charge les plug-ins tels qu'Adobe Flash ou Microsoft Silverlight, toutes les applications tierces étaient donc à l'origine écrites en HTML, CSS et JavaScript. Cette méthode de développement reste une option viable aujourd'hui, en particulier pour les applications devant être accessibles sur un large éventail de périphériques ou pour les équipes de développement ayant une aversion pour Mac OS X et Objective-C..
Avec la sortie de l'iPhone OS 2.0 et l'introduction du SDK pour iPhone et de l'iTunes App Store, les développeurs ont été encouragés à écrire des applications natives pour iPhone à l'aide d'Objective-C et de Xcode. Les applications natives sont des fichiers binaires compilés qui sont installés et exécutés sur le périphérique de l'utilisateur. Ces applications bénéficient d'un accès considérable au matériel du périphérique et seuls les fichiers binaires d'applications natives peuvent être distribués via l'iTunes App Store. Étant donné que le système d'exploitation iPhone fonctionne sur des appareils iPod touch, iPhone et iPad, la plupart des applications peuvent être conçues pour les trois appareils avec seulement des variations mineures de code, bien que l'optimisation de votre application pour un écran beaucoup plus grand présente des avantages considérables.
Il est également possible de combiner les approches ci-dessus et de créer des applications iPhone installées sur le périphérique d'un utilisateur, écrites principalement en HTML, CSS et JavaScript et diffusées via l'iTunes App Store. De telles applications gagnent en popularité grâce aux bibliothèques open source telles que QuickConnect et aux plates-formes telles que PhoneGap, AppCelerator et rhomobile..
Mobiletuts + couvrira toutes les méthodes de développement iPhone OS décrites ci-dessus, mais ce didacticiel se concentrera sur le développement d'applications natives avec le SDK officiel iPhone utilisant Objective-C et Xcode. C'est la méthode recommandée par Apple pour créer des applications natives pour iPhone OS destinées à la distribution dans l'iTunes App Store..
Pour développer des applications pour iPhone SDK et poursuivre ce didacticiel, vous devez disposer des éléments suivants:
Pour écrire des applications natives avec le SDK iOS officiel et tester vos applications dans le simulateur officiel iPhone ou iPad d'Apple, vous devez être en mesure d'exécuter Snow Leopard, le dernier système d'exploitation pour ordinateurs de bureau et ordinateurs portables d'Apple..
Cela est nécessaire pour télécharger l'iPhone SDK 4, l'IDE Xcode et le simulateur iPhone. Vous devrez vous inscrire ici pour un compte de développeur Apple. L'inscription est gratuite et vous permettra d'exécuter des applications dans le simulateur iPhone. Un compte gratuit suffit pour ce didacticiel. Toutefois, pour exécuter vos applications sur un appareil ou pour le publier via l'iTunes App Store, vous devrez payer pour vous inscrire au programme pour développeurs iPhone..
Une fois connecté à votre compte de développeur, téléchargez et installez Xcode 3.2.5 et le SDK iPhone 4 (ou les dernières versions disponibles)..
Après avoir obtenu ce qui précède, vous devriez être prêt à vous lancer dans la construction de «Fortune Crunch», une application iPhone simple qui permettra aux utilisateurs de «crunch» un biscuit de fortune et de lire un message..
Xcode est un environnement de développement intégré (IDE) qui combine les multiples outils nécessaires pour créer un programme iPhone en une seule application. Lancez Xcode maintenant en le recherchant dans Spotlight ou en utilisant finder pour accéder au chemin d’installation par défaut de / Développeur / Applications / Xcode.
Sélectionnez «Créer un nouveau projet Xcode» dans la boîte de dialogue qui apparaît..
Sélectionnez «Application» sous iOS dans la colonne de gauche. Familiarisez-vous avec les différents types de modèles d'application disponibles dans le panneau de contenu. Ce tutoriel sera une application simple et à vue unique. Sélectionnez donc l’icône «Application basée sur les vues», puis cliquez sur «Choisir».
Entrez le texte «FortuneCrunch» dans le champ «Enregistrer sous» pour nommer notre projet et cliquez sur «Enregistrer».
Le modèle de projet FortuneCrunch devrait maintenant être affiché à l'écran.
Il est important de réaliser que ce point de départ est un programme entièrement exécutable. Allez-y et utilisez le simulateur iPhone pour exécuter le modèle en cliquant sur “Construire et exécuter” ou en sélectionnant Construire> Construire et exécuter de la barre de menu.
Bien que le modèle d'application par défaut soit incroyablement terne, le simulateur iPhone ne l'est pas. Cliquez sur le bouton d'accueil du simulateur pour revenir au dock iPhone et parcourez-le un peu. Notez également les raccourcis suivants du simulateur:
Commande + flèche gauche: Faire pivoter l'appareil à gauche.
Commande + flèche droite: Faire pivoter l'appareil vers la droite.
Ctrl + Commande + Z: Émule un mouvement de secousse (ceci ne s'affichera pas visuellement).
L'interface par défaut fournie avec un modèle basé sur View est incroyablement ennuyeuse, continuons donc en créant notre interface utilisateur de l'application de gestion de fortune. Nous allons utiliser deux images de biscuits de fortune prises spécifiquement pour ce didacticiel: cookie-closed.png et cookie-crunched.png. Vous pouvez les trouver dans le fichier de téléchargement joint à cet article et ils sont distribués gratuitement sous licence WTFPL..
Après avoir obtenu les images de cookie de fortune nécessaires, lancez Interface Builder en accédant au volet "Groupes et fichiers" de Xcode, en développant le dossier "Ressources", puis en double-cliquant sur le fichier FortuneCrunchViewController.xib..
Interface Builder est un outil graphique qui vous permet de créer rapidement et facilement la mise en page de votre application sans écrire une seule ligne de code Objective-C. Comme nous le verrons, cela vous permet également de définir visuellement des relations entre des objets tels que des boutons et les méthodes que vous écrivez dans votre application..
Vous devez connaître quatre fenêtres principales d'Interface Builder:
Maintenant que vous connaissez Interface Builder, nous pouvons continuer à configurer l'interface de notre application..
Commençons par changer la couleur de fond du gris en blanc. Faites cela en sélectionnant l'instance de vue décrite ci-dessus. Les propriétés de la vue doivent maintenant être chargées dans la fenêtre d’inspecteur. Sélectionnez l'onglet Attributs dans l'inspecteur, recherchez l'attribut d'arrière-plan et la palette de couleurs, puis modifiez la couleur en blanc..
Nous allons maintenant créer un bouton représentant notre biscuit de fortune. Dans la fenêtre de la bibliothèque, tapez «UIButton» dans la zone de recherche en bas..
Ensuite, faites glisser le bouton sur l'occurrence de la vue.
Nous devons ajouter les images cookie-closed.png et cookie-crunched.png dans le dossier des ressources de Xcode. Revenez à la fenêtre principale de Xcode et faites glisser chaque image dans le dossier Ressources du volet Groupes et fichiers. Une boite de dialogue s affiche. Cochez la case "Copier les éléments dans le dossier du groupe de destination" et cliquez sur "Ajouter".
Revenez à Interface Builder et sélectionnez le UIButton ajouté précédemment. Utilisez l'onglet Attributs de l'inspecteur pour modifier la propriété de l'image en cookie-crunched.png et le type de l'image en "personnalisation". Redimensionnez le UIB à la taille de l'image en sélectionnant Mise en page> Taille adaptée.
Nous avons maintenant un cookie de fortune cassé à l'écran. Créons notre fortune en faisant glisser un UILabel de la bibliothèque vers la vue. Changez le texte pour lire «Happy iPhone Hacking» et utilisez l'onglet des attributs de l'inspecteur pour changer la police en taille de 12 points et la police de caractère en gras. Adaptez UILabel au texte et placez-le sur le papier blanc situé au-dessus de l'image du cookie brisée. Maintenant, cochez la case "Caché" car nous voulons que cette étiquette ne s'affiche que lorsque l'utilisateur a cliqué sur le bouton.
Sélectionnez à nouveau le bouton UIB et modifiez le paramètre d'image dans l'onglet des attributs de l'inspecteur en cookie-closed.png..
Veillez à enregistrer tout votre travail dans Interface Builder., puis revenez à Xcode, puis compilez et exécutez à nouveau votre application. Vous devriez maintenant voir le bouton ininterrompu du cookie de la fortune à l'écran.
Avec l'interface configurée, nous sommes prêts à plonger dans Objective-C et à commencer à écrire le code qui fera fonctionner notre application..
De retour dans Xcode, sélectionnez le fichier FortuneCrunchViewController.h sous le Des classes dossier dans le Groupes et fichiers vitre. Ce fichier est appelé fichier «en-tête», «interface» ou «déclaration» pour la classe FortuneCrunchViewController. C’est là que nous déclarons les variables internes, méthodes, protocoles et autres composants qui seront utilisés dans la classe..
La classe FortuneCrunchViewController était représentée visuellement dans Interface Builder en tant que «canevas» sur lequel nous pouvions faire glisser les instances UILabel et UIButton. Nous allons maintenant mettre à jour le fichier d'en-tête de classe afin de pouvoir référencer ces objets plus tard dans notre code.
Mettez à jour le fichier d'en-tête en apportant les modifications suivantes:
#importation@interface FortuneCrunchViewController: UIViewController IBOutlet UIButton * fortuneCookieButton; IBOutlet UILabel * fortuneLabel; @property (nonatomic, keep) IBOutlet UIButton * fortuneCookieButton; @property (nonatomic, keep) IBOutlet UILabel * fortuneLabel; - (IBAction) crunchCookie: expéditeur (id); @fin
La ligne 1 est connue comme directive de préprocesseur et indique essentiellement au préprocesseur de rendre le cadre UIKit disponible pour une utilisation au sein de la classe..
La ligne 3 utilise @interface pour déclarer qu'il s'agit d'une définition d'interface pour la classe FortuneCrunchViewController. La partie ": UIViewController" de cette ligne signifie que FortuneCrunchViewController est une classe enfant de la classe UIViewController..
La ligne 5 déclare un pointeur de classe UIButton appelé fortuneCookieButton en tant qu'IBOutlet. La balise IBOutlet n'a pas de signification réelle pour le compilateur et est uniquement utilisée par Interface Builder pour déterminer quels objets de la classe peuvent être connectés à leur représentation visuelle dans le fichier Interface Builder XIB. La classe UIButton devrait être familière de notre travail à l'étape 2.
La ligne 6, similaire à la ligne 5, déclare un pointeur de classe UILabel appelé fortuneLabel en tant qu'IBOutlet..
Les lignes 10 à 11 utilisent l'instruction @property pour indiquer au compilateur que fortuneCookieButton et fortuneLabel seront accessibles en tant que propriétés de la classe, mais que nous déclarerons ultérieurement les méthodes pour y accéder de manière dynamique..
La ligne 13 est une signature de fonction pour la méthode crunchCookie. La partie - (IBAction) de l'instruction déclare que cette méthode est du type de données IBAction, qui est essentiellement identique à celui du type de données void, la seule différence notable étant qu'IBAction rend cette méthode accessible en tant qu'action dans Interface Builder. . La partie ": (id) sender" de l'instruction indique au compilateur d'accepter un argument appelé "expéditeur" du type de données "id". Dans Cocoa-Touch, id est un type de données générique qui peut être une référence de pointeur vers n'importe quelle sous-classe de NSObject. Dans notre application, l'appel de la méthode crunchCookie en appuyant sur le fortuneCookieButton envoie en réalité une référence au fortuneCookieButton en tant qu'objet «sender». Ce n'est pas nécessaire pour notre application, mais c'est inclus ici car c'est une convention commune que vous verrez souvent.
Enfin, la ligne 15 indique qu'il s'agit de la fin de notre déclaration @interface.
Maintenant que nous avons déclaré les variables internes et les méthodes qui seront utilisées par notre application et les avons étiquetées avec IBOutlet et IBAction, nous devons terminer le cercle en connectant nos objets Interface Builder à la classe FortuneCrunchViewController..
Double-cliquez sur le fichier FortuneCrunchViewController.xib et relancez Interface Builder..
Cliquez avec le bouton droit de la souris ou cliquez avec le bouton droit de la souris sur l'objet Propriétaire du fichier dans le contrôleur XIB. Une boîte apparaîtra, listant les différents objets du propriétaire du fichier pouvant être connectés aux objets du XIB. Notez que la "vue" est déjà connectée pour nous.
Cliquez sur le cercle à droite de fortuneCookieButton et faites-le glisser de la zone Propriétaire du fichier vers le bouton UIB réel sur le canevas. La zone Propriétaire du fichier doit être graphiquement mise à jour pour afficher la connexion entre l'objet fortuneCookieButton et UIButton de la même manière qu'elle indique la connexion entre la sortie de vue et l'objet View..
Maintenant, faites la même chose pour la connexion fortuneLabel.
Nous devons maintenant établir une connexion entre UIButton et notre méthode crunchCookie. Interface Builder nous fournit de nombreuses façons différentes de procéder. Cliquez avec le bouton droit de la souris ou cliquez avec le bouton droit sur notre bouton cookie de fortune pour afficher une liste des événements disponibles.
Deux des options les plus couramment utilisées incluent:
La retouche à l'intérieur est généralement l'option choisie lorsque vous travaillez avec des boutons, mais dans notre cas, nous souhaitons que le cookie de la fortune casse dès que le doigt de l'utilisateur le touche. Nous allons donc associer l'événement Touch Down à notre méthode crunchCookie. Pour ce faire, faites glisser le cercle vers l’objet Propriétaire du fichier dans la fenêtre XIB, puis veillez à sélectionner la méthode crunchCookie dans la boîte de dialogue qui apparaît.
Enregistrez votre travail dans Interface Builder puis revenez à Xcode.
Avec le fichier XIB d’Interface Builder configuré et notre interface de classe écrite, il ne reste plus qu’à coder les méthodes de classe que l’application utilisera pour écraser notre cookie et afficher l’étiquette de fortune. Le fichier d’implémentation de la classe est FortuneCrunchViewController.m, ouvrez-le maintenant en le sélectionnant dans le répertoire Des classes dossier dans le Groupes et fichiers vitre.
Mettez à jour le code comme suit:
#import "FortuneCrunchViewController.h" @implementation FortuneCrunchViewController @synthesize fortuneCookieButton; @ synthétiser fortuneLabel; // Cette méthode modifie l'image du cookie lorsque le bouton est enfoncé: - (IBAction) crunchCookie: (id) sender NSLog (@ "In crunchCookie"); [fortuneCookieButton setImage: [UIImage imageNamed: @ "cookie-crunched.png"] pourState: UIControlStateNormal]; fortuneLabel.hidden = NO; // Ces méthodes sont liées à la gestion de la mémoire: - (void) viewDidUnload [releaseCookieButton release]; fortuneCookieButton = nil; - (vide) dealloc [publication de fortuneCookieButton]; [version de fortuneLabel]; [super dealloc]; @fin
La ligne 1 est la directive du préprocesseur pour inclure le fichier d’interface avant la compilation de la classe..
La ligne 3 commence notre implémentation en classe.
Les lignes 5 à 6 utilisent l'instruction @synthesize pour créer dynamiquement des méthodes permettant d'accéder aux objets pointeur fortuneCookieButton et fortuneLabel déclarés dans le fichier d'en-tête et de les sauvegarder. Cette étape supprime la nécessité de coder à la main les méthodes getVariable () et setVariable () pour tous les objets que nous déclarons..
La méthode crunchCookie se trouve aux lignes 8 à 12 et constitue le cœur de ce programme..
Sur les lignes 9 à 10, nous créons un nouvel objet UIImage à l’aide de l’image cookie-crunched.png. Nous passons ensuite cet objet dans la méthode setImage: forState: de l'objet fortuneCookieButton. Cette méthode modifiera l'attribut d'image que nous avons défini manuellement sur cookie-closed.png dans Interface Builder et remplacera le nouvel objet UIImage que nous avons transmis. Le passage de messages est un composant central du langage Objective-C et suit généralement ce modèle:
[myObject methodParam1: value1 methodParam2: value2];
La ligne 11 accède à l'attribut «masqué» de l'objet fortuneLabel et définit sa valeur sur NO. Cela révélera notre objet étiquette après la mise à jour de l'image sur le cookie croquant..
Toutes les lignes restantes traitent de problèmes de gestion de la mémoire qui seront abordés plus en détail dans les prochains tutoriels. En résumé, lors du déchargement de notre vue, vous devez vous assurer que vous avez bien publié les objets IBOutlet que vous avez créés. Quant à la méthode dealloc, il s’agit du destructeur d’objets et est appelé lorsque l’objet est sur le point d’être détruit. Ces deux méthodes existent déjà par défaut dans la classe, mais vous devrez leur ajouter les lignes affichées..
Avec le code ci-dessus en place, nous sommes prêts à enregistrer, compiler et exécuter notre application finie.!
Ce tutoriel vous a fourni une brève introduction au développement d'applications natives pour iPhone OS avec Xcode, Interface Builder et le SDK pour iPhone. Nous avons couvert quelques notions de base de la plate-forme et vous vous êtes familiarisé avec Interface Builder et Xcode..
Le matériel couvert dans ce didacticiel sera développé dans les prochains didacticiels, au fur et à mesure de l'exploration approfondie d'Objective-C, de Cocoa-Touch et du SDK pour iPhone.