Comment créer des UIView réutilisables avec le fichier .XIB pour faciliter la conception

Des sous-classes personnalisées UIView sont un énorme gain de productivité. Vous pouvez les programmer une fois et ensuite utiliser le résultat à travers votre ou vos projets. Cependant, par défaut, Xcode ne permet pas de créer également un fichier .XIB pour la conception en utilisant l’éditeur Storyboard comme il le fait pour les UITableViewCell personnalisées par exemple.

Dans ce court post, je vais vous montrer comment concevoir des UIView personnalisées avec un fichier .XIB.

Créer une classe Swift

La première étape consiste à créer un fichier .swift pour votre UIView. Quelque chose comme ceci:

import UIKitclass CustomView: UIView {}
Entrer dans le mode plein écran Sortir du mode plein écran

Créer un fichier .XIB

Puis ajoutez le nouveau fichier à votre projet a sous « User Interface » sélectionnez l’option « View »:

Utilisez le même nom que pour votre sous-classe, dans ce cas CustomView.

Par défaut, l’aperçu est montré comme un dispositif entier. Mais vous pouvez changer cela dans l’inspecteur de taille. Sous « Métriques simulées », choisissez la « Taille » pour qu’elle soit « Freeform » et aussi en bas sélectionnez par exemple iPhone 8 pour vous débarrasser des zones sûres des iPhones avec une encoche.

Maintenant vous pouvez redimensionner la vue librement et approximer comment elle va ressembler en utilisation.

Pour connecter le CustomView.xib avec notre classe, sélectionnez la « vue » dans le plan du document, passez à l’inspecteur d’identité et comme « classe » entrez la « vue personnalisée ».

C’est tout ! Vous pouvez maintenant concevoir votre vue et connecter des @IBOutlets à la classe.

Utilisation de CustomView

Pour créer une instance de la CustomView en utilisant le fichier .xib, ajoutez cette méthode:

Vous avez besoin d’un code d’initialisation personnalisé, vous pouvez créer la méthode setupView et l’appeler avant de retourner la view:

Merci pour votre lecture !

Avez-vous vos propres méthodes pour créer des vues réutilisables ? Faites-moi signe 🙂


Vous avez besoin de vous concentrer sur votre iPhone ? Obtenez gratuitement l’application WebBlock pour le blocage programmé de sites Web sur l’App Store !

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée.