一、概述
這次要做一個簡單的塗鴉板應用，以前在Qt上實現過，突然想到要把它在Android上實現，呵呵，既簡單又有趣。
二、實現
新建工程MyWall，修改/res/layout/main.xml文件，在里面添加一個SurfaceView和兩個Button，用到了RelativeLayout布局，完整的main.xml文件如下：
1 <?xml version="1.0" encoding="utf-8"?>
2
3 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
4 android:layout_width="fill_parent"
5 android:layout_height="fill_parent"
6 android:orientation="vertical"
7 >
8
9 <SurfaceView
10 android:id="@+id/surfaceview"
11 android:layout_width="fill_parent"
12 android:layout_height="wrap_content"
13 android:layout_above="@+id/line"
14 android:layout_alignParentTop="true"
15 />
16
17 <LinearLayout
18 android:id="@+id/line"
19 android:layout_width="fill_parent"
20 android:layout_height="wrap_content"
21 android:layout_alignParentBottom="true"
22 >
23
24 <Button
25 android:id="@+id/flushbutton"
26 android:layout_width="fill_parent"
27 android:layout_height="wrap_content"
28 android:layout_weight="1"
29 android:text="清屏"
30 />
31
32 <Button
33 android:id="@+id/colorbutton"
34 android:layout_width="fill_parent"
35 android:layout_height="wrap_content"
36 android:layout_weight="1"
37 android:text="顏色"
38 />
39 </LinearLayout>
40 </RelativeLayout>
接着，修改MyWallActivity.java文件，最主要是覆寫了onTouchEvent（）函數，在這個函數里過濾出觸屏拖動事件，然后獲取其相應的坐標和畫線，關於SurfaceView的用法在基礎篇里有講到。完整的內容如下：
1 package com.nan.wall;
2
3 import android.app.Activity;
4 import android.app.AlertDialog;
5 import android.app.Dialog;
6 import android.content.DialogInterface;
7 import android.graphics.Canvas;
8 import android.graphics.Color;
9 import android.graphics.Paint;
10 import android.graphics.Rect;
11 import android.os.Bundle;
12 import android.view.MotionEvent;
13 import android.view.SurfaceHolder;
14 import android.view.SurfaceView;
15 import android.view.View;
16 import android.widget.Button;
17
18 public class MyWallActivity extends Activity
19 {
20 private SurfaceView mSurfaceView = null;
21 private SurfaceHolder mSurfaceHolder = null;
22 private Button cleanButton = null;
23 private Button colorButton = null;
24
25 private float oldX = 0f;
26 private float oldY = 0f;
27
28 private boolean canDraw = false;
29 private Paint mPaint = null;
30 //用來記錄當前是哪一種顏色
31 private int whichColor = 0;
32
33 /** Called when the activity is first created. */
34 @Override
35 public void onCreate(Bundle savedInstanceState)
36 {
37 super.onCreate(savedInstanceState);
38 setContentView(R.layout.main);
39
40 mSurfaceView = (SurfaceView)this.findViewById(R.id.surfaceview);
41 mSurfaceHolder = mSurfaceView.getHolder();
42
43 mPaint = new Paint();
44 //畫筆的顏色
45 mPaint.setColor(Color.RED);
46 //畫筆的粗細
47 mPaint.setStrokeWidth(2.0f);
48
49 cleanButton = (Button)this.findViewById(R.id.flushbutton);
50 //按鈕監聽
51 cleanButton.setOnClickListener(new View.OnClickListener()
52 {
53
54 @Override
55 public void onClick(View v)
56 {
57 // TODO Auto-generated method stub
58 //鎖定整個SurfaceView
59 Canvas mCanvas = mSurfaceHolder.lockCanvas();
60 mCanvas.drawColor(Color.BLACK);
61 //繪制完成，提交修改
62 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
63 //重新鎖一次
64 mSurfaceHolder.lockCanvas(new Rect(0, 0, 0, 0));
65 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
66 }
67 });
68
69 colorButton = (Button)this.findViewById(R.id.colorbutton);
70 //按鈕監聽
71 colorButton.setOnClickListener(new View.OnClickListener()
72 {
73
74 @Override
75 public void onClick(View v)
76 {
77 // TODO Auto-generated method stub
78 Dialog mDialog = new AlertDialog.Builder(MyWallActivity.this)
79 .setTitle("顏色設置")
80 .setSingleChoiceItems(new String[]{"紅色","綠色","藍色"}, whichColor, new DialogInterface.OnClickListener()
81 {
82
83 @Override
84 public void onClick(DialogInterface dialog, int which)
85 {
86 // TODO Auto-generated method stub
87 switch(which)
88 {
89 case 0:
90 {
91 //畫筆的顏色
92 mPaint.setColor(Color.RED);
93 whichColor = 0;
94 break;
95 }
96 case 1:
97 {
98 //畫筆的顏色
99 mPaint.setColor(Color.GREEN);
100 whichColor = 1;
101 break;
102 }
103 case 2:
104 {
105 //畫筆的顏色
106 mPaint.setColor(Color.BLUE);
107 whichColor = 2;
108 break;
109 }
110 }
111 }
112 })
113 .setPositiveButton("確定", new DialogInterface.OnClickListener()
114 {
115
116 @Override
117 public void onClick(DialogInterface dialog, int which)
118 {
119 // TODO Auto-generated method stub
120 dialog.dismiss();
121 }
122 })
123 .create();
124 mDialog.show();
125 }
126 });
127
128 }
129
130
131 @Override
132 public boolean onTouchEvent(MotionEvent event)
133 {
134 //獲取x坐標
135 float x = event.getX();
136 //獲取y坐標（不知道為什么要減去一個偏移值才對得准屏幕）
137 float y = event.getY()-50;
138
139 //第一次進來先不管
140 if(canDraw)
141 {
142 //獲取觸屏事件
143 switch(event.getAction())
144 {
145 //如果是拖動事件
146 case MotionEvent.ACTION_MOVE:
147 {
148
149 //鎖定整個SurfaceView
150 Canvas mCanvas = mSurfaceHolder.lockCanvas();
151 mCanvas.drawLine(x, y, oldX, oldY, mPaint);
152 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
153 //重新鎖一次
154 mSurfaceHolder.lockCanvas(new Rect(0, 0, 0, 0));
155 mSurfaceHolder.unlockCanvasAndPost(mCanvas);
156 break;
157 }
158 }
159
160 }
161 //保存目前的x坐標值
162 oldX = x;
163 //保存目前的y坐標值
164 oldY = y;
165
166 canDraw = true;
167
168 return true;
169 }
170
171 }
好了，在模擬器上運行效果如下：
在真機上運行效果如下：
呵呵，寫得比較丑。
在獲取了Y坐標后減去一個偏移值50，這個值是我直接猜出來的，沒想到在模擬器和真機上定位得還蠻准的，哈哈。當然這個應用的功能不多，不過有興趣的話可以再完善它，希望能起到拋磚引玉的作用。