Android ApiDemos示例解析(55):Graphics->BitmapMesh

Canvas的drawBitmapMesh定義如下:

public void drawBitmapMesh(Bitmap bitmap, int meshWidth, int meshHeight, float[] verts, int vertOffset, int[] colors, int colorOffset, Paint paint)

表示將圖像繪制在網格上,說得通俗一些,可以將畫板想像成一張格子佈,在這張佈上繪制圖像。對於一個網格端點均勻分佈的網格來說,橫向有meshWidth+1個頂點,縱向有meshHeight+1個端點。 頂點數組verts 是以行優先的數組 (二維數組以一維數組表示,先行後列)。網格可以不均勻分佈,參數定義如下:

bitmap: 需要繪制在網格上的圖像。
meshWidth: 網格的寬度方向的數目(列數),為0時不繪制圖像。
meshHeight:網格的高度方向的數目(含數),為0時不繪制圖像。
verts: (x,y)對的數組,表示網格頂點的坐標,至少需要有(meshWidth+1) * (meshHeight+1) * 2 + meshOffset 個(x,y)坐標。
vertOffset: verts數組中開始跳過的(x,y)對的數目。
Colors: 可以為空,不為空為沒個頂點定義對應的顏色值,至少需要有(meshWidth+1) * (meshHeight+1) * 2 + meshOffset 個(x,y)坐標。
colorOffset: colors數組中開始跳過的(x,y)對的數目。
paint: 可以為空。
為瞭更好的說明一下“Mesh”的概念,我們稍微修改一下代碼,在圖像上面加上綠色的網格(如果瞭解OpenGL的話,這裡Mesh和3D繪圖的Mesh的概念類似)。drawImageWithGrid 在圖像上面繪制網格。

[java] 
Bitmap mBitmap1 = BitmapFactory.decodeResource(getResources(), 
 R.drawable.beach); 
  
mBitmap=Bitmap.createBitmap(mBitmap1.getWidth(), 
 mBitmap1.getHeight(), Bitmap.Config.ARGB_8888); 
drawImageWithGrid(mBitmap1); 
  
 … 
private void drawImageWithGrid(Bitmap image){ 
 Canvas canvas=new Canvas(mBitmap); 
 float w = mBitmap.getWidth(); 
 float h = mBitmap.getHeight(); 
 int xCount=(int)w/WIDTH; 
 int yCount=(int)h/HEIGHT; 
 Paint paint=new Paint(); 
 canvas.drawBitmap(image, 0, 0, paint); 
 paint.setStyle(Paint.Style.STROKE); 
 paint.setStrokeWidth(1); 
 paint.setColor(0x8000FF00); 
 for(int i=0;i<xCount;i++){ 
 for(int j=0;j<yCount;j++){ 
 canvas.drawRect(i*WIDTH, j*HEIGHT, 
 i*WIDTH+WIDTH, j*HEIGHT+HEIGHT, paint); 
 } 
 } 

Bitmap mBitmap1 = BitmapFactory.decodeResource(getResources(),
 R.drawable.beach);
 
mBitmap=Bitmap.createBitmap(mBitmap1.getWidth(),
 mBitmap1.getHeight(), Bitmap.Config.ARGB_8888);
drawImageWithGrid(mBitmap1);   www.aiwalls.com
 
 …
private void drawImageWithGrid(Bitmap image){
 Canvas canvas=new Canvas(mBitmap);
 float w = mBitmap.getWidth();
 float h = mBitmap.getHeight();
 int xCount=(int)w/WIDTH;
 int yCount=(int)h/HEIGHT;
 Paint paint=new Paint();
 canvas.drawBitmap(image, 0, 0, paint);
 paint.setStyle(Paint.Style.STROKE);
 paint.setStrokeWidth(1);
 paint.setColor(0x8000FF00);
 for(int i=0;i<xCount;i++){
 for(int j=0;j<yCount;j++){
 canvas.drawRect(i*WIDTH, j*HEIGHT,
 i*WIDTH+WIDTH, j*HEIGHT+HEIGHT, paint);
 }
 }
}
通過調整網格的坐標,可以對圖像進行變化,本例實現的效果,但在圖像上點擊時,就像用手指在一塊畫佈上壓下少許(佈是軟的)。例子的warp方法實現翹曲畫佈的算法(變換Mesh的頂點坐標,具體算法不用深究)。

 

 

作者:mapdigit
 

發佈留言