最近发现了一些有趣的东西。先问大家一个问题,这种样子的渐变要怎么实现呢?
![](https://img.haomeiwen.com/i158255/d1a5b02ccff0d71d.jpg)
经验丰富的同学也许一眼就看出来了,我当时稍微思考了一下,然后发觉这种渐变甚是熟悉。
这不就是拾色器上面的渐变嘛?
![](https://img.haomeiwen.com/i158255/767eca6f5c8d7e64.png)
相似的渐变还有这两种,是不是都十分的好看?
![](https://img.haomeiwen.com/i158255/6e6a5e6021a2b266.jpg)
既然看到到了拾色器上有这种渐变,那么实现原理也就十分简单了。
首先我们创建一个纯黑图层,作为背景
![](https://img.haomeiwen.com/i158255/6fc5614275ff0f57.jpg)
然后再新建一个图层,填充黑色(#000000),并添加渐变叠加,设置混合模式为滤色,线性180度,颜色由纯黑到纯蓝
![](https://img.haomeiwen.com/i158255/a7ab4a3e7be56baa.png)
接着再新建一个图层,填充黑色(#000000),并添加渐变叠加,设置混合模式为滤色,线性90度,颜色由纯黑到纯绿
![](https://img.haomeiwen.com/i158255/7e6164d980096a8c.png)
接着再新建一个图层,填充纯红(#ff0000)
最后把除黑色背景之外的图层的图层混合模式都设置为滤色便大功告成~
![](https://img.haomeiwen.com/i158255/b7a208af1c38724d.png)
最终效果如下。
![](https://img.haomeiwen.com/i158255/328c7fae4796186b.jpg)
另外,我正在把这种样式的渐变做成动态壁纸,如果进展顺利的话,估计月内就可以上线了,到时候欢迎大家前去下载~
设计稿大约是这样
![](https://img.haomeiwen.com/i158255/6458615b0404967b.jpg)
另外demo我要已经写好了,随便截几张图大家感受下是不是很漂亮?
![](https://img.haomeiwen.com/i158255/0cfd64ab241c1226.jpg)
app已经上了应用宝,叫彩彩壁纸,感兴趣的同学可以下载体验一下~
网友评论