1. 介紹
在iOS日常開發(fā)中
UIColor是我們很常用的一個(gè)類,用來呈現(xiàn)出各種顏色,色彩搭配得當(dāng),可以繪制出很漂亮的UI界面.另外顏色也可以用來作為日常開發(fā)調(diào)試UI的一種方式.-
顏色的表示形式有很多種.
- 十進(jìn)制表示
rgb(255,255,255) - 十六進(jìn)制
0xC1C1C1 - 十六進(jìn)制字符串
#C1C1C1
- 十進(jìn)制表示
- RGB 代表三原色,其中
R(Red),G(Green),B(Blue),分別代表三個(gè)顏色通道.每個(gè)顏色通道的最大值是,也就是256.注意(
= 1) 這里是從1開始 256-1 = 255;共有255中取值.
- 所以說我們常見的RGB取值范圍是(0~255).
- 數(shù)值表示
一個(gè)顏色顯示的描述是由三個(gè)數(shù)值控制的宙刘，他分別為R铅歼、G、B若皱。但三個(gè)數(shù)值位為最大時(shí)，顯示為白色，當(dāng)三個(gè)數(shù)值最小時(shí)，顯示為黑色吊履。
數(shù)值表示可以使用以下幾種不同的方式:
從0到1之間可用的數(shù)來表示----浮點(diǎn) 從0%到100%----百分比 使用0到255之間的整數(shù)，八位數(shù)字表示调鬓，通常表示為十進(jìn)制和十六進(jìn)制的數(shù)值 高端數(shù)字圖像設(shè)備通常會(huì)使用更大的整數(shù)來表示艇炎，比如0 . . 1023(10位),0 . . 65535(16位)或更大 例如紅色在不同方式下的表示
| 方式 | RGB 表示 |
|---|---|
| 浮點(diǎn) | (1.0, 0.0, 0.0) |
| 百分比 | (100%, 0%, 0%) |
| 八位數(shù)字 | (255, 0, 0) 或#FF0000 (十六進(jìn)制) |
| 十六位數(shù)字 | (65535, 0, 0) |
- 我們?nèi)粘ｉ_發(fā)中作為常用的是浮點(diǎn)數(shù)和八位數(shù)字表示.
注: 這里只是簡(jiǎn)單的介紹RGB,作為快速了解,詳細(xì)請(qǐng)參考維基百科
2. 如何使用十六進(jìn)制顏色?
- 在iOS日常開發(fā)中你很有可能寫出這樣的代碼
[UIColor colorWithRed:red/255.0 green:green/255.0 blue:blue/255.0 alpha:alpha]; - red,green,blue 代表傳入?yún)?shù),分別是三種顏色通道的取值,除以最大值255(red/255),是以小數(shù)的形式傳入的,分子的取值不能超過255.
- apha:代表顏色的透明度取值范圍是(0-1)
- 在日常開發(fā)中我們經(jīng)常見到
#F86340或者0xF86340一個(gè)是十六進(jìn)制字符串的形式,一個(gè)是十六進(jìn)制數(shù)值的形式,用來表示顏色的,那我們?nèi)绾问褂?如果轉(zhuǎn)換成十進(jìn)制的表示形式呢? - 要完成顏色轉(zhuǎn)換成十進(jìn)制的數(shù),我們需要使用到位運(yùn)算和位移運(yùn)算.
2.1 一個(gè)十六進(jìn)制數(shù)如何表示RGB三原色的?
- 比如
F86340我們都知道RGB,三個(gè)顏色通道,每個(gè)顏色通道的最大取值是255,如果十進(jìn)制255用十六進(jìn)制表示是FF. - 所以我們可以知道每個(gè)顏色通道需要用兩個(gè)十六進(jìn)制數(shù)表示.
- 一個(gè)完整的十六進(jìn)制表示顏色需要6位.
2.2 如何使用十六進(jìn)制的顏色?
2.2.1 使用演示
[UIColor colorWithRed:((0xF86340 & 0xFF00) >> 8)/255.0 green:((0xF86340 & 0xFF00) >> 8)/255.0 blue:((0xF86340 & 0xFF))/255.0 alpha:1];
或者
+ (UIColor *)ml_colorWithHex:(UInt32)hex alpha:(CGFloat)alpha{
CGFloat score_R = (hex & 0xFF0000) >> 16;
CGFloat score_G = (hex & 0xFF00) >> 8;
CGFloat score_B = (hex & 0xFF);
return [UIColor colorWithRed:score_R/255.0 green:score_G/255.0 blue:score_B/255.0 alpha:alpha];
}
2.2.2 如何計(jì)算的?
-
0xF86340 & 0xFF0000,0xF86340 & 0xFF00,0xF86340 & 0xFF分別是什么意思? - 0xF86340 & 0xFF0000 ,表示 F86340 和 0xFF0000 進(jìn)行與運(yùn)算,目的是要取出
F86340的前兩位F8,因?yàn)?code>F8表示red顏色通道的值.
0xF86340的二進(jìn)制
| 十六進(jìn)制: | F | 8 | 6 | 3 | 4 | 0 |
|---|---|---|---|---|---|---|
| 二進(jìn)制: | 1111 | 1000 | 0110 | 0011 | 0100 | 0000 |
0xFF0000的二進(jìn)制
| 十六進(jìn)制: | F | F | 0 | 0 | 0 | 0 |
|---|---|---|---|---|---|---|
| 二進(jìn)制: | 1111 | 1111 | 0000 | 0000 | 0000 | 0000 |
- 位運(yùn)算
| 0xF86340二進(jìn)制: | 1111 | 1000 | 0110 | 0011 | 0100 | 0000 |
|---|---|---|---|---|---|---|
| 運(yùn)算符: | & | |||||
| 0xFF0000二進(jìn)制: | 1111 | 1111 | 0000 | 0000 | 0000 | 0000 |
| (計(jì)算結(jié)果)二進(jìn)制: | 1111 | 1000 | 0000 | 0000 | 0000 | 0000 |
通過位運(yùn)算得到結(jié)果的1111 1000 0000 0000 0000 0000,如果將此二進(jìn)制數(shù)轉(zhuǎn)換為十進(jìn)制數(shù),是一個(gè)非常大的數(shù),而每個(gè)顏色通道的最大值是255,所以還需要通過位移運(yùn)算,將得到的結(jié)果控制到最大范圍內(nèi).
- 如何位移運(yùn)算?
- 首先我們先看下面一個(gè)二進(jìn)制數(shù):
0000 0000 0000 0000 1111 1111===> 該數(shù)最大的值是 255(十進(jìn)制). - 所以所我們只要將之前計(jì)算的結(jié)果位移到最后的八個(gè)二進(jìn)制位的位置上即可.
1111 1000 0000 0000 0000 0000 >> 16 右移16位
-------------------------------------------------------------------
0000 0000 0000 0000 1111 1000 (位移后的結(jié)果)
7.0xF86340 & 0xFF00 和 F86340 & 0xFF分別取出十六進(jìn)制的63 和 40 通過位運(yùn)算和位移運(yùn)算 轉(zhuǎn)換為十進(jìn)制，進(jìn)行顏色值的計(jì)算(這里就不在詳解腾窝，計(jì)算原理和上述一樣).
