欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

16进制转RGB:颜色转换背后的原理

最编程 2024-01-13 08:25:15
...

常见的几种表示颜色的方法有:

  1. ColorName: 直接用颜色的名称来指定颜色,比如: red blue green yellow

    • 优点: 很直观的表达想要使用的颜色
    • 缺点: 颜色的名称很少, 不能有效表示一些较为丰富的颜色
  2. RGB: 三通道颜色

    • 他是目前运用最广泛的颜色系统之一
    • 可以通过红绿蓝三色通道, 外加alpha透明度, 来展示几乎所有的颜色
    • RGB是从颜色的发光原理来设定的, 相当于红绿蓝三个颜色通过不同亮度, 来组合成为需要的颜色
    • 0为最暗, 255为最亮
  3. HEX: 十六进制颜色

    • 十六进制与RGB都可以展示出非常丰富的颜色, 他是通过16进制0~F这16个字符来表达颜色的
    • 同样, 000000为黑色, FFFFFF为白色

RGB转换为HEX

  • RGB与HEX中每个颜色都是一一对应的关系, 如下面的附表所示
  • RGB的数值 = 16 * HEX的第一位 + HEX的第二位
  • 示例如下:
    • RGB: 92, 184, 232
    • 92 / 16 = 5余12 -> 5C
    • 184 / 16 = 11余8 -> B8
    • 232 / 16 = 14余8 -> E8
    • HEX = 5CB8E8

HEX转换RGB

  • 此转换就是将上述的转换逆转即可
  • 示例如下
    • HEX: F26BC1
    • F2 = 15和2 -> 15 * 16 + 2 = 242
    • 6B = 6和11 -> 6 * 16 + 11 = 107
    • C1 = 12和1 -> 12 * 16 + 1 = 193

转载来源:简书

代码中如何使用十六进制的颜色?

使用演示:

方式一

 [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];
}

如何计算的?

0xF86340 & 0xFF0000, 0xF86340 & 0xFF00 ,0xF86340 & 0xFF 分别是什么意思?
0xF86340 & 0xFF0000 ,表示 F863400xFF0000 进行 运算,目的是要取出F86340的前两位F8,因为F8表示red颜色通道的值,取出来的值已经是转换好的十进制的了。

0xF86340
十六进制: F 8 6 3 4 0
二进制: 1111 1000 0110 0011 0100 0000
0xFF0000
十六进制: F F 0 0 0 0
二进制: 1111 1111 0000 0000 0000 0000

位运算

项目
0xF86340二进制: 1111 1000 0110 0011 0100 0000
运算符: &
0xFF0000二进制: 1111 1111 0000 0000 0000 0000
(计算结果)二进制: 1111 1000 0000 0000 0000 0000

通过位运算得到结果的1111 1000 0000 0000 0000 0000,如果将此二进制数转换为十进制数,是一个非常大的数,而每个颜色通道的最大值是255,所以还需要通过位移运算,将得到的结果控制到最大范围内。

如何位移运算?

首先我们先看下面一个二进制数:
0000 0000 0000 0000 1111 1111 ===> 该数最大的值是 255 (十进制)。
所以我们只要将之前计算的结果位移到最后的八个二进制位的位置上即可。

1111   1000     0000     0000      0000     0000  >> 16   右移160000   0000     0000     0000      1111     1000     (位移后的结果)

0xF86340 & 0xFF00F86340 & 0xFF 分别取出十六进制的 6340 通过位运算和位移运算 转换为十进制,进行颜色值的计算(计算原理和上述一样)。

转载来源:简书