1. 程式人生 > >初學Android,圖形影象之使用雙緩衝畫圖(二十七)

初學Android,圖形影象之使用雙緩衝畫圖(二十七)

 當資料量很大時,繪圖可能需要幾秒鐘甚至更長的時間,而且有時還會出現閃爍現象,為了解決這些問題,可採用雙緩衝技術來繪圖。
 雙緩衝即在記憶體中建立一個與螢幕繪圖區域一致的物件,先將圖形繪製到記憶體中的這個物件上,再一次性將這個物件上的圖形拷貝到螢幕上,這樣能大大加快繪圖的速度。雙緩衝實現過程如下:
  1、在記憶體中建立與畫布一致的緩衝區
  2、在緩衝區畫圖
  3、將緩衝區點陣圖拷貝到當前畫布上

  4、釋放記憶體緩衝區

下面的例子(一個畫圖板)將實現雙緩衝畫圖

先自定義一個View(Bitmap將會繪製到這個View上)

package Wangli.Graphics.HandDraw;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

public class DrawView extends View {
    float preX;
    float preY;
    private Path path;
    public Paint paint = null;
    final int VIEW_WIDTH = 320;
    final int VIEW_HEIGHT = 480;
    //定義一個記憶體中的圖片,該圖片將作為緩衝區
    Bitmap cacheBitmap = null;
    //定義cacheBitmap上的canvas物件
    Canvas cacheCanvas = null;
	public DrawView(Context context, AttributeSet attrs) {
		super(context, attrs);
		//建立一個與該View相同大小的快取區
		cacheBitmap = Bitmap.createBitmap(VIEW_WIDTH,VIEW_HEIGHT,Config.ARGB_8888);
		cacheCanvas = new Canvas();
		path = new Path();
		//設定cacheCanvas將會繪製到記憶體中的cacheBitmap上
		cacheCanvas.setBitmap(cacheBitmap);
		//設定畫筆的顏色
		paint = new Paint(Paint.DITHER_FLAG);
		paint.setColor(Color.RED);
		//設定畫筆的風格
		paint.setStyle(Paint.Style.STROKE);
		paint.setStrokeWidth(1);
		//反鋸齒
		paint.setAntiAlias(true);
		paint.setDither(true);
	}
    public boolean onTouchEvent(MotionEvent event)
    {
    	//獲取拖動事件發生的位置
    	float x = event.getX();
    	float y = event.getY();
    	switch(event.getAction())
    	{
    	    case MotionEvent.ACTION_DOWN:
    		     path.moveTo(x, y);
    		     preX = x;
    		     preY = y;
    		     break;
    	    case MotionEvent.ACTION_MOVE:
   		         path.quadTo(preX, preY, x, y);
   		         preX = x;
   		         preY = y;
   		         break;
    	    case MotionEvent.ACTION_UP:
    	    	 cacheCanvas.drawPath(path, paint);
    	    	 path.reset();
    	    	 break;
    	}
    	invalidate();
    	//返回true表明處理方法已經處理該事件
    	return true;
    }
    public void onDraw(Canvas canvas)
    {
    	Paint bmpPaint = new Paint();
    	//將cacheBitmap繪製到該View元件上
    	canvas.drawBitmap(cacheBitmap, 0, 0, bmpPaint);
    	//沿著path繪製
    	canvas.drawPath(path, paint);
    }
}
定義選單資原始檔my_menu
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
	<item android:title="@string/color">
		<menu>
			<!-- 定義一組單選選單項 -->
			<group android:checkableBehavior="single">
				<!-- 定義多個選單項 -->
				<item
					android:id="@+id/red" android:title="@string/color_red"/>
				<item
					android:id="@+id/green" android:title="@string/color_green"/>
				<item
					android:id="@+id/blue" android:title="@string/color_blue"/>
			</group>
		</menu>
	</item>
	<item android:title="@string/width">
		<menu>
			<!-- 定義一組選單項 -->
			<group>
				<!-- 定義3個選單項 -->
				<item
					android:id="@+id/width_1" android:title="@string/width_1"/>
				<item
					android:id="@+id/width_3" android:title="@string/width_3"/>
				<item
					android:id="@+id/width_5" android:title="@string/width_5"/>						
			</group>
		</menu>
	</item>
	<item
		android:id="@+id/blur" android:title="@string/blur"/>	
	<item
		android:id="@+id/emboss" android:title="@string/emboss"/>							
</menu>
strings.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string name="hello">Hello World, HandDraw!</string> 
  <string name="app_name">手繪</string> 
  <string name="width_1">1畫素</string> 
  <string name="width_3">3畫素</string> 
  <string name="width_5">5畫素</string> 
  <string name="color_red">紅色</string> 
  <string name="color_green">綠色</string> 
  <string name="color_blue">藍色</string> 
  <string name="color">畫筆顏色</string> 
  <string name="width">畫筆寬度</string> 
  <string name="blur">模糊效果</string> 
  <string name="emboss">浮雕效果</string> 
</resources>
主介面處理選單事件 
package Wangli.Graphics.HandDraw;

import android.app.Activity;
import android.graphics.BlurMaskFilter;
import android.graphics.Color;
import android.graphics.EmbossMaskFilter;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;

public class HandDraw extends Activity {
    /** Called when the activity is first created. */
	EmbossMaskFilter emboss;
	BlurMaskFilter blur;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        emboss = new EmbossMaskFilter(new float[]{1.5f,1.5f,1.5f},0.6f,6,4.2f);
        blur = new BlurMaskFilter(8,BlurMaskFilter.Blur.NORMAL);
    }
    //負責建立選項選單
    public boolean onCreateOptionsMenu(Menu menu)
    {
    	MenuInflater inflator = new MenuInflater(this);
    	//狀態R.menu.context對應選單,並新增到中
    	inflator.inflate(R.menu.my_menu,menu);
    	return super.onCreateOptionsMenu(menu);
    }
    //選單項被單擊後的回撥方法
    public boolean onOptionsItemSelected(MenuItem mi)
    {
    	DrawView dv = (DrawView)findViewById(R.id.draw);
    	//判斷單擊的是哪個選單項,並有針對性地做出響應
    	switch(mi.getItemId())
    	{
    	    case R.id.red:
    	    	dv.paint.setColor(Color.RED);
    	    	mi.setChecked(true);
    	    	break;
    	    case R.id.green:
    	    	dv.paint.setColor(Color.GREEN);
    	    	mi.setChecked(true);
    	    	break;
    	    case R.id.blue:
    	    	dv.paint.setColor(Color.BLUE);
    	    	mi.setChecked(true);
    	    	break;
    	    case R.id.width_1:
    	    	dv.paint.setStrokeWidth(1);
    	    	mi.setChecked(true);
    	    	break;
    	    case R.id.width_3:
    	    	dv.paint.setStrokeWidth(3);
    	    	mi.setChecked(true);
    	    	break;
    	    case R.id.width_5:
    	    	dv.paint.setStrokeWidth(5);
    	    	mi.setChecked(true);
    	    	break;
    	    case R.id.blur:
    	    	dv.paint.setMaskFilter(blur);
    	    	mi.setChecked(true);
    	    	break;
    	    case R.id.emboss:
    	    	dv.paint.setMaskFilter(emboss);
    	    	mi.setChecked(true);
    	    	break;
    	}
    	return true;
    }
}
下面是實現效果



更改畫筆效果