Android开发:Android颜色透明度换算表


一、背景

作为一名Android开发人员,在每次开发的时候,UI会在设计图中标注颜色值,或者会直接给出颜色值,如:#FF2309,但是有时候为了达到某种效果,需要在颜色值前面添加透明度,如:40%|的透明度。还有一种情况就是交给UI验收的时候,说界面和设计图不符,让自己回去做对比,往往和透明度的值有关系,我的天!整个人都不好了,透明度怎么计算?怎么搞?

一定要和UI对接好,UI给的是透明度不透明度的值,很重要!!!

二、颜色值标准格式

Android中的颜色值标准格式为RGB/ARGB标准,使用时通常以“#”字符开头,以16进制表示。

如:#RGB、#RRGGBB、#ARGB、#AARRGGBB。R:红色;G:绿色;B:蓝色;A:透明度,如果不含A,说明完全透明(即默认100%,完全不透明)。

三、透明度

一定要和UI对接好,UI给的是透明度不透明度的值,很重要!!!

口语说的透明度从0%~100%,换算成二进制为256个值(0-255),计算机上用16进制表示为(00-ff)。透明就是0,不透明就是255,如果50%|透明就是127(256的一半是128,但因为是从0开始,所以实际上是127)。
透明度 和 不透明度 是两个概念, 它们加起来是1,或者100%
ARGB 中的透明度alpha,表示的是不透明度。

四、透明度计算

需要不透明度值的,可以自己算:透明度值 + 不透明度值 = 100%

如果你的UI设计师给的视觉稿标注是:颜色#FFFFFF,透明度40% 。那你的计算方式应该是:

将透明度转换成不透明度。不透明度为:60%
不透明度乘以255。 我们得到结果:153
将计算结果转换成16进制。得到最终的不透明度:99
将不透明度和颜色值拼接成ARGB格式。得到最终的颜色值: #99FFFFFF
所以,你的UI设计师要的颜色是:#99FFFFFF

如果UI给的是透明度值A%,则计算公式:255(100% - A%) ,将计算结果转为16进,对照表1:*

表一:

透明度 16进制表示
100 % 00
99   % 03
98   % 05
97   % 07
96   % 0A
95   % 0D
94   % 0F
93   % 12
92   % 14
91   % 17
90   % 1A
89   % 1C
88   % 1E
87   % 21
86   % 24
85   % 26
84   % 29
83   % 2B
82   % 2E
81   % 30
80   % 33
79   % 36
78   % 38
77   % 3B
76   % 3D
75   % 40
74   % 42
73   % 45
72   % 47
71   % 4A
70   % 4D
69   % 4F
68   % 52
67   % 54
66   % 57
65   % 59
64   % 5C
63   % 5E
62   % 61
61   % 63
60   % 66
59   % 69
58   % 6B
57   % 6E
56   % 70
55   % 73
54   % 75
53   % 78
52   % 7A
51   % 7D
50   % 80
49   % 82
48   % 85
47   % 87
46   % 8A
45   % 8C
44   % 8F
43   % 91
42   % 94
41   % 96
40   % 99
39   % 9C
38   % 9E
37   % A1
36   % A3
35   % A6
34   % A8
33   % AB
32   % AD
31   % B0
30   % B3
29   % B5
28   % B8
27   % BA
26   % BD
25   % BF
24   % C2
23   % C4
22   % C7
21   % C9
20   % CC
19   % CF
18   % D1
17   % D4
16   % D6
15   % D9
14   % DB
13   % DE
12   % E0
11   % E3
10   % E6
9   % E8
8   % EB
7   % ED
6   % F0
5   % F2
4   % F5
3   % F7
2   % FA
1   % FC
0   % FF

举个例子:

UI给出的颜色值为#FFFF00,透明度40%。

结合表1,40%的透明度16进制的值为 99,那么最终的颜色值为 #99FFFF00

如果UI给的是不透明度值A%,则计算公式:255*(A%) ,将计算结果转为16进,对照表2:

表二:

不透明度 十六进制
100% FF
99% FC
98% FA
97% F7
96% F5
95% F2
94% F0
93% ED
92% EB
91% E8
90% E6
89% E3
88% E0
87% DE
86% DB
85% D9
84% D6
83% D4
82% D1
81% CF
80% CC
79% C9
78% C7
77% C4
76% C2
75% BF
74% BD
73% BA
72% B8
71% B5
70% B3
69% B0
68% AD
67% AB
66% A8
65% A6
64% A3
63% A1
62% 9E
61% 9C
60% 99
59% 96
57% 94
56% 91
56% 8F
55% 8C
54% 8A
53% 87
52% 85
51% 82
50% 80
49% 7D
48% 7A
47% 78
46% 75
45% 73
44% 70
43% 6E
42% 6B
41% 69
40% 66
39% 63
38% 61
37% 5E
36% 5C
35% 59
34% 57
33% 54
32% 52
31% 4F
30% 4D
28% 4A
28% 47
27% 45
26% 42
25% 40
24% 3D
23% 3B
22% 38
21% 36
20% 33
19% 30
18% 2E
17% 2B
16% 29
15% 26
14% 24
13% 21
12% 1F
11% 1C
10% 1A
9% 17
8% 14
7% 12
6% 0F
5% 0D
4% 0A
3% 08
2% 05
1% 03
0% 00

举个例子:

UI给出的颜色值为#FFFF00,不透明度40%。

结合表2,40%的不透明度16进制的值为 66,那么最终的颜色值为 #66FFFF00




参考:

https://blog.csdn.net/jabony/article/details/52804296

https://blog.csdn.net/ouyang_peng/article/details/51896521

猜你喜欢

转载自blog.csdn.net/zxz_zxz_zxz/article/details/130734638