Danny CopelandWhat?
Simple extension of UIColor using Swift.
This code snippet demonstrates a simple solution for creating a color once and using it throughout a project with the use of an extension.
An extension can add functionality to an existing class.
Why?
Often you will need to use the same color(s) throughout a project. Creating the colors each time you need them can quickly become inefficient.
This snippet will make the color(s) easy to maintain and find as your project grows.
How?
First create a new single view app in XCode.
Ensure the language is set to Swift.
Add a new Swift file to the project. (‘Command + N’ is the default shortcut to create a new file)
Typical naming convention when extending a class is to use the name of the class you are extending+your file name, in this example, UIColor+MyAppTheme (Yes use the + sign).
Since UIColor belongs to UIKit, replace import Foundation with import UIKit.
Add the extension by typing the keyword extension followed by the name of the class you are extending (UIColor) followed by opening and closing brackets.
Now create the property for the new color. Make the property static so it can be used without creating an instance of the class itself.
Use let since the property will be constant.
There are many ways to initialize a color, in this example we will use the constructor that takes red, green, blue, alpha values.
We will create a darker blue color using red: 9/255, green: 45/255, blue: 64/255 and 1 for alpha. (The alpha is the opacity value from 0.0 to 1.0) Name the property myColor_DarkBlue.
Here is what the UIColor+MyAppTheme.swift file should contain:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import UIKit | |
| extension UIColor { | |
| //create the property (make it static so you do not need to create an instance of this class to use it) | |
| static let myColor_DarkBlue = UIColor(red: 9/255, green: 45/255, blue: 64/255, alpha: 1) | |
| } |
Now we can use the property. Open the ViewController.swift file and set the view background color to the new color by typing UIColor.’theNameOfYourColor’.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import UIKit | |
| class ViewController: UIViewController { | |
| override func viewDidLoad() { | |
| super.viewDidLoad() | |
| //Calling the extension, since the property is static use UIColor.theNameOfYourColor | |
| view.backgroundColor = UIColor.myColor_DarkBlue | |
| } | |
| } |
Run the project and notice the default white background is now the color specified.
You can add more colors as needed to the UIColor+MyAppTheme.swift file.
Conclusion
Extensions in Swift provide a great way for you add functionality to an existing class. In this small snippet we utilized this and in result provided a way to create a custom color that can be used throughout our app, a common practice when creating a theme for an app.
Any time you write the same code twice you should explore options for only creating it once for reuse.
Sources:
More information on UIColor can be found in Apple’s UIColor documentation.
Cover photo for this post provided by Christopher Gower on Unsplash
