android 使用Path实现涂鸦效果
来源:互联网 发布:淘宝怎么搜索发票 编辑:程序博客网 时间:2024/05/29 11:51
今天周五了,感觉时间过的好快,这周真是过的太闲了,只好继续我的博客之旅了,今天实现一个涂鸦效果,会分几步实现,这里有一个重要的知识点就是图层,要理解这个,不然你看这篇博客,很迷茫,迷茫的苍茫的天涯是我的爱,先从简单的需求做起,绘制一条线,代码如下:
package com.tuya;import android.content.Context;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.Path;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;/** * Created by admin on 2016/12/16. */public class GraffitiView extends View{ private Paint paint; private Path path; private float downX,downY; private float tempX,tempY; public GraffitiView(Context context) { this(context,null); } public GraffitiView(Context context, AttributeSet attrs) { this(context, attrs,0); } public GraffitiView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } private void init() { paint = new Paint(); paint.setAntiAlias(true); paint.setStrokeWidth(10); paint.setStyle(Paint.Style.STROKE); path = new Path(); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); if(path!=null){ canvas.drawPath(path,paint); } } @Override public boolean onTouchEvent(MotionEvent event) { switch (event.getAction()){ case MotionEvent.ACTION_DOWN: downX = event.getX(); downY = event.getY(); path.moveTo(downX,downY); invalidate(); tempX = downX; tempY = downY; break; case MotionEvent.ACTION_MOVE: float moveX = event.getX(); float moveY = event.getY(); path.quadTo(tempX,tempY,moveX,moveY); invalidate(); tempX = moveX; tempY = moveY; break; } return true; }}效果:
如果你不使用path的quadTo()用lineTo()方法也行,但是没有使用queadTo()绘制出来的路径光滑,这5条路径是怎么绘制到屏幕上去的呢?上面说了图层的概念,如果不懂,可以去看下我之前写的关于canvas博客,也可以去网上看其他的博客,
我们知道每次canvas.draw...()其实都会产生新的图层,只是图层是透明的,最后隐射到画布(canvas)上,画布分析:
现在来了一个新需求,就是有一个撤销的功能,要实现撤销功能,你得记录会所绘制的path,那我们用集合去记录下每次绘制的path路径,撤销就是把最近的一个path从集合中移除,然后再把其他path绘制上去
代码如下:
package com.tuya;import android.content.Context;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.Path;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;import java.util.ArrayList;import java.util.List;/** * Created by admin on 2016/12/16. */public class GraffitiView extends View{ private Paint paint; private Path path; private float downX,downY; private float tempX,tempY; private List<DrawPath> drawPathList; public GraffitiView(Context context) { this(context,null); } public GraffitiView(Context context, AttributeSet attrs) { this(context, attrs,0); } public GraffitiView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); drawPathList = new ArrayList<>(); initPaint(); } private void initPaint() { paint = new Paint(); paint.setAntiAlias(true); paint.setStrokeWidth(10); paint.setStyle(Paint.Style.STROKE); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); if(drawPathList!=null&&!drawPathList.isEmpty()){ for(DrawPath drawPath:drawPathList){ if(drawPath.path!=null){ canvas.drawPath(drawPath.path,drawPath.paint); } } } } @Override public boolean onTouchEvent(MotionEvent event) { switch (event.getAction()){ case MotionEvent.ACTION_DOWN: downX = event.getX(); downY = event.getY(); path = new Path();//每次手指下去都是一条新的路径 path.moveTo(downX,downY); DrawPath drawPath = new DrawPath(); drawPath.paint = paint; drawPath.path = path; drawPathList.add(drawPath); invalidate(); tempX = downX; tempY = downY; break; case MotionEvent.ACTION_MOVE: float moveX = event.getX(); float moveY = event.getY(); path.quadTo(tempX,tempY,moveX,moveY); invalidate(); tempX = moveX; tempY = moveY; break; case MotionEvent.ACTION_UP: initPaint();//每次手指抬起都要重置下画笔,不然画笔会保存了之前的设置什么画笔的属性会引起bug break; } return true; } public void undo() { if(drawPathList!=null&&drawPathList.size()>=1){ drawPathList.remove(drawPathList.size()-1); invalidate(); } } /** * 封装一条路径 */ class DrawPath{ Path path; Paint paint; }}效果图:
产品狗静静的走在你跟前说,添加个反撤销功能吧,然后走了,于是默默的又要添加功能,还好这不改之前的代码,只是需要记录下之前从集合中移除的path即可,
思路:用集合把之前删除的path缓存起来,反撤销功能就是把之前的path添加进去然后重新绘制即可,代码实现
关键代码:
/** * 撤销功能 */public void undo() { if(drawPathList!=null&&drawPathList.size()>=1){ savePathList.add(drawPathList.get(drawPathList.size()-1)); drawPathList.remove(drawPathList.size()-1); invalidate(); }}/** * 反撤销功能 */public void reundo() { if(savePathList!=null&&!savePathList.isEmpty()){ drawPathList.add(savePathList.get(savePathList.size()-1)); savePathList.remove(savePathList.size()-1); invalidate(); }}效果图:
心想做好了,等测试吧,这个时候产品狗过来笑嘻嘻的挺牛逼的,这么快就做出来了,然后说如果每次绘制都是黑色,是不是太单调,给用户几个颜色选择吧,这样总比一个黑色好,心想尼玛,有病吧,怎么需求不一下子说好,但是又没办法,只好去实现了,这个也不难,心想算了,其实只要改变画笔的颜色就可以实现了,
很简单的一段代码处理就ok
/** * 改变画笔颜色 * @param color */public void resetPaintColor(int color) { paint.setColor(color);}效果:
现在产品狗说画笔的宽度能不能让用户自己去调试啊,不要给死了,这个时候估计你就直接把产品狗干死,奈何,产品狗是警察学校毕业的,只要擦干眼泪,默默的去撸码了,所以说程序员要经常锻炼,不然你会被产品狗干死的,
/** * 放大就是改变画笔的宽度 */public void resetPaintWidth() { paintWidth+=2; paint.setStrokeWidth(paintWidth);}效果:
产品看你很来事,又叫你实现一歌橡皮擦的功能,现在绘制了后如果不想要就只能撤销了不能擦除什么的,其实实现橡皮擦功能很简单
/** * 橡皮擦功能 把画笔的颜色和view的背景颜色一样就ok,然后把画笔的宽度变大了,擦除的时候显得擦除范围大点 */public void eraser() { paint.setColor(Color.parseColor("#CDC0B0"));//这是view背景的颜色 paint.setStrokeWidth(paintWidth+6);}效果:
好了,简单的涂鸦功能算实现了!
- android 使用Path实现涂鸦效果
- Android Path Button效果实现
- android 使用Path实现搜索动态加载动画效果
- canvas实现粒子涂鸦效果
- Android实现涂鸦功能
- android涂鸦实现
- Android涂鸦的实现
- Path使用--二阶贝塞尔曲线实现水波效果
- as3.0实现小涂鸦效果
- android实现涂鸦,保存涂鸦后的图片,清屏
- android实现涂鸦,保存涂鸦后的图片,清屏
- android涂鸦绘图功能部分实现
- android 实现在照片上涂鸦
- Android实现手写板和涂鸦功能
- Android实现手写板和涂鸦功能
- android实现手写板和涂鸦功能
- LibGdx将ShapeRenderer和Path结合使用,实现填充效果
- android 涂鸦
- 数据结构期末总结
- 读《Web全栈工程师的自我修养》
- Cordova - file插件的使用详解(文件的创建、读写,文件夹创建等)
- 第十六周项目1-(8)验证算法基数排序
- iOS Swift3.0地图自定义标注和气泡
- android 使用Path实现涂鸦效果
- 世纪大战:Tab VS Space
- ios一个简单的自定义密码输入框,alert样式和sheet样式
- python 生成条形码
- 【第16周项目1-堆排序】
- MediaCodec编译pcm为aac
- mvn介绍
- Ubuntu12.10 使用DNW传数据 进行ARM开发板烧写
- 第十四周项目1—验证算法(折半查找)