SurfaceView的一個小應用：開發示波器

SurfaceView與普通View還有一個重要區別：View的繪圖必須在UI線程中進行，但SurfaceView不存在這個問題，因為它是由SurfaceHolder來完成的。所以對於View組件，如果繪圖時間過長，會阻塞UI主線程，而SurfaceHolder則會啟動新的線程去更新SurfaceView的繪製，不會阻塞UI線程。

下面的程式是通過SurfaceView繪製正玄曲線和餘玄曲線的樣本，代碼如下：

Activity：

 

package com.home.showwave;import java.util.Timer;import java.util.TimerTask;import android.app.Activity;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Rect;import android.os.Bundle;import android.view.SurfaceHolder;import android.view.SurfaceHolder.Callback;import android.view.SurfaceView;import android.view.View;public class ShowWaveActivity extends Activity {private SurfaceHolder holder;private SurfaceView surface;private Paint paint;private final int HEIGHT = 320;// 要繪製的曲線的水平寬度private final int WIDTH = 500;// 離螢幕左邊界的起始距離private final int X_OFFSET = 5;// 初始化X座標private int cx = X_OFFSET;// 實際的Y軸的位置private int centerY = HEIGHT / 2;private Timer timer = new Timer();private TimerTask task = null;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_show_wave);// 獲得SurfaceView對象surface = (SurfaceView) findViewById(R.id.activity_show_wave_sv);// 初始化SurfaceHolder對象holder = surface.getHolder();paint = new Paint();paint.setColor(Color.GREEN);paint.setStrokeWidth(3);}public void click(final View v) {drawBackGround(holder);cx = X_OFFSET;if (task != null) {task.cancel();}task = new TimerTask() {@Overridepublic void run() {// 根據是正玄還是餘玄和X座標確定Y座標int cy = v.getId() == R.id.activity_show_wave_btn_sin ? centerY- (int) (100 * Math.sin((cx - 5) * 2 * Math.PI / 150)): centerY- (int) (100 * Math.cos((cx - 5) * 2 * Math.PI/ 150));Canvas canvas = holder.lockCanvas(new Rect(cx, cy - 2, cx + 2,cy + 2));// 根據Ｘ，Ｙ座標畫點canvas.drawPoint(cx, cy, paint);cx++;// 超過指定寬度，線程取消，停止畫曲線if (cx > WIDTH) {task.cancel();task = null;}// 提交修改holder.unlockCanvasAndPost(canvas);}};timer.schedule(task, 0, 30);holder.addCallback(new Callback() {@Overridepublic void surfaceChanged(SurfaceHolder holder, int format,int width, int height) {drawBackGround(holder);}@Overridepublic void surfaceCreated(SurfaceHolder holder) {}@Overridepublic void surfaceDestroyed(SurfaceHolder holder) {timer.cancel();}});}private void drawBackGround(SurfaceHolder holder) {Canvas canvas = holder.lockCanvas();// 繪製白色背景canvas.drawColor(Color.WHITE);Paint p = new Paint();p.setColor(Color.BLACK);p.setStrokeWidth(2);// 繪製座標軸canvas.drawLine(X_OFFSET, centerY, WIDTH, centerY, p);canvas.drawLine(X_OFFSET, 40, X_OFFSET, HEIGHT, p);holder.unlockCanvasAndPost(canvas);holder.lockCanvas(new Rect(0, 0, 0, 0));holder.unlockCanvasAndPost(canvas);}}

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:gravity="center_horizontal"        android:orientation="horizontal" >        <Button            android:id="@+id/activity_show_wave_btn_sin"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:onClick="click"            android:text="正玄曲線" />        <Button            android:id="@+id/activity_show_wave_btn_cos"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:onClick="click"            android:text="餘玄曲線" />    </LinearLayout>    <SurfaceView        android:id="@+id/activity_show_wave_sv"        android:layout_width="match_parent"        android:layout_height="match_parent" /></LinearLayout>