Android 中通过Canvas 与线程结合实现动画效果

前段时间在公司做了一个模块，不使用第三方动画效果类，直接通过Canvas 进行图像的绘制，并通过Thread实现动画的效果

该模块主要是实现车辆运行时候的道路运行效果，在进行实施前做了一个相关的Demo

在Demo中主要实现的是道路的直线行驶的显示，和拐弯时候的图像变化

对于该项目准备分两篇进行描述

这篇就主要内容是针对道路的直线行驶，我的思路是在路中间进行虚线的绘制（虚线可用多个长条形的矩形拼接而成），通过虚线的移动来模拟道路的移动

废话少说上代码(比较早期时候的代码，笔者也懒得规范，请多见谅)

首先建立一个类LineView 继承View

public class LineView extends View {
	private int a = 0;
	private int b = -600;
	private int c = 600;
	private boolean isRun;
	public LineView(Context context){
		super(context);
	}
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		Paint paint1 = new Paint();
		paint1.setColor(Color.BLACK);
		paint1.setStrokeWidth((float) 3.0);
		canvas.drawLine(50, 0, 50, 1300, paint1);
		canvas.drawLine(600, 0, 600, 1300, paint1);
		Paint paint = new Paint();
		paint.setColor(Color.BLACK);
		paint.setStyle(Paint.Style.STROKE);
		
		canvas.drawRect(303, b, 333, b+200, paint);
		canvas.drawRect(303, b+300, 333, b+500, paint);
		canvas.drawRect(303, a, 333, a+200, paint);
		canvas.drawRect(303, a+300, 333, a+500, paint);
		canvas.drawRect(303, c, 333, c+200, paint);
		canvas.drawRect(303, c+300, 333, c+500,paint);
	}
	public void moveView(){
		if(isRun == false ){
			isRun  = true;
		}
		else if(isRun==true){
			isRun = false;
		}
		new Thread(moveThread).start();
	}
	private final Runnable moveThread = new Runnable() {
		
		@Override
		public void run() {
			a = 0;
			b = -600;
			c = 600;
			while(isRun = true){
				a+=5;
				b+=5;
				c+=5;
				if(c>=1200){
					c=-600;
				}
				if(b>=1200){
					b=-600;
				}
				if(a>=1200){
					a = -600;
				}
				try {
					Thread.sleep(30);
				} catch (InterruptedException e) {
					// TODO Auto-generated catch block
					e.printStackTrace();
				}
				postInvalidate();
			}
		}
	};
	
}

部分代码的解释：

其中私有变量表示为第一个矩形的上边的横坐标，b与c分别表示两个最高和最低被隐藏的矩形的横坐标，如右图（有图便于理解）

boolean型参数用于判断该图是否在运动

在重写的onDraw()方法中

创建一个Paint对象用于绘制两旁的道路，并定义其属性，都是比较简单的方法，这里就不逐一介绍了

drawLine()方法中的参数说明

canvas.drawLine(startX, startY, stopX, stopY, paint);

分别表示起始的横坐标，纵坐标，线终止的横纵坐标，并将之前定义好的Paint对象传入到该方法中

同样的，定义一个Paint变量用于绘制矩形

绘制矩形使用drawRect()方法，该方法中的参数说明：

canvas.drawRect(left, top, right, bottom, paint);

分别代表左上右下的坐标，并传入一个Paint对象

线程moveThread的解释：

线程启动后把图像置于默认的位置，并且当状态为true时，开始移动View

即除了两旁的道路，所有的图像都开始向下移动，以模拟开车时道路的效果。

并且这里有个精妙的设计——通过判断语句，辨别矩形是否移动到低端看不见的位置，如果达到该位置，又会将其移动到View的最顶端，就是说通过六个方块的不断移动，形成道路的移动效果。

并且将时间设置为30ms更新一次，并且通过postInvalidate()方法将界面进行刷新。