线性渐变LinearGradient使用总结
Android 支持三种颜色渐变, LinearGradient(线性渐变)、 RadialGradient (放射渐变)、 SweepGradient(扫描渐变)。这三种渐变均继承自android.graphics.Shader, Paint 类通过setShader()方法来支持渐变。
本篇文章介绍LinearGradient的使用,看下LinearGradient构造函数:
构造方法1(只支持两种颜色的渐变):
public LinearGradient(float x0, float y0, float x1, float y1,
int color0, int color1,TileMode tileMode) {
}
第一个参数:x0表示渐变色起始点x轴坐标
第二个参数:y0表示渐变色起始点y轴坐标
第三个参数:x1表示渐变色终点x轴坐标
第四个参数:y1表示渐变色终点y轴坐标
第五个参数:color0表示渐变色开始的颜色,颜色值要用16进制表示
第六个参数:color1表示渐变色结束的颜色,颜色值要用16进制表示
第七个参数:tileMode用于指定控件区域大于指定的渐变区域时,剩余区域的颜色填充方法。
TileMode 有3种方式可供选择,分别为CLAMP、REPEAT和MIRROR:
CLAMP :会将边缘的一个像素进行拉伸、扩展
REPEAT:平移复制
MIRROR:镜面翻转
构造方法2(支持多种颜色的渐变):
public LinearGradient(float x0, float y0, float x1, float y1,
int colors[],float positions[],TileMode tileMode) {
}
参数x0、y0、x1、y1、tileMode和第一个构造方法的一样,这里说下colors[]和positions[]:
colors[]为渐变的颜色值数组,颜色值要用16进制表示
positions[]为colors[]内多种颜色平铺渐变时每种颜色的比例位置,取值范围为:0~1
下面通过看一些渐变色的效果来理解以上2个构造函数的参数含义:
先贴上代码:
public class LinearGradientView extends View {
//默认渐变色开始颜色(红色)
private static final int DEFAULT_START_COLOR = Color.parseColor("#FF0000");
//默认渐变色结束颜色(黄色)
private static final int DEFAULT_END_COLOR = Color.parseColor("#FFFF00");
//开始、结束颜色
private int mStartColor, mEndColor;
//绘制的矩形区域
private RectF mRectF;
//画笔
private Paint mPaint;
public LinearGradientView(Context context) {
this(context, null);
}
public LinearGradientView(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
public LinearGradientView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.LinearGradientView);
mStartColor = typedArray.getColor(R.styleable.LinearGradientView_startColor, DEFAULT_START_COLOR);
mEndColor = typedArray.getColor(R.styleable.LinearGradientView_endColor, DEFAULT_END_COLOR);
typedArray.recycle();
initPaint();
}
private void initPaint() {
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setStyle(Paint.Style.FILL);
}
@Override
protected void onSizeChanged(int width, int height, int oldWidth, int oldHeight) {
super.onSizeChanged(width, height, oldWidth, oldHeight);
mRectF = new RectF(0, 0, width, height);
mPaint.setShader(new LinearGradient(0, 0, mRectF.right, 0,
mStartColor, mEndColor, Shader.TileMode.MIRROR));
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawRect(mRectF, mPaint);
}
}
一、两种渐变色的情况:
1、从左向右设置渐变色(不管TileMode)
mPaint.setShader(new LinearGradient(0, 0, mRectF.right, 0,
mStartColor, mEndColor, Shader.TileMode.MIRROR));
2、从左上角到右下角设置渐变色(不管TileMode)
mPaint.setShader(new LinearGradient(0, 0, mRectF.right, mRectF.bottom,
mStartColor, mEndColor, Shader.TileMode.MIRROR));
3、从上到下设置渐变色(不管TileMode)
mPaint.setShader(new LinearGradient(0, 0, 0, mRectF.bottom,
mStartColor, mEndColor, Shader.TileMode.MIRROR));
TileMode的三种模式的理解:
4、TileMode设置为MIRROR,从左向右设置渐变色(x方向的终点为View的中间位置)
mPaint.setShader(new LinearGradient(0, 0, mRectF.right/2, 0,
mStartColor, mEndColor, Shader.TileMode.MIRROR));
5、TileMode设置为REPEAT,从左向右设置渐变色(x方向的终点为View的中间位置)
mPaint.setShader(new LinearGradient(0, 0, mRectF.right/2, 0,
mStartColor, mEndColor, Shader.TileMode.REPEAT));
6、TileMode设置为CLAMP,从左向右设置渐变色(x方向的终点为View的中间位置)
mPaint.setShader(new LinearGradient(0, 0, mRectF.right/2, 0,
mStartColor, mEndColor, Shader.TileMode.CLAMP));
二、多种渐变色的情况
1、从左向右设置渐变色(x方向的终点为View的右边)
int[] colorArray = new int[]{Color.RED,Color.YELLOW,Color.BLUE,Color.GREEN};
float[] positionArray = new float[]{0f,0.3f,0.6f,0.9f};
mPaint.setShader(new LinearGradient(0, 0, mRectF.right, 0,
colorArray, positionArray, Shader.TileMode.REPEAT));
2、从左向右设置渐变色(x方向的终点为View的中间位置), tileMode为MIRROR
int[] colorArray = new int[]{Color.RED,Color.YELLOW,Color.BLUE,Color.GREEN};
float[] positionArray = new float[]{0f,0.3f,0.6f,0.9f};
mPaint.setShader(new LinearGradient(0, 0, mRectF.centerX(), 0,
colorArray, positionArray, Shader.TileMode.MIRROR));
3、看下渐变色文字效果
mPaint.setTextSize(100);
canvas.drawText("hello world",0,mRectF.centerY(),mPaint);
这里渐变色:
int[] colorArray = new int[]{Color.RED,Color.YELLOW,Color.BLUE,Color.GREEN};
float[] positionArray = new float[]{0f,0.3f,0.6f,0.9f};
mPaint.setShader(new LinearGradient(0, 0, mRectF.centerX(), 0,
colorArray, positionArray, Shader.TileMode.MIRROR));
更多推荐
所有评论(0)