Xcode
Création de contrôles personnalisés dans Interface Builder avec @IBDesignable
Recherche…
Remarques
Il est devenu beaucoup plus facile de créer des contrôles personnalisés dans Interface Builder avec l'introduction des directives @IBDesignable et @IBInspectable dans Swift. Les développeurs peuvent désormais créer des contrôles riches, complexes et entièrement animés en utilisant seulement quelques lignes de code supplémentaires. Je suis surpris par le nombre de développeurs qui n’ont pas encore adopté cette fonctionnalité, et je trouve fréquemment que l’ajout de quelques lignes de code aux classes existantes peut les rendre beaucoup plus faciles à utiliser.
Notez que ces fonctionnalités sont également disponibles dans Objective-C et constituent un excellent moyen de donner vie aux anciennes classes. Les équivalents syntaxiques d'Objective-C sont IB_DESIGNABLE et IBInspectable, mais pour l'instant je vais me concentrer sur des exemples de Swift.
Une vue arrondie à rendu direct
C'est une exigence si commune dans le développement iOS, et c'était toujours quelque chose qui devait être fait purement en code (ou en utilisant des images - beurk!). Maintenant, il est incroyablement facile de prévisualiser ce genre de chose dans Interface Builder, il n'y a absolument aucune excuse pour ne pas l'utiliser.
Voici le code: -
import UIKit
@IBDesignable
class MyRoundedView: UIView {
@IBInspectable var radius: CGFloat = 8 {
didSet {
self.layer.cornerRadius = radius
}
}
override func awakeFromNib() {
self.layer.cornerRadius = self.radius
self.layer.masksToBounds = true
}
}
Pour utiliser cette classe, ajoutez-la à votre projet, puis ouvrez le storyboard dans IB et créez un UIView normal d'une taille décente. Donnez-lui une couleur d'arrière-plan pour que vous puissiez le voir, puis accédez à Identity Inspector dans le panneau Utilitaires de droite et modifiez le type de classe dans la liste déroulante à MyRoundedView .
Lorsque vous faites cela, vous devriez voir une troisième étiquette apparaissant sous "Class" et "Module" qui indique "Designables", et devrait indiquer "Mise à jour" pendant un moment avant de passer à "Mise à jour". Cela signifie que Xcode a MyRoundedView recompilé votre code pour MyRoundedView .
Vous pouvez maintenant ouvrir l'inspecteur d'attributs et vous devriez voir (peut-être après une courte pause) une nouvelle section en haut du volet avec l'en-tête "Ma vue arrondie" et un nouvel attribut intitulé "Rayon" avec la valeur 8 (parce que est la valeur initiale que nous définissons dans le code). Cela est apparu dans l'inspecteur d'attributs car nous l'avons marqué comme @IBInspectable .
Vous pouvez maintenant changer cela pour un autre numéro et vous devriez voir la mise à jour du rayon de coin de la vue arrondie en temps réel!
