Revenir

Entre ton email pour recevoir le guide complet pour apprendre Swift peu importe ton niveau

Comment créer des interfaces en code avec Swift sous iOS 13

Beaucoup de développeurs iOS n’utilisent pas ou peu le storyboard.

Beaucoup sont totalement contre.

Moi je pense qu’il est important de connaître les deux et que chaque méthode a ses avantages.

Dans cet article je vais vous partager ce qu’il faut savoir pour créer des apps uniquement en code et sans storyboard.

Supprimer le storyboard

La première étape c’est de supprimer le storyboard et de supprimer les appels à ce storyboard pour ne pas générer d’erreur.

Ensuite il faut définir le nouveau point d’entrée de l’application.

Commence par supprimer le fichier Main.storyboard et rends-toi dans les paramètres de ton projet en cliquant sur le nom de ton projet dans le navigateur de fichiers à gauche dans Xcode.

Il y a une section où il y a écrit “Main Interface” et la valeur qui est inscrite dans le champ de texte est “Main”.

Efface le contenu de ce champ de texte et laisse le vide.

Tu dois également faire la même chose dans Info.plist dans le champ Main storyboard file base name.

Maintenant il faut définir le nouveau point d’entrée de ton application puisque ce n’est plus le Main.storyboard.

C’est dans AppDelegate, dans la fonction didFinishLaunchingWithOptions que tu dois définir ce point d’entrée grâce à ce code avant le return de cette fonction :

window = UIWindow(frame: UIScreen.main.bounds)
window!.rootViewController = ViewController()
window!.makeKeyAndVisible()

Bien sûr tu remplaces ViewController() par le nom de ton UIViewController.

Si ton controller est dans un NavigationController alors tu remplaces ViewController() par une instance de NavigationController et non ton controller directement :

window = UIWindow(frame: UIScreen.main.bounds)
window!.rootViewController = UINavigationController(rootViewController: ViewController())
window!.makeKeyAndVisible()

Avantages de la méthode

Le plus gros avantage de cette méthode c’est que tu peux créer des vues une fois et les réutiliser quand tu veux et où tu veux sans réécrire de code.

Tu codes une fois et tu utilises à l’infini donc tu gagnes du temps.

L’autre avantage c’est que tu as accès à toutes les propriétés des vues donc tu peux faire plus de choses.

Par exemple, tu ne peux pas arrondir les bords d’une vue dans le storyboard.

Autre exemple, tu ne peux pas changer mettre de fond de couleur dégradé à ta vue dans le storyboard.

Créer une interface en code

Le système d’affichage des vues est basé sur des coordonnées et des rectangles.

Le point de coordonnée (0; 0) sur l’écran est le point tout en haut à gauche.

Quand on augmente la position X, la vue va vers la droite.

Quand on augmente la position Y, la vue descend.

Le point qui positionne la vue est son point en haut à gauche.

Donc si on dit qu’une vue a pour X et Y la valeur 0 alors le coins en haut à gauche de ma vue sera sur le point (0; 0) de l’écran donc en haut à gauche.

Les vues sont également définies par un rectangle qui permet de leur donner une largeur et une hauteur.

Chaque vue a une propriété frame qui contient les coordonnées, la largeur et la hauteur.

On peut créer des vues avec cette propriété uniquement :

let view = UIView(frame: CGRect(x: 20, y: 20, width: 200, height: 100))

On peut utiliser ça pour toutes les vues comme les boutons ou les labels.

Et ça, ça peut suffir a créer une vue.

Mais si vous placez des vues par rapport à d’autres, votre propriété frame deviendra très vite longue et incompréhensible.

Par exemple, pour centrer une vue dans son parent tu devrais dire que X est égal à la moitié de la largeur du parent moins la moitié de la largeur de la vue.

C’est pourquoi il y a les contraintes qui sont là pour t’apporter des raccourcis pour ce genre de choses.

Si tu ne les utilises pas, il te suffit de mettre la propriété translatesAutoResizingMaskIntoConstraints, abrégée par tamic, à true.

Ça va faire en sorte que Xcode convertisse le frame en contraintes.

Sinon, tu dois mettre le tamic à false et définir les contraintes toi-même.

Pour en apprendre plus là-dessus, Apple un créé un tutoriel pour ça :

Créer des contraintes en code

Avant de définir les contraintes, il ne faut pas oublier d’ajouter ta vue à une vue parente sinon ça va planter.

Tu peux le faire avec la méthode addSubview de n’importe quel vue.

Pour ce qui est du contenu de la vue (comme le texte des boutons ou des labels ou la couleur de fond), les propriétés sont assez explicites.

Il te suffit d’écrire le nom de la variable de ta vue, de mettre un point et de lire la liste que va te proposer Xcode avec l’explication de chaque propriété pour trouver ce que tu cherches.

Sinon, tu as la documentation officielle pour t’aider.

Il te suffit d’aller sur Google et de taper le nom de ta vue suivi de Swift et d’aller sur la documentation officielle.

Ou alors de taper sur Google exactement ce que tu cherches à faire.

Conclusion

Je ne pense pas que les storyboards soint inutiles.

Le principal avantage c’est que tu peux créer des interfaces sans avoir à écrire de code ce qui est très pratique pour des écrans simples ou même des écrans qui ne changeront jamais.

Il faut apprendre à utiliser les deux méthodes pour profiter des bénéfices de chacune et utiliser la meilleure en fonction de la situation.