canvas繪圖

這個範例是最基本的繪圖展示,其功能為繪出物件以及線條,並改變物件方向,當按下draw按鈕就會顯示縮小並朝右旋轉90度的公仔以及一條斜線。
canvasDemo.JPG
圖2-2
以下為Canvas繪圖的程式碼:
專案下載:canvasDemo.rar
主程式: canvasDemo.java

package ccc.canvasDemo;
 
import android.app.Activity;
// 引用繪圖會用到的函式庫與按鈕
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.View;
import android.widget.Button;
 
public class canvasDemo extends Activity {
    // 畫布
    SurfaceView SurfaceView01;
 
    // 繪圖Holder
    SurfaceHolder surfaceHolder;
 
    // 圖片物件
    Drawable drawable;
 
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
 
        // 取得本機圖片
        drawable = getResources().getDrawable(R.drawable.android);
 
        // 畫出向右轉90度的圖片
        Button button01 = (Button) findViewById(R.id.Button01);
        button01.setOnClickListener(new View.OnClickListener() {
            public void onClick(View arg0) {
                draw(drawAction.drawAndroid);
            }
        });
 
        // 清除畫面的按鈕
        Button button02 = (Button) findViewById(R.id.Button02);
        button02.setOnClickListener(new View.OnClickListener() {
            public void onClick(View arg0) {
                draw(drawAction.clear);
            }
        });
 
        // 關閉程式的按鈕
        Button button03 = (Button) findViewById(R.id.Button03);
        button03.setOnClickListener(new View.OnClickListener() {
            public void onClick(View arg0) {
                finish();
            }
        });
 
        // 取得畫布
        SurfaceView01 = (SurfaceView) findViewById(R.id.SurfaceView01);
 
        // 取得Holder
        surfaceHolder = SurfaceView01.getHolder();
 
        // Holder方法
        surfaceHolder.addCallback(new SurfaceHolder.Callback() {
 
            public void surfaceDestroyed(SurfaceHolder arg0) {
 
            }
 
            // 當畫布被創造的時候先畫一次
            public void surfaceCreated(SurfaceHolder arg0) {
                draw(drawAction.create);
            }
 
            public void surfaceChanged(SurfaceHolder arg0, int arg1, int arg2,
                    int arg3) {
 
            }
        });
    }
 
    @Override
    protected void onResume() {
        super.onResume();
 
    }
 
    // 列舉狀態
    enum drawAction {
        create, drawAndroid, clear,
    }
 
    // 更新畫面
    void draw(drawAction action) {
        Canvas canvas = null;
 
        try {
            // 鎖定
            canvas = surfaceHolder.lockCanvas(null);
 
            synchronized (surfaceHolder) {
                // 依照目前的狀態做不同的繪圖
                switch (action) {
                    // 在程式一開始的時候畫
                    case create:
                        start(canvas);
                        break;
 
                    // 畫出右向轉90度的圖片
                    case drawAndroid:
                        drawAndroid(canvas);
                        break;
 
                    // 清除畫面
                    case clear:
                        clear(canvas);
                        break;
                }
            }
        } finally {
            if (canvas != null) {
                // 解除鎖定
                surfaceHolder.unlockCanvasAndPost(canvas);
            }
        }
    }
 
    // 畫出向右轉90度的圖片
    void drawAndroid(Canvas canvas) {
        Paint p = new Paint();
        p.setARGB(150, 88, 88, 88);
        canvas.drawLine(0, 0, 128, 128, p);
        canvas.save();
        drawable.setBounds(64, 64, 128, 128);
        float angle = 90;
        canvas.rotate(angle, drawable.getBounds().centerX(), drawable
                .getBounds().centerY());
        drawable.draw(canvas);
        canvas.restore();
    }
 
    // 畫出一開始的圖片
    void start(Canvas canvas) {
        drawable.setBounds(0, 0, 128, 128);
        drawable.draw(canvas);
    }
 
    // 清除畫面
    void clear(Canvas canvas) {
        Paint p = new Paint();
        p.setARGB(255, 0, 0, 0);
        Rect rect = new Rect(0, 0, SurfaceView01.getWidth(), SurfaceView01
                .getHeight());
        canvas.drawRect(rect, p);
    }
}

Activity介面程式碼

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<LinearLayout android:id="@+id/LinearLayout01" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal">
<Button android:text="draw" android:id="@+id/Button01" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
<Button android:text="clear" android:id="@+id/Button02" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
<Button android:text="Exit" android:id="@+id/Button03" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
</LinearLayout><SurfaceView android:id="@+id/SurfaceView01" android:layout_width="wrap_content" android:layout_height="wrap_content">
</SurfaceView>
</LinearLayout>

程式影片解說