线性渐变颜色实现

  1. 采用drawable xml 中的shape gradient属性
<shape xml:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
        android:angle="0"
        android:endColor="#00000000"
        android:startColor="#0d000000"
        android:type="linear"
        android:useLevel="true"/>
</shape>
  1. 多重渐变,自定义view,实现复杂需求的可以采用LinearGradent
 /** Create a shader that draws a linear gradient along a line.
        @param x0           The x-coordinate for the start of the gradient line
        @param y0           The y-coordinate for the start of the gradient line
        @param x1           The x-coordinate for the end of the gradient line
        @param y1           The y-coordinate for the end of the gradient line
        @param  colors      The colors to be distributed along the gradient line
        @param  positions   May be null. The relative positions [0..1] of
                            each corresponding color in the colors array. If this is null,
                            the the colors are distributed evenly along the gradient line.
        @param  tile        The Shader tiling mode
    */
    publicLinearGradient(float x0, float y0, float x1, float y1, int colors[], float positions[], TileMode tile) {
        }

1.LinearGradient.TileMode.CLAMP
参考:https://www.2cto.com/kf/201603/492626.html
这种模式表示重复最后一种颜色直到该View结束的地方,如果我设置着色器开始的位置为(0,0),结束位置为(getMeasuredWidth(), 0)表示我的着色器要给整个View在水平方向上渲染不同的颜色,代码如下:

@Override
protectedvoidonDraw(Canvas canvas) {
    super.onDraw(canvas);
    Paint paint = newPaint();
    paint.setColor(Color.GREEN);
    LinearGradient linearGradient = newLinearGradient(0, 0, getMeasuredWidth(), 0,new int[]{ Color.RED, Color.WHITE, Color.BLUE }, null, LinearGradient.TileMode.CLAMP);
    paint.setShader(linearGradient);
    canvas.drawRect(0, 0, getMeasuredWidth(), getMeasuredHeight(), paint);
}

2.LinearGradient.TileMode.REPEAT
LinearGradient.TileMode.REPEAT表示着色器在水平或者垂直方向上对控件进行重复着色,类似于windows系统桌面背景中的“平铺”,那么接下来我们来看看着色器对这种模式的处理方式,假如我希望着色器开始渲染的位置为(0,0),结束渲染的位置为(getMeasuredWidth()/2, getMeasuredHeight()/2),但与之前不同的是这次的平铺方式变为LinearGradient.TileMode.REPEAT,我们来看看代码:

@Override
protectedvoidonDraw(Canvas canvas) {
    super.onDraw(canvas);
    Paint paint = newPaint();
    paint.setColor(Color.GREEN);
    LinearGradient linearGradient = newLinearGradient(0, 0, getMeasuredWidth()/2, getMeasuredHeight()/2,new int[]{Color.RED, Color.WHITE, Color.BLUE}, null, LinearGradient.TileMode.REPEAT);
    paint.setShader(linearGradient);
    canvas.drawRect(0, 0, getMeasuredWidth(), getMeasuredHeight(), paint);
}

3.LinearGradient.TileMode.MIRROR
LinearGradient.TileMode.MIRROR模式会在水平方向或者垂直方向上以镜像的方式进行渲染,这种渲染方式的一个特征就是具有翻转的效果,比如我希望我的着色器开始渲染的位置为(0,0),结束渲染的位置为(getMeasuredWidth()/2, 0),那么效果图是什么样子呢?我们先来看看代码:

@Override
protectedvoidonDraw(Canvas canvas) {
    super.onDraw(canvas);
    Paint paint = newPaint();
    paint.setColor(Color.GREEN);
    LinearGradient linearGradient = newLinearGradient(0, 0, getMeasuredWidth()/2, 0,new int[]{Color.RED, Color.WHITE, Color.BLUE}, null, LinearGradient.TileMode.MIRROR);
    paint.setShader(linearGradient);
    canvas.drawRect(0, 0, getMeasuredWidth(), getMeasuredHeight(),paint);
}
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • Android绘图之Shader Shader是绘图过程中的着色器,它有五个子类: BitmapShader Co...
    lavor阅读 15,604评论 3 62
  • 用来实现线性渐变效果 此类是Shader的子类通过paint.setShader来设置渐变。 有两个构造方法分别如...
    gaaaaaaaaaao阅读 38,591评论 0 29
  • 颜色相关:color、shader、colorFilter、Xfermode 1.直接设置颜色 setColor(...
    jadefly阅读 1,204评论 0 0
  • 今天的盘面保险领跌,低开低走,可能是昨晚没休息好,早晨就一直不精神,下午和其他家长约好了,去学校给孩子们照相,昨晚...
    锐基阅读 239评论 3 1
  • 是这样的 想了想不能白难过 把从前的人从黑名单放出来 觉得应该不要刻意回避 坦荡一点 然后其实自己真的非常讨厌自己...
    要做配得上电脑的人阅读 269评论 0 1

友情链接更多精彩内容