【笔记】颜色渐变标签之坑爹的 @android:color/transparent

先来切入一个场景:

小五童鞋想要一个直线的渐变,从左到右,颜色从绿色逐渐变成透明的,按照这个想法,小五童鞋写下了如下代码:



     
    

然后,请提前拖住下巴,我们一起瞧瞧效果图:

【笔记】颜色渐变<gradient>标签之坑爹的 @android:color/transparent_第1张图片
绿色到透明的效果图

怎么肥事!太Ugly了吧,中间夹杂的黑灰色东东从哪冒出来的?


哈哈,惊不惊喜,意不意外? 其实道理很简单,我们只需要用照妖镜看看@android:color/transparent的真面目就明白了。且看下图@android:color/transparent之素面朝天照。

【笔记】颜色渐变<gradient>标签之坑爹的 @android:color/transparent_第2张图片
素颜照

真相:@android:color/transparent的十六进制颜色表示是#00000000,这货不就是一个全透明的黑色么!

是哒是哒 :smile: ~ 哈哈 这就是那坨黑灰色东东的来源所在!


大家应该都知道,我们的十六进制颜色数值由ARGB[1]四个部分组成.所以我们小五童鞋写的从绿色透明色渐变的代码最终执行过程是这样的:

【笔记】颜色渐变<gradient>标签之坑爹的 @android:color/transparent_第3张图片
小五童鞋代码中startColor到endColor对应ARGB数值的变化过程

上图颜色数值的变化:A:FF->00 R:27->00 G:AE->00 B:60->00

现在,看着这个颜色渐变过程演示图,大家是不是立马豁然开朗,茅塞顿开呀 哈哈
小五童鞋的代码之所以有黑灰色杂质,就是因为坑爹的@android:color/transparent虽然是全透明的,但却是一个黑色的全透明,而代码中的绿色#27ae60[2]#00000000的渐变过程中,其对应的RGB也在变化,绿色#27ae60[2]的Alpha值是到颜色渐变的最后才变为0的, 也就是中间的颜色渐变过程中Alpha并不等于0,因此颜色渐变的各个阶段所对应呈现出来的颜色效果最终都会参杂着RGB数值变化带来的颜色污染,就像这里的黑灰色杂质

所以,小五童鞋该怎么做,才能实现想要的效果?

扫地僧:控制色域变化范围

也就是只让ARGB中的A变化,其余的RGB保持不变!一言不合上代码:




    

修改后的效果图:终于绿彻底了 !

【笔记】颜色渐变<gradient>标签之坑爹的 @android:color/transparent_第4张图片
小五想要的效果图

OL ! 就酱紫吧,希望对大家有所帮助,如果喜欢,不要小气,给个呗!


  1. ARGB分别代表AlphaRedGreenBlue 四种色彩空间 ↩

  2. #27ae60中缺失的Alpha值会自动用FF补全,也就是#FF27ae60 ↩ ↩

你可能感兴趣的:(【笔记】颜色渐变标签之坑爹的 @android:color/transparent)