• 15 heures
  • Facile

Ce cours est visible gratuitement en ligne.

Ce cours est en vidéo.

Vous pouvez obtenir un certificat de réussite à l'issue de ce cours.

J'ai tout compris !

Affichez Hello World dans le simulateur

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Dans ce chapitre, nous allons lancer une application et la voir fonctionner sur votre Mac !

Merci pour votre enthousiasme !
Merci pour votre enthousiasme !

Aperçu des fichiers

Dans le navigateur, vous pouvez voir que Xcode a déjà généré pour vous un certain nombre de fichiers. Nous n'allons pas avoir besoin de tous les utiliser. Les seuls qui vont nous intéresser sont :

  1. ViewController.swift  => C'est ici que nous allons écrire du code

  2. Main.storyboard  => C'est ici que nous allons créer l'interface

 

Vous pouvez ignorer tous les autres fichiers, nous n'en avons pas besoin pour le moment.

Présentation d'Interface Builder

Commençons par le second ! Cliquez sur le fichier Main.storyboard. Vous devriez voir ceci :

 

Vous arrivez sur Interface Builder qui a pour rôle notamment de gérer les fichiers de type storyboard. C'est ici que l'on va pouvoir créer l'interface de notre application, ce que l'on peut voir et toucher à l'écran.

Au milieu de l'écran, vous pouvez voir une vue blanche de la taille d'un iPhone. C'est l'interface actuelle de notre application. Et évidemment pour le moment, il n'y a rien :waw: ! Nous allons vite y remédier.

Dans le panneau de droite - les utilitaires, il y a en bas une section qui semble contenir plein de choses intéressantes. Elle va nous permettre de remplir un peu notre interface. C'est la bibliothèque des objets.

La bibliothèques des objets
La bibliothèque des objets (Object Library)

Hello World !

Pour commencer, nous allons choisir dans la bibliothèque des objets l'objet "Label". Il permet d'afficher du texte à l'écran. Pour le rajouter sur notre vue, il suffit de le glisser-déposer dans la vue à l'endroit que vous voulez.

On glisse le label dans la vue !
On glisse le label dans l'interface !

Maintenant, comme sur un PowerPoint, il suffit de double-cliquer sur le label que vous venez de déposer et ensuite de taper le texte que vous voulez. Je vous propose le fameux "Hello World !" pour démarrer.

Le simulateur

Et maintenant le moment que vous attendiez tous : nous allons lancer l'application sur un iPhone !

Mais je n'ai pas d'iPhone...

Pas de souci ! Nous allons utiliser le simulateur. Xcode est capable de simuler un iPhone sur votre Mac :waw: ! Comment faire ? Rien de plus simple, ça se passe en haut à gauche :

 

Dans l'ordre, vous avez 4 boutons :

  1. Run : Ce bouton nous permet de lancer l'application sur le simulateur. Nous allons cliquer dessus dans un instant !

  2. Stop : Ce bouton nous permet d'interrompre le lancement de l'application ou de fermer l'application. Il faut avoir appuyé sur run avant bien sûr !

  3. Teki : Ceci nous permet d'accéder aux schémas de notre application. Sachez seulement qu'on verra cela bien plus tard dans d'autres cours.

  4. iPhone 8 Plus : En cliquant dessus, on ouvre une liste avec tous les simulateurs disponibles. Vous retrouvez ici les modèles d'iPhone et d'iPad que vous connaissez.

Appuyons sur ce 4e bouton :

Dans la liste déroulante, choisissez l'iPhone 8.

Et cliquons sur Run !

Xcode mouline un peu. Un nouveau logiciel se lance, il s'appelle Simulator. Un iPhone débarque sur votre écran. Il s'initialise. Notre application se lance et après ces quelques instants de suspens insoutenable...

TADAAA !
TADAAA !

Félicitations ! Vous venez officiellement de faire votre toute première application ! C'est cadeau.

Je vous propose maintenant de jouer un peu avec notre simulateur pour que vous compreniez que c'est quasiment un vrai iPhone. La première différence qui saute aux yeux, c'est que nous n'avons pas les boutons physiques du téléphone.

Vous les retrouvez tous, notamment le bouton home en haut dans le menu Hardware.

Vous retrouverez alors une interface qui ressemble à ceci :

Vous pouvez faire la plupart des choses que vous avez l'habitude de faire avec un iPhone : aller sur Internet avec Safari, regarder des photos, consulter le calendrier, vos réglages. Vous pouvez même revenir sur notre application Teki. N'hésitez pas à prendre quelques minutes pour vous familiariser avec ce logiciel.

Voici quelques exercices que je vous propose de faire :

  • Verrouillez l'iPhone

  • Ouvrez-le

  • Changez son orientation

  • Zoomez sur une photo (indice : la touche alt enfoncée permet de simuler 2 doigts sur le simulateur)

  • Recherchez votre adresse dans le plan

C'est tout bon ? Super ! Alors, résumons-nous !

En résumé

  • Nous allons travailler avec 2 fichiers : main.storyboard et viewcontroller.swift.

  • Le storyboard permet de créer les interfaces en glissant-déposant des éléments depuis la bibliothèque des objets dans la vue.

  • En cliquant sur le bouton run, on lance le simulateur : un véritable iPhone dans votre Mac ! C'est avec cet outil que l'on va pouvoir tester notre application.

Dans le prochain chapitre, nous allons créer l'interface de Teki !

Exemple de certificat de réussite
Exemple de certificat de réussite