• 8 heures
  • Facile

Ce cours est visible gratuitement en ligne.

course.header.alt.is_video

course.header.alt.is_certifying

J'ai tout compris !

Mis à jour le 24/05/2022

Découvrez le code

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

Ça y est ! Nous allons parler de code. Fini la souris, faites place au clavier !

À l'assaut !

MVC

Tout d'abord, il faut que je vous explique un peu la structure d'une application iOS. Celles-ci sont organisées autour d'un patron de conception (on parle aussi de pattern) très célèbre : le MVC.

En théorie

Voici à quoi ça ressemble :

Au centre, le Contrôleur reçoit une notification du Modèle et renvoie une mise à jour au Modèle et à la Vue. La Vue envoie l'Action de l'utilisateur au Contrôleur
Ce bon vieux MVC

Le MVC, c'est donc trois éléments :

  1. Le Modèle : c'est la logique de l'application, ce que l'application fait.

  2. Le Contrôleur : c'est lui qui fait le lien entre le modèle et la vue.

  3. La Vue: c'est ce que l'on voit. La vue est gérée par le contrôleur qui va lui dire quoi afficher, comment réagir à l'appui sur un bouton, comment s'animer, etc.

Le contrôleur est donc au centre de ce système, car c'est lui qui reçoit les informations du modèle (la logique de l'app) et qui les affiche dans la vue. Et comme le suggère le schéma ci-dessus, il y a une règle d'or qu'il vous faut absolument respecter :

Le modèle et la vue ne peuvent jamais communiquer !

Cela signifie que la vue ne connait même pas l'existence du modèle et inversement.

En pratique

Alors, qu'est-ce que ça donne concrètement dans notre projet ? Regardons un peu nos fichiers :

ViewController et Main dans le menu Teki
ViewController et Main dans le menu Teki
  • Main – Nous avons déjà eu l'occasion de travailler avec ce fichier. On y a créé l'interface, ce que l'utilisateur voit. C'est donc la Vue dans notre MVC.  

  • ViewController – En anglais dans le texte : le contrôleur de la vue. C'est donc le Contrôleur dans notre MVC. 

Et le modèle ?

Excellente question ! Le modèle n'est pas créé par Xcode automatiquement. Il faudrait créer un nouveau fichier de type Swift que nous appellerions Model. Mais notre application, aussi fun soit-elle, est relativement simple et nous sommes encore débutants. Donc, pour ne pas compliquer les choses, nous allons nous contenter de tout faire dans le contrôleur qui nous est proposé. Profitez-en, c'est la première et dernière entorse au schéma MVC !

Qu'avons-nous dans le contrôleur ?

Inspectons un peu plus en détail ce contrôleur.

//
// ViewController.swift
// Teki
//
// Created by Esso Awesso on 01/04/2022.
//
import UIKit
class ViewController: UIViewController {
overridefunc viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
}
}

Détaillons un peu les éléments :

  • Jusqu'à la ligne 6 : Ici, vous trouvez le nom du fichier, puis le nom de l'application et ensuite les fameuses informations de copyright dont on a parlé à la création du projet. Tous vos fichiers de code les contiendront. Vous apprendrez vite à les ignorer.

  •  import UIKit  : On a parlé du framework UIKit dans le 2e chapitre. Il est central dans iOS. Pour pouvoir utiliser notre contrôleur et gérer nos interfaces, nous en avons besoin, alors on l'importe !

  •  class ViewController : UIViewController  { ligne 19 :Cette ligne permet de définir notre contrôleur, nous n’allons pas rentrer dans le détail de cette déclaration dans ce cours. Sachez simplement que tout ce que gère notre contrôleur doit être écrit après cette ligne et avant l'accolade fermante }

À la suite, vous avez du code que Xcode génère par défaut.

La fonction viewDidLoad, qui permet de savoir quand notre vue est chargée afin de réaliser les opérations dont nous avons besoin.

En résumé

  • Toute application iOS est organisée selon le pattern MVC : Modèle Vue Contrôleur. Le contrôleur reçoit les informations du modèle, responsable de la logique, et les affiche dans la vue.

  •  class ViewController : UIViewController  { Ici vient le code du contrôleur  } 

Dans le prochain chapitre, nous allons connecter le code et l'interface !

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