Part 2: Color

Color is a curial part of the Material Design framework. You can find the docs on color here. The designers at Google have taken what I assume is a great amount of time to publish and refine those docs. I think they are a MUST read for anyone who is attempting to build things with Material Design. Since the docs all use hex codes instead of RGB values lets extend UIColor and create a convenience initializer to accept those.

extension UIColor {
   convenience public init(hex: Int) {
      let red = CGFloat((hex & 0xFF0000) >> 16) / 255.0
      let green = CGFloat((hex & 0xFF00) >> 8) / 255.0
      let blue = CGFloat((hex & 0xFF)) / 255.0
      self.init(red:red, green:green, blue:blue, alpha: 1.0)
   }
}

Now we can create colors simply by using.

let red: UIColor = UIColor(hex: 0xF44336)

That creates red just like in the docs. Now there are two approaches to creating all the other colors.

1. Struct

The approach I choose to use is a Struct that has all the values in accordance to the docs.

struct Color {
   let red = UIColor(hex: 0xF44336)
}

With this approach using a color is as simple as.

self.backgroundColor = Color().red

You can find code for all the colors here.

2. Extend UIColor

Another approach would be to add function to UIColor that return an instance of UIColor. To do this approach the code is simply.

extension UIColor {
   class func red() -> UIColor {
      return UIColor(hex: 0xF44336)
   }
}

This approach requires much more code up front but then in use its easier to use. When writing code with this approach allows you to simply use.

self.backgroundColor = .red()

I choose to use the Struct approach in my code. Thanks for tuning in.

Next up: Fonts