Xcode
Benutzerdefinierte Steuerelemente im Interface Builder mit @IBDesignable erstellen
Suche…
Bemerkungen
Mit der Einführung der Direktiven @IBDesignable
und @IBInspectable
in Swift wurde die Erstellung benutzerdefinierter Steuerelemente in Interface Builder wesentlich einfacher. Entwickler können jetzt umfassende, komplexe und vollständig animierte Steuerelemente mit nur wenigen zusätzlichen Codezeilen erstellen. Ich bin überrascht, wie viele Entwickler diese Funktion noch nicht voll und ganz angenommen haben, und ich finde häufig, dass das Hinzufügen einiger weniger Codezeilen zu vorhandenen Klassen die Arbeit mit ihnen sehr viel einfacher macht.
Beachten Sie, dass diese Funktionen auch in Objective-C verfügbar sind und eine gute Möglichkeit sind, alten Klassen Leben einzuhauchen. Die syntaktischen Äquivalente in Objective-C sind IB_DESIGNABLE und IBInspectable, aber jetzt werde ich mich auf Beispiele in Swift konzentrieren.
Eine gerundete Live-Ansicht
Dies ist eine sehr häufige Anforderung in der iOS-Entwicklung, und es war immer etwas, was rein im Code (oder mit Bildern - ja!) Getan werden musste. Es ist jetzt unglaublich einfach, eine Vorschau seiner Art in Interface Builder zu sehen. Es gibt absolut keine Entschuldigung, es nicht zu verwenden.
Hier ist der 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
}
}
Um diese Klasse zu verwenden, fügen Sie sie Ihrem Projekt hinzu, öffnen Sie das Storyboard in IB und erstellen Sie eine normale UIView mit anständiger Größe. Vergeben Sie eine Hintergrundfarbe, damit Sie sie sehen können, navigieren Sie dann zum Identitätsinspektor im rechten Bedienfeld Dienstprogramme und ändern Sie den Klassentyp in der Dropdown- MyRoundedView
in MyRoundedView
.
Wenn Sie dies tun, sollten Sie unter "Klasse" und "Modul" ein drittes Etikett mit der Aufschrift "Designables" sehen. Es sollte kurz "Update" angezeigt werden, bevor Sie zu "Up to Date" wechseln. Dies bedeutet, dass Xcode Ihren Code für MyRoundedView
erfolgreich neu kompiliert hat.
Jetzt können Sie den Inspector für Attribute öffnen und (möglicherweise nach einer kurzen Pause) oben im Bereich einen neuen Abschnitt mit der Überschrift "Meine abgerundete Ansicht" und ein neues Attribut mit dem Namen "Radius" mit dem Wert "8" sehen ist der Anfangswert, den wir im Code eingestellt haben). Dies wurde im Attribut-Inspektor @IBInspectable
da wir es als @IBInspectable
markiert @IBInspectable
.
Sie können dies jetzt in eine andere Zahl ändern und der Eckenradius der abgerundeten Ansicht sollte in Echtzeit aktualisiert werden!