Android简易涂鸦板

一、概述

      这次要做一个简单的涂鸦板应用，以前在Qt上实现过，突然想到要把它在Android上实现，呵呵，既简单又有趣。

 

二、实现

     新建工程MyWall，修改/res/layout/main.xml文件，在里面添加一个SurfaceView和两个Button，用到了RelativeLayout布局，完整的main.xml文件如下：

<?xml version="1.0" encoding="utf-8"?>
 
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:orientation="vertical"
     >
     
     <SurfaceView 
         android:id="@+id/surfaceview"
         android:layout_width="fill_parent"
         android:layout_height="wrap_content"
         android:layout_above="@+id/line"
         android:layout_alignParentTop="true"
         />
     
     <LinearLayout 
         android:id="@+id/line"
         android:layout_width="fill_parent"
         android:layout_height="wrap_content"
         android:layout_alignParentBottom="true"
         >
     
         <Button 
             android:id="@+id/flushbutton"
             android:layout_width="fill_parent"
             android:layout_height="wrap_content"          
             android:layout_weight="1"
             android:text="清屏"
             />
     
         <Button 
             android:id="@+id/colorbutton"
             android:layout_width="fill_parent"
             android:layout_height="wrap_content"
             android:layout_weight="1"     
             android:text="颜色"
             />
     </LinearLayout>
 </RelativeLayout>

接着，修改MyWallActivity.java文件，最主要是覆写了onTouchEvent（）函数，在这个函数里过滤出触屏拖动事件，然后获取其相应的坐标和画线，关于SurfaceView的用法在基础篇里有讲到。完整的内容如下：

package com.nan.wall;
 
 import android.app.Activity;
 import android.app.AlertDialog;
 import android.app.Dialog;
 import android.content.DialogInterface;
 import android.graphics.Canvas;
 import android.graphics.Color;
 import android.graphics.Paint;
 import android.graphics.Rect;
 import android.os.Bundle;
 import android.view.MotionEvent;
 import android.view.SurfaceHolder;
 import android.view.SurfaceView;
 import android.view.View;
 import android.widget.Button;
 
 public class MyWallActivity extends Activity 
 {
     private SurfaceView mSurfaceView = null;
     private SurfaceHolder mSurfaceHolder = null;
     private Button cleanButton = null;
     private Button colorButton = null;
     
     private float oldX = 0f;
     private float oldY = 0f;
     
     private boolean canDraw = false;
     private Paint mPaint = null;
     //用来记录当前是哪一种颜色
     private int whichColor = 0;
     
     /** Called when the activity is first created. */
     @Override
     public void onCreate(Bundle savedInstanceState) 
     {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.main);
         
         mSurfaceView = (SurfaceView)this.findViewById(R.id.surfaceview);
         mSurfaceHolder = mSurfaceView.getHolder();
         
         mPaint = new Paint();
         //画笔的颜色
         mPaint.setColor(Color.RED);
         //画笔的粗细
         mPaint.setStrokeWidth(2.0f);
         
         cleanButton = (Button)this.findViewById(R.id.flushbutton);
         //按钮监听
         cleanButton.setOnClickListener(new View.OnClickListener() 
         {
             
             @Override
             public void onClick(View v) 
             {
                 // TODO Auto-generated method stub
                 //锁定整个SurfaceView
                 Canvas mCanvas = mSurfaceHolder.lockCanvas();
                 mCanvas.drawColor(Color.BLACK);
                 //绘制完成，提交修改
                 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
                 //重新锁一次
                 mSurfaceHolder.lockCanvas(new Rect(0, 0, 0, 0));
                 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
             }
         });    
         
         colorButton = (Button)this.findViewById(R.id.colorbutton);
         //按钮监听
         colorButton.setOnClickListener(new View.OnClickListener() 
         {
             
             @Override
             public void onClick(View v) 
             {
                 // TODO Auto-generated method stub
                 Dialog mDialog = new AlertDialog.Builder(MyWallActivity.this)
                 .setTitle("颜色设置")
                 .setSingleChoiceItems(new String[]{"红色","绿色","蓝色"}, whichColor, new DialogInterface.OnClickListener() 
                 {
                     
                     @Override
                     public void onClick(DialogInterface dialog, int which) 
                     {
                         // TODO Auto-generated method stub
                         switch(which)
                         {
                             case 0:
                             {
                                 //画笔的颜色
                                 mPaint.setColor(Color.RED);
                                 whichColor = 0;
                                 break;
                             }
                             case 1:
                             {
                                 //画笔的颜色
                                 mPaint.setColor(Color.GREEN);
                                 whichColor = 1;
                                 break;
                             }
                             case 2:
                             {
                                 //画笔的颜色
                                 mPaint.setColor(Color.BLUE);
                                 whichColor = 2;
                                 break;
                             }
                         }
                     }
                 })
                 .setPositiveButton("确定", new DialogInterface.OnClickListener() 
                 {
                     
                     @Override
                     public void onClick(DialogInterface dialog, int which) 
                     {
                         // TODO Auto-generated method stub
                         dialog.dismiss();
                     }
                 })
                 .create();
                 mDialog.show();
             }
         });
                   
     }
     
     
     @Override
     public boolean onTouchEvent(MotionEvent event)
     {       
         //获取x坐标
         float x = event.getX();
         //获取y坐标（不知道为什么要减去一个偏移值才对得准屏幕）
         float y = event.getY()-50;
     
         //第一次进来先不管
         if(canDraw)
         {     
             //获取触屏事件
             switch(event.getAction())
             {
                 //如果是拖动事件
                 case MotionEvent.ACTION_MOVE:
                 {
                 
                     //锁定整个SurfaceView
                     Canvas mCanvas = mSurfaceHolder.lockCanvas();    
                     mCanvas.drawLine(x, y, oldX, oldY, mPaint);
                     mSurfaceHolder.unlockCanvasAndPost(mCanvas);
                     //重新锁一次
                     mSurfaceHolder.lockCanvas(new Rect(0, 0, 0, 0));
                     mSurfaceHolder.unlockCanvasAndPost(mCanvas);
                     break;
                 }
             }
         
         }
         //保存目前的x坐标值
         oldX = x;
         //保存目前的y坐标值
         oldY = y;
         
         canDraw = true;
         
         return true;
     }
     
 }

好了，在模拟器上运行效果如下：

 

在真机上运行效果如下：

 

呵呵，写得比较丑。

在获取了Y坐标后减去一个偏移值50，这个值是我直接猜出来的，没想到在模拟器和真机上定位得还蛮准的，哈哈。当然这个应用的功能不多，不过有兴趣的话可以再完善它，希望能起到抛砖引玉的作用。

源地址：http://www.cnblogs.com/lknlfy/archive/2012/03/03/2378328.html