Paint的高级渲染
来源:互联网 发布:汽车行业概况知乎 编辑:程序博客网 时间:2024/06/05 15:11
Paint的高级渲染
Paint的高级渲染主要用到方法:
public Shader setShader(Shader shader);
Shader:着色器,Canvas的drawXXXX这个方法是画具体的形状,画笔的shader定义的就是图形的着色和外观,即Canvas定义了一个区域(如:矩形,圆形等),Paint的Shader就是给这个区域填充内容(内容可以是图片,颜色等),也就是着色。
一.Shader的继承关系:
二、实例练习
1.BitmapShader:
/** * Call this to create a new shader that will draw with a bitmap. * * @param bitmap The bitmap to use inside the shader * @param tileX The tiling mode for x to draw the bitmap in. * @param tileY The tiling mode for y to draw the bitmap in. */ public BitmapShader(@NonNull Bitmap bitmap, TileMode tileX, TileMode tileY){}
可以看出,BitmapShader构造函数需要三个参数:
-bitmap : 图片
-tileX : 图片x轴方向上的拉伸模式
-tileY : 图片在y轴方向上的拉伸模式
TileMode 拉伸形式,当图片比我们指定的图形(如:Rect)区域小的时候,会根据我们指定的拉伸模式,来拉伸我们的图片 CLAMP --是拉伸最后一个像素并铺满 MIRROR ---是横向纵向不足处不断翻转镜像平铺 REPEAT ---类似电脑壁纸,横向纵向不足的重复放置
代码
BitmapShader bitmapShader = new BitmapShader(mBitMap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);mPaint.setShader(bitmapShader);mPaint.setAntiAlias(true);canvas.drawCircle(mHeight , mHeight , mHeight , mPaint);
不同模式的实现效果如下:
正常情况下,实现圆形头像的话,会改变头像的大小,使之与圆形区域一样大,或者改变圆形区域的大小,如:
BitmapShader bitmapShader = new BitmapShader(mBitMap, Shader.TileMode.REPEAT, Shader.TileMode.REPEAT);mPaint.setShader(bitmapShader);mPaint.setAntiAlias(true);float scale = ((float) Math.max(mWidth, mHeight)) / Math.min(mWidth, mHeight);Matrix matrix = new Matrix();matrix.setScale(scale, scale);canvas.drawCircle(mHeight / 2, mHeight / 2, mHeight / 2, mPaint);//canvas.drawOval(new RectF(0, 0, mWidth, mHeight), mPaint);//画椭圆//canvas.drawRect(new Rect(0, 0, 600, 800), mPaint);//矩形
实现效果:
圆形头像的其他实现方式:
ShapeDrawable shapeDrawable = new ShapeDrawable(new OvalShape());BitmapShader bitmapShader = new BitmapShader(mBitMap, Shader.TileMode.MIRROR, Shader.TileMode.MIRROR);shapeDrawable.getPaint().setShader(bitmapShader);shapeDrawable.setBounds(0, 0, mWidth, mWidth);shapeDrawable.draw(canvas);
通过ShapeDrawable来实现圆形头像,其实就是通过ShapeDrawable来指定一个圆形的区域,相当于是封装了一下(里面封装了画笔,图形区域和绘制方法)。
2.LinearGradient:线性渲染
LinearGradient有两个构造函数,渲染方式:从左上角向右下角渲染(即渐变)。
/*** x0, y0, 起始点* x1, y1, 结束点* int[] mColors, 中间依次要出现的几个颜色* float[] positions,数组大小跟colors数组一样大,中间依次摆放的几个颜色分别放置在那个位置上(参考比例从左往右),各个颜色显示的占比,如new int[]{0.1,0.2,0.3,0.4}* tile*/public LinearGradient(float x0, float y0, float x1, float y1, int colors[], float positions[],TileMode tile);public LinearGradient(float x0, float y0, float x1, float y1, int color0, int color1,TileMode tile)
线性渲染支持但颜色和多颜色,positions[]可以传null,有系统自动分配位置。
实例:
int[] mColors = {Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW};LinearGradient linearGradient = new LinearGradient(0, 0, 800, 800,Color.RED,Color.YELLOW ,Shader.TileMode.CLAMP);//LinearGradient linearGradient = new LinearGradient(0, 0, 800, 800, mColors, null, //Shader.TileMode.CLAMP);mPaint.setShader(linearGradient);canvas.drawRect(0, 0, 800, 800, mPaint);
实现效果:
3.RadialGradient:环形渐变
构造函数,与LinearGradient类似,不在赘述。渲染方式:从圆心位置开始,向外层渲染。
public RadialGradient(float centerX, float centerY, float radius, @NonNull int colors[], @Nullable float stops[], @NonNull TileMode tileMode); public RadialGradient(float centerX, float centerY, float radius, int centerColor, int edgeColor, @NonNull TileMode tileMode)
环形渲染从圆心开始,一次向外层画,
RadialGradient radialGradient = new RadialGradient(400, 400, 400, mColors, null, Shader.TileMode.CLAMP); mPaint.setShader(radialGradient); canvas.drawCircle(400,400,400,mPaint);
实现效果:
4.SweepGradient:梯度渲染
指定一个圆心,从3点钟方向开始,沿着顺时针依次画出给定的颜色。
实例:
int[] mColors = {Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW};SweepGradient sweepGradient = new SweepGradient(400, 400, mColors, null);mPaint.setShader(sweepGradient);//canvas.drawCircle(400, 400, 300, mPaint);canvas.drawRect(100,100,700,700,mPaint);
5.ComposeShader:组合渐变
用ComposeShader即可实现心形图渐变效果,如下:
/***************用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(0, 0, mWidth, mHeight, mPaint);
实现效果:
代码:
1、倒影图片效果:
https://github.com/meiSThub/DN_Homework/blob/master/app/src/main/java/com/mei/test/ui/paint/InvertedImageActivity.java
2、雷达扫描:
https://github.com/meiSThub/DN_Homework/blob/master/app/src/main/java/com/mei/test/ui/paint/RadarActivity.java
3、水波纹按钮:
https://github.com/meiSThub/DN_Homework/blob/master/app/src/main/java/com/mei/test/ui/paint/RippleActivity.java
- Paint的高级渲染
- (七)Paint 高级渲染
- 绘图不可或缺的画笔Paint-渲染篇
- Android 高级UI解密 (一) :实例详解Paint 与 高级渲染
- Android开发之Paint的高级使用
- Paint画笔的基本使用——渲染
- Android Paint 之 BitmapShader位图的图像渲染器
- Paint高级效果
- Quantumas 展现的高级渲染技术
- [转载]Android 高级绘图 paint
- Android Shader 颜色、图像渲染 paint.setXfermode
- Android Paint之Shader渲染详解
- 高级渲染配置
- [siggraph14]《刺客信条》的高级大气雾效渲染技术
- Android 高级绘图 Canvas, Paint , Bitmap
- Android开发之高级渲染
- Paint详细解析(1)—Shader(图像渲染)
- QT的Paint 系统
- Mysql优化4-合适的索引
- [LeetCode]202. Happy Number(判断正整数是不是Happy Number)
- Android-service之aidl
- 编写qt程序的流程
- x86 中32位寻址模式
- Paint的高级渲染
- 什么是微信小程序?
- Failed to execute goal org.apache.maven.plugins:maven-war-plugin 解决办法
- 2017年第0届浙江工业大学之江学院程序设计竞赛决赛 A: qwb与支教 [容斥]【数学】
- 数据结构之顺序表
- 使用对象类型+在存储过程使用+在函数中使用
- 小程序会取代APP吗?
- ---博弈论---
- builder模式——实现具名可变参数