How to use color detail more easily in Swift application development

preface

During the Spring Festival, I made a new product OneScreen, and summarized 1 skill since the development of Swift. Today, I bring you a skill for easy color selection, better use of color, and color modification at any time.

The main contents covered are:

1. Use base 106 color code to mark colors by extension

2. Build custom colors/styles for easy invocation in each page

3. In the subsequent UI adjustment, only one file needs to be adjusted to preview the global

In fact, the techniques for 2 and 3 are similar to the multi-topic solutions I've Shared before.

1. Use base 106 color code

In developing OneScreen, we first created the ExtensionFile.swift file. The following code allows us to make subsequent calls to base 106 color codes.

import Foundation
extension UIColor {
  class func colorWithHexString(hex:String) ->UIColor {
    var cString = hex.trimmingCharacters(in:CharacterSet.whitespacesAndNewlines).uppercased()

    if (cString.hasPrefix("#")) {
      let index = cString.index(cString.startIndex, offsetBy:1)
      cString = cString.substring(from: index)
    }
    if (cString.characters.count != 6) {
      return UIColor.red
    }
    let rIndex = cString.index(cString.startIndex, offsetBy: 2)
    let rString = cString.substring(to: rIndex)
    let otherString = cString.substring(from: rIndex)
    let gIndex = otherString.index(otherString.startIndex, offsetBy: 2)
    let gString = otherString.substring(to: gIndex)
    let bIndex = cString.index(cString.endIndex, offsetBy: -2)
    let bString = cString.substring(from: bIndex)
    var r:CUnsignedInt = 0, g:CUnsignedInt = 0, b:CUnsignedInt = 0;
    Scanner(string: rString).scanHexInt32(&r)
    Scanner(string: gString).scanHexInt32(&g)
    Scanner(string: bString).scanHexInt32(&b)
    return UIColor(red: CGFloat(r) / 255.0, green: CGFloat(g) / 255.0, blue: CGFloat(b) / 255.0, alpha: CGFloat(1))
  }
}

So every time we pass it UIColor.colorWithHexString(hex: "#______") You can call the color and get the color faster.

2. Create your own color

Next, I created the color library Theme.swift for all pages, directly creating all the colors to be used in the file, and naming each color appropriately for easy memory and use.

import Foundation
import UIKit
struct Theme{
  static var ThemeBlue:UIColor = UIColor.colorWithHexString(hex: "#46b8ee")
  static var ThemeDarkBlue:UIColor = UIColor.colorWithHexString(hex: "#3eb5ed")
  static var ThemeDeepBlue:UIColor = UIColor.colorWithHexString(hex: "#2396cd")
  static var ThemePurple:UIColor = UIColor.colorWithHexString(hex: "#8267c6")
  static var ThemeDarkPurple:UIColor = UIColor.colorWithHexString(hex: "#7963c5")
  static var ThemeDeepPurple:UIColor = UIColor.colorWithHexString(hex: "#7059c5")
  //...
}

3. Call in each page

The process of invoking is simple, as long as Theme is followed by the name of the color where we need UIColor, for example:

cell.backgroundColor = Theme.ThemeDeepPurple
cell.backgroundColor = Theme.ThemeDeepBlue

With two simple files, you can more quickly get color, custom color. When the subsequent UI adjustment requires adding or changing colors, we only need to change the code in ES57en.swift. In particular, existing colors can all be updated to the latest color without making any changes in other page files.
Hopefully, this solution will improve your development efficiency.

conclusion