SeniorUI0403_Gradient:环形渲染效果、梯度渲染、组合渲染

高级UI汇总​​​​​​​
SeniorUI04_Paint高级渲染Shader使用
##一 RadialGradient

  1. 效果图:
    这里写图片描述

  2. Demo:
    RadialGradientView

  3. Code:

public class RadialGradientView extends View {
    private Paint mPaint;

    private int[] mColors = {Color.RED,Color.GREEN,Color.BLUE,Color.YELLOW};

    public RadialGradientView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        mPaint = new Paint();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawColor(Color.WHITE);

        RadialGradient mRadialGradient = new RadialGradient(350, 350, 100, mColors, null, Shader.TileMode.CLAMP);
		mPaint.setShader(mRadialGradient);
		canvas.drawCircle(350, 350, 300, mPaint);   
    }
}

##二 SweepGradient梯段渲染

  1. 效果图
    这里写图片描述
  2. Demo
    SweepGradientView
  3. Code
        SweepGradient mSweepGradient = new SweepGradient(300, 300, mColors, null);
        mPaint.setShader(mSweepGradient);
        canvas.drawCircle(350, 350, 300, mPaint);

##三 ComposeShader组合渲染

  1. 效果图
    这里写图片描述
  2. Demo
    ComposeGradientView
  3. Code
  /***************用ComposeShader即可实现心形图渐变效果*********************************/
        //创建BitmapShader,用以绘制心
        BitmapShader bitmapShader = new BitmapShader(mBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
        //创建LinearGradient,用以产生从左上角到右下角的颜色渐变效果
        LinearGradient linearGradient = new LinearGradient(0, 0, mWidth, mHeight, Color.GREEN, Color.BLUE, Shader.TileMode.CLAMP);
        //bitmapShader对应目标像素,linearGradient对应源像素,像素颜色混合采用MULTIPLY模式
        ComposeShader composeShader = new ComposeShader(bitmapShader, linearGradient, PorterDuff.Mode.MULTIPLY);
        //将组合的composeShader作为画笔paint绘图所使用的shader
        mPaint.setShader(composeShader);
        //用composeShader绘制矩形区域
        canvas.drawRect(50, 50, mWidth, mHeight, mPaint);

猜你喜欢

转载自blog.csdn.net/baopengjian/article/details/80653341