HardBirch

【Android应用实例之二】跟随手指的小球——自定义View应用

时间:11-09-27 栏目:iOS移动应用开发技术 作者:张飞不张,文采横飞 评论:1 点击: 1,447 次

实现的功能:手指在屏幕上滑动,变幻颜色的小球始终跟随手指移动。

实现的思路:1)自定义View,在onDraw中画圆作为小球;2)重写自定义View的onTouchEvent方法,记录触屏坐标,用新的坐标重新绘制小球。

关键技术点:自定义View应用、触摸事件处理、canvas绘图、Paint应用

第一步:新建一个工程,命名为BallViewDemo,Activity命名为BallActivity。

第二步:编写自定义View类BallView,本例中将BallView作为BallActivity的内部类,BallActivity代码如下:

 

package com.zyg.customview.ball;

import java.util.Random;

import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Bundle;
import android.view.Display;
import android.view.MotionEvent;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;

public class BallActivity extends Activity {
	private int screenW;		//屏幕宽度
	private int screenH;		//屏幕高度
    @Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		Display dis = this.getWindowManager().getDefaultDisplay();
		// 设置全屏
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
				WindowManager.LayoutParams.FLAG_FULLSCREEN);
		// 获取屏幕宽度
		screenW = dis.getWidth();
		// 获取屏幕高度
		screenH = dis.getHeight();

		setContentView(new BallView(this));
	}

    //自定义绘图类
    class BallView extends View{
    	private Paint paint; 		//定义画笔
    	private float cx = 50;		//圆点默认X坐标
    	private float cy = 50;		//圆点默认Y坐标
    	private int radius = 20;
    	//定义颜色数组
    	private int colorArray[] = {Color.BLACK,Color.BLACK,Color.GREEN,Color.YELLOW, Color.RED};
    	private int paintColor = colorArray[0]; //定义画笔默认颜色

    	public BallView(Context context) {
    		super(context);
    		//初始化画笔
    		initPaint();
    	}
    	private void initPaint(){
    		paint = new Paint();
    		//设置消除锯齿
    		paint.setAntiAlias(true);
    		//设置画笔颜色
    		paint.setColor(paintColor);
    	}

    	//重写onDraw方法实现绘图操作
    	@Override
    	protected void onDraw(Canvas canvas) {
    		super.onDraw(canvas);
    		//将屏幕设置为白色
    		canvas.drawColor(Color.WHITE);
    		//修正圆点坐标
    		revise();
    		//随机设置画笔颜色
    		setPaintRandomColor();
    		//绘制小圆作为小球
    		canvas.drawCircle(cx, cy, radius, paint);
    	}

    	//为画笔设置随机颜色
    	private void setPaintRandomColor(){
    		Random rand = new Random();
    		int randomIndex = rand.nextInt(colorArray.length);
    		paint.setColor(colorArray[randomIndex]);
    	}

    	//修正圆点坐标
    	private void revise(){
    		if(cx <= radius){
    			cx = radius;
    		}else if(cx >= (screenW-radius)){
    			cx = screenW-radius;
    		}
    		if(cy <= radius){
    			cy = radius;
    		}else if(cy >= (screenH-radius)){
    			cy = screenH-radius;
    		}
    	}

    	@Override
		public boolean onTouchEvent(MotionEvent event) {
			switch (event.getAction()) {
			case MotionEvent.ACTION_DOWN:
				// 按下
				cx = (int) event.getX();
				cy = (int) event.getY();
				// 通知重绘
				postInvalidate();	//该方法会调用onDraw方法,重新绘图
				break;
			case MotionEvent.ACTION_MOVE:
				// 移动
				cx = (int) event.getX();
				cy = (int) event.getY();
				// 通知重绘
				postInvalidate();
				break;
			case MotionEvent.ACTION_UP:
				// 抬起
				cx = (int) event.getX();
				cy = (int) event.getY();
				// 通知重绘
				postInvalidate();
				break;
			}

			/*
			 * 备注1:此处一定要将return super.onTouchEvent(event)修改为return true,原因是:
			 * 1)父类的onTouchEvent(event)方法可能没有做任何处理,但是返回了false。
			 * 2)一旦返回false,在该方法中再也不会收到MotionEvent.ACTION_MOVE及MotionEvent.ACTION_UP事件。
			 */
			//return super.onTouchEvent(event);
			return true;
		}
    }
}

main.xml与AndroidManifest.xml未作修改,不再贴出~

备注:代码中的备注1介绍了onTouchEvent方法在实际开发中的一个Bug的解决方法,详见代码。

第三步:运行程序,效果如下:

下一篇将用自定义SurfaceView代替自定义View实现该实例功能,并总结一下自定义View与自定义SurfaceView区别与应用场景。

【Android应用实例之二】跟随手指的小球——自定义View应用:目前有1 条留言

  1. 沙发
    hxwal:

    很好,正在学习,谢谢分享

    2011-09-28 10:35 [回复]

发表评论


QQ群互动

Linux系统与内核学习群:194051772

WP建站技术学习交流群:194062106

魔豆之路QR

魔豆的Linux内核之路

魔豆的Linux内核之路

优秀工程师当看优秀书籍

优秀程序员,要看优秀书!

赞助商广告

友荐云推荐