Android畫圖工具的製作

Android 項目中使用到畫圖工具，本文記載如何實現，需詳細瞭解cavas和surfaceviw

1 三星pad

三星pad自帶的手寫筆可以很好的支持畫圖，集成三星的sdk

以上三星官方提供的庫文件，主要代碼如下

    private SpenNoteDoc mSpenNoteDoc;
    private SpenPageDoc mSpenPageDoc;
    private SpenSurfaceView mSpenSurfaceView;

    final FrameLayout spenViewLayout = (FrameLayout) mainView.findViewById(R.id.spenViewLayout);
        mSpenSurfaceView = new SpenSurfaceView(getActivity());
        if (mSpenSurfaceView == null) {
            Toast.makeText(getActivity(), "Cannot create new SpenView.", Toast.LENGTH_SHORT).show();
        }
        spenViewLayout.addView(mSpenSurfaceView,0);
        ViewTreeObserver vto = spenViewLayout.getViewTreeObserver();
        vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                spenViewLayout.getViewTreeObserver().removeGlobalOnLayoutListener(this);
                try {
                    mSpenNoteDoc = new SpenNoteDoc(getActivity(), spenViewLayout.getWidth(), spenViewLayout.getHeight());
                } catch (IOException e) {
                    e.printStackTrace();
                }
                mSpenPageDoc = mSpenNoteDoc.appendPage();
                mSpenPageDoc.setBackgroundColor(0xFFf0f0f0);
                mSpenPageDoc.clearHistory();
                mSpenSurfaceView.setPageDoc(mSpenPageDoc, true);
                mSpenSurfaceView.setBlankColor(getResources().getColor(android.R.color.white));
                mSpenSurfaceView.setToolTypeAction(mFINGERToolType, SpenSurfaceView.ACTION_STROKE);
                mSpenSurfaceView.setToolTypeAction(mSPENToolType, SpenSurfaceView.ACTION_STROKE);
                SpenSettingPenInfo penInfo = new SpenSettingPenInfo();
                penInfo.color = Color.RED;
                penInfo.size = (int) MyApplication.getAppContext().getResources().getDimension(R.dimen.mBrushSize_red);
                mSpenSurfaceView.setPenSettingInfo(penInfo);
            }
        });

清空區域

mSpenPageDoc = mSpenNoteDoc.appendPage();
            mSpenPageDoc.setBackgroundColor(0xFFf0f0f0);
            mSpenSurfaceView.setPageDoc(mSpenPageDoc, true);
            SpenObjectTextBox.setInitialCursorPos(SpenObjectTextBox.CURSOR_POS_END);

加載圖片

    mSpenPageDoc.setBackgroundImage(filepath);

    mSpenSurfaceView.update();
    mSpenNoteDoc.removePage(0);

三星書寫流暢，體驗很好。

2 自定義畫筆

自定義畫筆採用封裝SurfaceView

http://www.cnblogs.com/xuling/archive/2011/06/06/android.html

這個例子很好的的解釋了 surfaceview

public class PainterCanvas extends SurfaceView implements Callback{

  public PainterCanvas(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.mcontext = context;
        SurfaceHolder holder = getHolder();
        holder.addCallback(this);
        setFocusable(true);
        Log.e("xx", "PainterCanvas");
    }

public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
        if (mBitmap == null) {
            Log.e("xx", "surfaceChanged1");
            mBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
            bgBitmap = Bitmap.createBitmap(mBitmap);//背景圖
            bgBitmap.eraseColor(Color.WHITE);
            mCanvas = new Canvas(bgBitmap);
            getThread().setBitmap(mBitmap, true);
            getThread().drawBitmap(bgBitmap,true);
        } else {
            Log.e("xx", "surfaceChanged2");
            getThread().setBitmap(mBitmap, false);
            getThread().drawBitmap(bgBitmap,false);
        }

public PainterThread getThread() {
        if (mThread == null) {
            mThread = new PainterThread(getHolder());
        }
        return mThread;
    }    }

public void surfaceCreated(SurfaceHolder holder) {
        getThread().on();
        getThread().start();
    }

public void PaintClean() {
        getThread().setBitmap(mBitmap, true);
        getThread().drawBitmap(bgBitmap,true);
    }

public void surfaceDestroyed(SurfaceHolder holder) {
        boolean retry = true;
        getThread().off();
        while (retry) {
            try {
                getThread().join();
                retry = false;
            } catch (InterruptedException e) {

            }
        }

        mThread = null;
    }

public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            //Log.e("xx", "開始。。。。");
            //sb = new StringBuffer();
            getThread().drawBegin();
            break;
        case MotionEvent.ACTION_MOVE:
            //Log.e("xx", "進行中。。。。");
            getThread().draw((int) event.getX(), (int) event.getY());
            break;
        case MotionEvent.ACTION_UP:
        case MotionEvent.ACTION_CANCEL:
            //Log.e("xx", "結束。。。。");
            getThread().drawEnd();
            break;
        }
        return true;
    }

public void drawBitmap(Bitmap bitmap) {
        Matrix matrix = center(bitmap, true, true);
        //Matrix matrix  =new Matrix();
        mCanvas.drawBitmap(bitmap, matrix, null);
        if (bitmap != null && !bitmap.isRecycled()) {
            bitmap.isRecycled();
            bitmap = null;
        }
        //getThread().drawBitmap(bgBitmap,false);
    }

}

PainterThread中主要封裝了一個mCanvas，在onTouchEvent中調用該cavas實現畫筆，

public PainterThread(SurfaceHolder surfaceHolder) {
        mHolder = surfaceHolder;
        mBrushSize = 5;
        mBrush = new Paint();
        mBrush.setAntiAlias(true);
        mBrush.setColor(Color.RED);
        mBrush.setStrokeWidth(mBrushSize);
        mBrush.setStrokeCap(Cap.ROUND);
        // 重置座標點
        mLastBrushPointX = -1;
        mLastBrushPointY = -1;
    }

將surfaceHolder作爲參數傳給PainterCanvas

canvas = mHolder.lockCanvas();
                synchronized (mHolder) {
                    if (canvas != null) {
                        //if (bgBitmap != null) {
                            canvas.drawBitmap(bgBitmap, 0, 0, null);
                        //}
                        canvas.drawBitmap(mBitmap, 0, 0, null);
                    }

                }
            } catch (Exception e) {
                e.printStackTrace();
                Log.e("paiters", "e.printStackTrace()");
            } finally {
                if (canvas != null) {
                    mHolder.unlockCanvasAndPost(canvas);
                }

            }

canvas繪製完成，PainterCanvas刷新顯示。用於在圖片上做批註。