您的位置:首页 > 移动开发 > Android开发

android手写笔思路

2015-06-16 20:43 330 查看
工作需要,对这方面做了一些了解

一般的手写对android canvas有点理解的应该都知道,只需要单纯的使用drawPath就可以在view上画画。

而手写笔的关键则是要让path的strokeWidth发生变化

这个令人头大了, 毕竟setPaint只能够设置一个paint,一旦改变paint的参数,整个path都会发生改变。

所以,我们只能够另辟蹊径。

我们可以先开一个arraylist(Point),用来记录我们在surfaceview(推荐在画画功能上使用surfaceview代替view,毕竟可以减轻ui线程的压力)上划过的坐标

Point tmpPoint = new Point();
			tmpPoint.set((int) event.getX(), (int) event.getY());
			pointStack.add(tmpPoint);
大家想想手写笔变化的因素是什么,是速度!

所以,我们必须将我们划过屏幕的速度记录下来,并且!这个速度是要与我们的坐标点arraylist一一对应的,这样子我们才可以在之后画出我们想要的字。

android 为我们提供了 VelocityTracker 用来记录速度

我们只需要在滑动的时候调用VelocityTracker对象就可以记录下我们的速度

	case MotionEvent.ACTION_DOWN:
if (mVelocityTracker == null) {
// Retrieve a new VelocityTracker object to watch the velocity
// of a motion.
mVelocityTracker = VelocityTracker.obtain();
} else {
// Reset the velocity tracker back to its initial state.
mVelocityTracker.clear();
}
// Add a user's movement to the tracker.
mVelocityTracker.addMovement(event);
path.moveTo(event.getX(), event.getY());
draw();
break;

case MotionEvent.ACTION_MOVE:
mVelocityTracker.addMovement(event);
mVelocityTracker.computeCurrentVelocity(1000);
double speed = getSpeed(
VelocityTrackerCompat.getYVelocity(mVelocityTracker,
event.getActionIndex()),
VelocityTrackerCompat.getXVelocity(mVelocityTracker,
event.getActionIndex()));
Point tmpPoint = new Point(); tmpPoint.set((int) event.getX(), (int) event.getY()); pointStack.add(tmpPoint);
strokeStack.add((float) (speed / 200));
draw();
break;
大家一定好奇,draw()方法是什么东西呢

draw方法就用刷新surfaceview的方法

注意,我们在这里定义了refreshArea可以让我们只更新手指附近的区域,可以让我们的ui刷新快很多!

我们使用path的qualTo方法,通过手指划过的三点(首末两点+中间的控制点)画出多条贝塞尔曲线,而没有一条path的strokeWidth则是由对应的速度决定的

public void draw() {
		refreshArea = new Rect(drawing_point_end.x - Scale, drawing_point_end.y
				- Scale, drawing_point_end.x + Scale, drawing_point_end.y
				+ Scale);
		Canvas canvas = getHolder().lockCanvas(refreshArea);
		canvas.drawColor(Color.WHITE);
		for (int i = 2; i < pointStack.size(); i++) {
			Path path = new Path();
			drawing_point_start = pointStack.get(i - 2);
			drawing_point_middle = pointStack.get(i - 1);
			path.moveTo(drawing_point_start.x, drawing_point_start.y);
			if (strokeStack.get(i) > 25) {
				p.setStrokeWidth(25);
			} else {
				p.setStrokeWidth(strokeStack.get(i));
			}
			drawing_point_end = pointStack.get(i);
			path.quadTo(drawing_point_middle.x, drawing_point_middle.y,
					drawing_point_end.x, drawing_point_end.y);
			canvas.drawPath(path, p);
		}

		getHolder().unlockCanvasAndPost(canvas);
	}
这样画出来就像手写笔一样啦

这个功能我只是想出了原型,后续工作交给别的同事了

大家也在这基础上好好发挥吧
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: