顏色作為UI最基本的要素之一,是構建界面必不可少的部分。iOS上有三個framework都提供了顏色類型,分別是“Core Image”的 "CIColor"、“ Quartz Core”中的“CoreGraphic”提供的"CGColor"以及這里要介紹的"UIColor"。
所以UIKit提供的元素,比如各種View,各種字體等的顏色設置,我們都可以通過UIColor來進行。 UIColor主要分成兩類色系:
- 灰度色,也就是通常說的黑白色
- RGB彩色,用RGB或者HSB加上特別度a組成的彩色
所以UIColor的使用和在CSS或者其他界面組件一樣,既有常見顏色的定義,也可以自己根據(jù)aRGB也可以根據(jù)aHSB調(diào)制特定的顏色。
0. 使用既定的常用色
UIColor定義了一些最常見的顏色,使用時非常簡單,比如設置一個UILabel的背景色為藍色:
let lbl = UILabel(frame: CGRect(x: 10, y: 48, width: 100, height: 100))
lbl.backgroundColor = UIColor.blue
這里UIColor.blue就表色藍色。
| 類變量 | 顏色 |
|---|---|
| black | 黑色 |
| blue | 藍色 |
| brown | 棕色 |
| clear | 無色 |
| cyan | 藍綠色 |
| darkGray | 深灰 |
| gray | 灰色 |
| green | 綠色 |
| lightGray | 淺灰 |
| magenta | 品紅 |
| orange | 橘色 |
| purple | 紫色 |
| red | 紅色 |
| white | 白色 |
| yellow | 黃色 |
1. 創(chuàng)建自定義顏色
如果上面的常用色滿足不了需求,還可以使用灰度或者RGB/HSB給數(shù)值進行調(diào)色。
先來看黑白色:
init(white: CGFloat, alpha: CGFloat)
white范圍是0.0-1.0表示灰度的值,約小顏色越黑。1.0表示白色。
然后來看RGB:
init(red: CGFloat, green: CGFloat, blue: CGFloat, alpha: CGFloat)
很顯然,這里的RGB非常明顯,最后一個alpha表示透明度。
最后來看HSB:
init(hue: CGFloat, saturation: CGFloat, brightness: CGFloat, alpha: CGFloat)
同樣的,參數(shù)非常明顯,最后的alpha也是表示透明度。
既然可以創(chuàng)建顏色,自然也可以獲得顏色的RGB/HSB值。UIColor提供了值結果函數(shù):
func getHue(_ hue: UnsafeMutablePointer<CGFloat>?,
saturation: UnsafeMutablePointer<CGFloat>?,
brightness: UnsafeMutablePointer<CGFloat>?,
alpha: UnsafeMutablePointer<CGFloat>?) -> Bool
來獲得顏色的HSK以及alpha值,需要傳遞一個指針給對應的參數(shù),然后其被填充預定的值。
同樣的:
func getRed(_ red: UnsafeMutablePointer<CGFloat>?,
green: UnsafeMutablePointer<CGFloat>?,
blue: UnsafeMutablePointer<CGFloat>?,
alpha: UnsafeMutablePointer<CGFloat>?) -> Bool
獲取其RGB和alpha值。而
func getWhite(_ white: UnsafeMutablePointer<CGFloat>?,
alpha: UnsafeMutablePointer<CGFloat>?) -> Bool
則獲得灰度和alpha值。
2. 顏色的轉(zhuǎn)換
上面介紹說iOS有三種表示顏色的數(shù)據(jù)結構,除了UIColor還有CGColor以及CIColor。那么他們是如何轉(zhuǎn)換的呢?
首先來看從其他顏色轉(zhuǎn)換成UIColor:
init(ciColor: CIColor)
init(cgColor: CGColor)
UIKit是直接提供構造函數(shù)來進行轉(zhuǎn)換的。那要怎么吧UIColor轉(zhuǎn)換成其他顏色呢?其提供了方法
var ciColor: CIColor { get }
var cgColor: CGColor { get }
可以直接獲取CIColor和CGColor對象。
可見這里的數(shù)據(jù)類型轉(zhuǎn)換其實和類型強制轉(zhuǎn)換沒什么區(qū)別,無非就是通過構造函數(shù)和getter來實現(xiàn)的。
除了不同顏色類型的轉(zhuǎn)換,UIColor對于灰色系,還可以通過
func withAlphaComponent(_ alpha: CGFloat) -> UIColor
從原有顏色上獲得不同灰度的顏色。
3. 最特殊的顏色表示--圖片
UIColor還有個讓人很費解的顏色--圖片。如果之前有Google過如何設置一個View的背景顏色為圖片,你一定看到過類似:
let v = UIView(frame: CGRect(x: 10, y: 180, width: 100, height: 100))
v.backgroundColor = UIColor(patternImage: UIImage(named: "my_view")!)
這樣的答案。設置背景圖片變成了設置背景顏色。其實可以吧背景圖片理解成一種特殊的顏色系,所以也就有了用一個UIImage來初始化顏色的操作了。