Fashion is your helper to share and reuse UI styles in a Swifty way. The
main goal is not to style your native apps in CSS, but use a set of convenience
helper functions to decouple your styles from a layout code, improving
customization and reusability. Also here we try to go beyond the UIAppearance
possibilities to customize appearance for all instance objects of the specified
type.
Define styles in a stylesheet
enum Style: String, StringConvertible {
case CustomButton
var string: String {
return rawValue
}
}
struct MainStylesheet: Stylesheet {
func define() {
share { (label: UILabel) in
label.textColor = UIColor.blueColor()
label.numberOfLines = 2
label.adjustsFontSizeToFitWidth = true
}
// register("custom-button") { (button: UIButton) in
register(Style.CustomButton) { (button: UIButton) in
button.backgroundColor = UIColor.redColor()
button.setTitleColor(UIColor.whiteColor(), forState: .Normal)
}
}
}
Register a stylesheet
Fashion.register([MainStylesheet()])
Apply a style
let button = UIButton() // let button = UIButton(styles: "custom-button")
button.stylize(Style.CustomButton) // backgroundColor => UIColor.redColor()
let label = UILabel()
addSubview(label) // textColor => UIColor.blueColor()
Stylesheet
is a protocol that helps you to organize your styles by registering
them in define
method:
Register a style
// Registers stylization closure with the specified name.
register("card-view") { (view: UIView) in
view.backgroundColor = UIColor.whiteColor()
view.layer.masksToBounds = false
view.layer.shadowColor = UIColor.blackColor().CGColor
view.layer.shadowOffset = CGSize(width: 0, height: 0.5)
view.layer.shadowOpacity = 0.2
view.layer.cornerRadius = 8
}
Unregister a style
// Unregisters stylization closure with the specified name.
unregister("card-view")
Share a style
The style will be shared across all objects of this type, considering inheritance.
// All views will have red background color.
share { (view: UIView) in
view.backgroundColor = UIColor.redColor()
}
// All table views will have white background color, it overrides the red
// background registered above.
share { (tableView: UITableView) in
tableView.backgroundColor = UIColor.whiteColor()
tableView.tableFooterView = UIView(frame: CGRect.zero)
tableView.separatorStyle = .None
tableView.separatorInset = UIEdgeInsetsZero
}
Unshare a style
// Unregisters shared stylization closure for the specified type.
unshare(UITableView.self)
UIAppearance
share
is the recommended method to customize the appearance of class's
instances, but sometimes we still have to use UIAppearance
because of
default styles set on the class’s appearance proxy when a view enters a window.
shareAppearance { (barButtonItem: UIBarButtonItem) in
barButtonItem.setTitleTextAttributes([
NSFontAttributeName : UIFont(name: "HelveticaNeue-Light", size: 12)!,
NSForegroundColorAttributeName : UIColor.redColor()],
forState: .Normal)
}
When you register/share your styles in the Stylesheet
all the actual work is
done by Stylist
under the hood, so if you want more freedom it's possible
to use Stylist
class directly. You can create a new instance Stylist()
or
use the global variable Stylist.master
which is used in stylesheets.
let stylist = Stylist()
stylist.register("card-view") { (view: UIView) in
view.backgroundColor = UIColor.whiteColor()
view.layer.cornerRadius = 8
}
stylist.unregister("card-view")
stylist.share { (tableView: UITableView) in
tableView.backgroundColor = UIColor.whiteColor()
tableView.tableFooterView = UIView(frame: CGRect.zero)
}
stylist.unshare(UITableView.self)
It's super easy to apply previously registered styles with UIView
extensions.
With convenience initializer
// A single style
let button = UIButton(styles: "custom-button")
// Multiple styles should be separated by a space
let label = UILabel(styles: "content-view cool-label")
// The initialized also accepts StringConvertible, so something other
// than magic String could also be used
enum Style: String, StringConvertible {
case CustomButton
case ContentView
case CoolLabel
var string: String {
return rawValue
}
}
// A single style
let button = UIButton(styles: Style.CustomButton)
// Multiple styles
let label = UILabel(styles: [Style.ContentView, Style.CoolLabel])
With stylize
function
let label = UILabel()
// StringConvertible
label.stylize(Style.ContentView, Style.CoolLabel)
// String
label.stylize("content-view", "cool-label")
With @IBInspectable
property styles
let button = UIButton()
// A single style
button.styles = "custom-button"
// Multiple styles
button.styles = "content-view custom-button"
Vadym Markov, [email protected]
Fashion is available through CocoaPods. To install it, simply add the following line to your Podfile:
pod 'Fashion'
Fashion is also available through Carthage. To install just write into your Cartfile:
github "vadymmarkov/Fashion"
Vadym Markov, [email protected]
We would love you to contribute to Fashion, check the CONTRIBUTING file for more info.
Fashion is available under the MIT license. See the LICENSE file for more info.