Xcode
Skapa anpassade kontroller i Interface Builder med @IBDesignable
Sök…
Anmärkningar
Det blev mycket lättare att skapa anpassade kontroller i Interface Builder med introduktionen av @IBDesignable och @IBInspectable direktiven i Swift. Utvecklare kan nu bygga rika, komplexa, helt animerade kontroller med bara några extra kodrader. Jag är förvånad över hur många utvecklare som ännu inte helt har omfamnat den här funktionen, och jag tycker ofta att att bara några få kodrader till befintliga klasser kan göra dem så mycket lättare att arbeta med.
Observera att dessa funktioner också finns i Objekt-C och är ett bra sätt att andas liv i gamla klasser. De syntaktiska ekvivalenterna i Objekt-C är IB_DESIGNABLE och IBInspectable, men för tillfället kommer jag att koncentrera mig på exempel i Swift.
En live-renderad rundad vy
Detta är ett så vanligt krav i iOS-utvecklingen, och det var alltid något som måste göras rent med kod (eller med bilder - yuck!). Nu är det otroligt enkelt att förhandsgranska hans typ av saker i Interface Builder, det finns absolut ingen ursäkt för att inte använda den.
Här är koden: -
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
}
}
Om du vill använda den här klassen lägger du till det i ditt projekt och öppnar sedan storyboardet i IB och skapar en normal UIV-bild av en anständig storlek. Ge den en bakgrundsfärg så att du kan se den och navigera sedan till Identity Inspector i den högra verktygspanelen och ändra MyRoundedView i rullgardinsmenyn till MyRoundedView .
När du gör detta ska du se en tredje etikett visas under "Klass" och "Modul" som säger "Designables", och den ska säga "Uppdatera" ett ögonblick innan du ändrar till "Uppdaterad". Detta innebär att Xcode har kompilerat din kod för MyRoundedView framgångsrikt.
Nu kan du öppna attributinspektören och du borde se (kanske efter en kort paus) ett nytt avsnitt högst upp på rutan med rubriken "Min rundad vy" och ett nytt attribut märkt "Radius" med värdet 8 (eftersom det är det initiala värdet som vi anger i koden). Detta har dykt upp i attributinspektören eftersom vi markerade det som @IBInspectable .
Du kan nu ändra detta till ett annat nummer och du bör se den rundade vyens hörnradiusuppdatering i realtid!
