第六章圖形與圖像處理

第六章圖形與圖像處理管理科學(xué)工程學(xué)院王華杰

ocam@163.com

/basilwang

/basilwang本章要點(diǎn)Android的圖形處理基礎(chǔ)Bitmap與BitmapFactory繼承View實現(xiàn)繪圖掌握Canvas、Paint、Path等繪圖API雙緩沖機(jī)制使用Matrix對圖像進(jìn)行幾何變換通過drawBitmapMesh方法扭曲圖像使用不同的Shader類渲染圖形逐幀動畫和補(bǔ)間動畫SurfaceView本章內(nèi)容一

使用簡單圖片二繪圖三圖形特效處理四逐幀（Frame)動畫五補(bǔ)間（Tween)動畫六SurfaceView的繪圖機(jī)制一使用簡單圖片前面的Android應(yīng)用中已經(jīng)大量使用了簡單圖片，圖片不僅可以使用ImageView來顯示，也可作為Button、Window的背景。從廣義的角度來看，Android應(yīng)用中的圖片不僅包括*.png、*.jpg、*.gif等各種格式的位圖，也包括使用XML資源文件定義的各種Drawable對象。一使用簡單圖片使用Drawable對象

當(dāng)我們?yōu)锳ndroid應(yīng)用增加了Drawable資源以后，AndroidSDK會為這份資源在R清單文件中創(chuàng)建一個索引項：R.drawable.file_name。

接下來既可在XML資源文件中通過@drawable/file_name來訪問該Drawable對象，也可在Java代碼中通過R.drawable.file_name訪問該Drawable對象。R.drawable.file_name是一個int類型的常量，它只代表Drawable對象的ID，如果Java程序中需要獲取實際的Drawable對象，則可調(diào)用Resources的getDrawable(intid)方法來獲取。一使用簡單圖片動手例子：

圖片局部放大

對應(yīng)項目android_04_ImageViewExample

一使用簡單圖片Bitmap和BitmapFactoryBitmap代表一張位圖，BitmapDrawable里封裝的圖片就是一個Bitmap對象。我們可以把一個Bitmap對象包裝成BitmapDrawable對象，可以調(diào)用BitmapDrawable的構(gòu)造器

BitmapDrawabledrawalbe=newBitmapDrawable(bitmap);如果需要獲取BitmapDrawable所包裝的Bitmap對象，則可調(diào)用BitmapDrawable的getBitmap()方法，如下面的代碼所示:

Bitmapbitmap=drawable.getBitmap();一使用簡單圖片Bitmap和BitmapFactory除此之外，Bitmap還提供了一些靜態(tài)方法來創(chuàng)建新的Bitmap對象，例如如下常用方法。createBitmap(Bitmapsource,intx,inty,intwidth,intheight):從源位圖source的指定坐標(biāo)點(diǎn)（給定x,y)開始，從中截取寬width、高h(yuǎn)eight，創(chuàng)建新的Bitmap對象。createScaledBitmap(Bitmapsrc,intdstWidth,intdstHeight,booleanfilter):對源位圖src進(jìn)行縮放，縮放成寬dstWidth、高dstHeight的新位圖。createBitmap(intwidth,intheight,Bitmap.Configconfig):創(chuàng)建一個新位圖createBitmap(Bitmapsource,intx,inty,intwidth,intheight,Matrixm,booleanfilter):從源位圖source的指定坐標(biāo)點(diǎn)（給定x,y)開始，從中截取寬width、高h(yuǎn)eight，創(chuàng)建新的Bitmap對象，并按Matrix指定的規(guī)則進(jìn)行變換。一使用簡單圖片BitmapFactory是一個工具類，它用于提供大量的方法，這些方法可用于從不同的數(shù)據(jù)源來解析、創(chuàng)建Bitmap對象。BitmapFactory包含了如下方法。decodeByteArray(byte[]data,intoffset,intlength):從指定字節(jié)數(shù)組的offset位置開始，將長度為length的字節(jié)數(shù)據(jù)解析成Bitmap對象decodeFile(StringpathName):從pathName指定的文件中解析、創(chuàng)建Bitmap對象。decodeFileDescriptor(FileDescriptorfd):用于從FileDescriptor對應(yīng)的文件中解析、創(chuàng)建Bitmap對象decodeStream(inputStreamis):用于從指定輸出流中解析、創(chuàng)建Bitmap對象一使用簡單圖片大部分時候，我們只要把圖片放在/res/drawable目錄下，就可以在程序中通過該圖片對應(yīng)的資源ID來獲取封裝該圖片的Drawable對象。但由于手機(jī)系統(tǒng)的內(nèi)存比較小，如果系統(tǒng)不停地去解析、創(chuàng)建Bitmap對象，可能由于前面創(chuàng)建Bitmap所占用的內(nèi)存還沒有回收，而導(dǎo)致程序運(yùn)行時引發(fā)OutOfMemory錯誤。Android為Bitmap提供了兩個方法來判斷它是否已回收，以及強(qiáng)制Bitmap回收自己。booleanisRecycled():返回該Bitmap對象是否已被回收voidrecycle():強(qiáng)制一個Bitmap對象立即回收自己一使用簡單圖片除此之外，如果Android應(yīng)用需要訪問其他存儲路徑（比如SD卡中）的圖片，都需要借助于BitmapFactory來解析、創(chuàng)建Bitmap對象。一使用簡單圖片動手例子：

查看/assets/目錄下圖片的查看器

對應(yīng)項目android_06_ImageAssetsViewExample

二繪圖除了使用已有的圖片之外，Android應(yīng)用常需要在運(yùn)行時動態(tài)地生成圖片，比如手機(jī)游戲的界面。這就需要借助于Android的繪圖支持。Android的繪圖應(yīng)該繼承View組件，并重寫它的onDraw(Canvascanvas)方法即可。重寫onDraw(Canvascanvas)方法時涉及一個繪圖API:Canvas,Canvas代表了View使用的畫布，它提供了以下各種方法繪制圖形二繪圖方法簽名簡要說明drawArc(RectFoval,floatstartAngle,floatsweepAngle,booleanuseCenter,Paintpaint)繪制弧drawBitmap(Bitmapbitmap,Rectsrc,Rectdst,Paintpaint)在指定點(diǎn)繪制從源位圖中”挖取“的部分drawBitmap(Bitmapbitmap,floatleft,floattop,Paintpaint)在指定點(diǎn)繪制位圖drawCircle(floatcx,floatcy,floatradius,Paintpaint)在指定點(diǎn)繪制圓形drawLine(floatstartX,floatstartY,floatstopX,floatstopY,Paintpaint)繪制一條線drawLines(float[]pts,intoffset,intcount,Paintpaint)繪制多條線drawOval(RectFoval,Paintpaint)繪制橢圓drawPath(Pathpath,Paintpaint)沿著指定Path繪制任意形狀二繪圖方法簽名簡要說明drawPoint(floatx,floaty,Paintpaint)繪制一個點(diǎn)drawPoints(float[]pts,intoffset,intcount,Paintpaint)繪制多個點(diǎn)drawRect(floatleft,floattop,floatright,floatbottom,Paintpaint)繪制矩形drawRoundRect(RectFrect,floatrx,flostry,Paintpaint)繪制圓角矩形drawText(Stringtext,intstart,intend,Paintpaint)繪制字符串drawTextOnPath(Stringtext,Pathpath,floathOffset,floatvOffset,Paintpaint)沿著路徑繪制字符串clipRect(floatleft,floattop,floatright,floatbottom)剪切一個矩形區(qū)域clipRegion(Region)剪切指定區(qū)域二繪圖除了前面定義的各種方法之外，Canvas還提供了如下方法進(jìn)行變換rotate(floatdegrees,floatpx,floatpy):對Canvas執(zhí)行旋轉(zhuǎn)scale(floatsx,floatpx,floatpy):對Canvas執(zhí)行縮放translate(floatdx,floatdy):移動Canvas.向右移動dx距離（dx為負(fù)即為向左移動）：向下移動dy距離（dy為負(fù)即為向上移動）。二繪圖Canvas提供的上面的方法還涉及一個API:Paint,Paint代表了Canvas上的畫筆，因此Paint類主要用于設(shè)置繪制風(fēng)格，包括畫筆顏色、畫筆筆觸粗細(xì)、填充風(fēng)格等。Paint提供了如下方法二繪圖方法簽名簡要說明setARGB(inta,intr,intg,intb)/setColor(intcolor)設(shè)置顏色setAlpha(inta)設(shè)置透明度setAntiAlias(booleanaa)設(shè)置是否抗鋸齒setPathEffect(PathEffecteffect)設(shè)置繪制路徑時的路徑效果setShader(Shadershader)設(shè)置畫筆的填充效果setShadowLayer(floatradius,floatdx,floatdy,intcolor)設(shè)置陰影setStrokeWidth(floatwidht)設(shè)置畫筆的筆觸寬度setStrokeJoin(PaintJointjoin)設(shè)置畫筆拐彎處的連接風(fēng)格setStyle(Paint.Stylestyle)設(shè)置Paint的填充風(fēng)格setTextAlign(Paint.Alignalign)設(shè)置繪制文本時的文字的對齊方式setTextSize(floattextSize)設(shè)置繪制文本時的文字大小二繪圖在Canvas提供的繪制方法中還用到一個API:Path,Path代表任意多條直線連接而成的任意圖形，當(dāng)Canvas根據(jù)Path繪制時，它可以繪制出任意的形狀。二繪畫動手例子：

繪制基本的集合圖形

對應(yīng)項目android_06_DrawSomethingExample

關(guān)鍵部分

自定義View組件，程序重寫該View組件的onDraw(Canvas)方法

二繪圖Path類從前面的程序可以看出，Android提供的Path是一個非常有用的類，它可以預(yù)先在View上將N個點(diǎn)連成一條”路徑“，然后調(diào)用Canvas的drawPath(path,paint)即可沿著路徑繪制圖形。實際上Android還為路徑繪制提供了PathEffect來定義繪制效果，PathEffect包含了如下子類（每個子類代表一種繪制效果）：

ComposePathEffectCornerPathEffectDashPathEffectDiscretePathEffectPathDashPathEffectSumPathEffect二繪畫動手例子：

*使用不同效果繪制路徑

對應(yīng)項目android_06_DrawPathExample

二繪圖除此之外，Android的Canvas還提供了一個drawTextOnPath(Stringtext,Pathpath,floathOffset,floatvOffset,Paintpaint)方法，該方法可以沿著Path繪制文本。其中hOffset參數(shù)指定水平偏移、vOffset參數(shù)指定垂直偏移。二繪畫動手例子：*對應(yīng)Path路徑繪制文本

對應(yīng)項目android_06_DrawTextOnPathExample

二繪圖繪制游戲動畫

掌握了Canvas繪畫后，如果需要實現(xiàn)游戲動畫也是非常簡單的。動畫其實就是不斷地重復(fù)調(diào)用View組件的onDraw(Canvascanvas)方法，如果每次在View組件上繪制的圖形并不相同，就形成動畫二繪圖繪制游戲動畫

為了讓View組件上繪制的圖形發(fā)生改變（無非是位置、大小、角度等發(fā)生改變），這就需要程序記住這些狀態(tài)數(shù)據(jù)--如果需要游戲動畫隨用戶操作而改變，就為用戶動作編寫事件監(jiān)聽器，在監(jiān)聽器中修改數(shù)據(jù)；如果需要游戲動畫“自動”改變，就需要使用定時器（Timer),讓Timer控制這些狀態(tài)數(shù)據(jù)定期修改二繪圖繪制游戲動畫

不管使用哪種方式，每次View組件上的圖形狀態(tài)數(shù)據(jù)發(fā)生了改變，都應(yīng)該通知View組件重寫調(diào)用onDraw(Canvascanvas)方法重繪該組件。通知View重繪可調(diào)用invalidate(在UI線程中）或postInvalidate(在非UI線程中）二繪畫動手例子：

彈球?qū)?yīng)項目android_06_BumpBallExample

二繪畫繪制游戲動畫本示例要實現(xiàn)一個畫圖板，當(dāng)用戶在觸摸屏上移動時，即可在屏幕上繪制任意的圖形動手例子：DrawSomething對應(yīng)項目android_06_DrawSomethingAnimationExample

二繪畫思考：1怎么使用戶在觸摸屏上自由的畫曲線？2每次OnDraw重繪時，原有的內(nèi)容會丟失，怎么解決？

二繪畫思考：1怎么使用戶在觸摸屏上自由的畫曲線？

實際上利用drawLine來畫直線，每條直線都是從上一次拖動事件發(fā)生點(diǎn)畫到本次拖動事件發(fā)生點(diǎn)。當(dāng)用戶在觸摸屏上移動時，兩次拖動事件發(fā)生的距離很小，多條極短的直線連起來，看起來就是曲線了。借助于Android提供的Path類，可以非常方便地實現(xiàn)這種效果。2每次OnDraw重繪時，原有的內(nèi)容會丟失，怎么解決？

當(dāng)程序需要在指定View上進(jìn)行繪制時，程序并不直接繪制到該View組件上，而是先繪制到一個內(nèi)存中的Bitmap圖片，等到內(nèi)存中的Bitmaip繪制好后，在一次性將Bitmap繪制到View組件上

，也就是所謂的“雙緩沖”技術(shù)三圖形特效處理(Matrix)Andoird除了前面介紹的這些圖形支持外，還提供了一些額外的圖形特效支持，如Matrix三圖形特效處理(Matrix)Matrix是Android提供的一個矩陣工具類，它本身并不能對圖像或組件進(jìn)行變換，但它可與其他API結(jié)合來控制圖形、組件的變換使用Matrix控制圖像或組件的步驟如下。1獲取Matrix對象，該Matrix對象即可新創(chuàng)建，也可直接獲取其他對象內(nèi)封裝的Matrix(例如Transformation對象內(nèi)部就封裝了Matrix)。2調(diào)用Matrix的方法進(jìn)行平移、旋轉(zhuǎn)、縮放、傾斜等3將程序?qū)atrix所做的變換應(yīng)用到指定圖像或組件三圖形特效處理(Matrix)Matrix不僅可用于控制圖形的平移、旋轉(zhuǎn)、縮放、傾斜變換，也可以控制View組件進(jìn)行平移、旋轉(zhuǎn)和縮放等。三圖形特效處理(Matrix)Matrix提供了如下方法來控制平移、旋轉(zhuǎn)和縮放setTranslate(floatdx,floatdy):控制Matrix進(jìn)行平移setRotate(floatdegrees,floatpx,floatpy):設(shè)置以px、py為軸心進(jìn)行旋轉(zhuǎn)，degrees為控制旋轉(zhuǎn)的角度setScale(floatsx,floatsy,floatpx,floatpy):設(shè)置Matrix以px、py為軸心進(jìn)行縮放，sx、sy控制了X、Y方向上的縮放比例setSkew(floatkx,floatky,floatpx,floatpy):控制Matrix以px、py為軸心進(jìn)行傾斜。kx、ky為x、y方向上的傾斜距離。三圖形特效處理(Matrix)一旦對Matrix進(jìn)行了變換，接下來就可應(yīng)用該Matrix對圖形進(jìn)行控制了。例如Canvas就提供了一個drawBitmap(Bitmapbitmap,Matrixmatrix,Paintpaint)方法，調(diào)用該方法就可以在繪制bitmap時應(yīng)用Matrix上的變換三圖形特效處理(Matrix)動手例子：

鍵盤控制圖形進(jìn)行Matrix變換(上下鍵縮放，左右鍵傾斜）對應(yīng)項目android_06_KeyboardMatrixExample三圖形特效處理(Matrix)動手例子：

飛機(jī)”向上“飛行（通過控制背景圖片下移）

對應(yīng)項目android_06_PlaneMoveBackExample四逐幀動畫逐幀（Frame)是最容易理解的動畫，開發(fā)者把動畫過程的每張靜態(tài)圖片都收集起來，然后由Android來控制依次顯示這些靜態(tài)圖片，利用人眼“視覺暫留”的原理，給用戶造成“動畫”的錯覺。逐幀動畫的動畫原理與放電影的原理完全一樣。四AnimationDrawable與逐幀動畫定義逐幀動畫非常簡單，只要在<animation-list.../>元素中使用<item.../>子元素定義動畫的全部幀，并指定各幀的持續(xù)時間即可。定義逐幀動畫的語法格式如下：<?xmlversion="1.0"encoding="utf-8"?><animation-listxmlns:android=/apk/res/androidandroid:oneshot=["true"|"false"]><itemandroid:drawable="@[package:]drawable/drawable_resource_name"android:duration="integer"/></animation-list>四AnimationDrawable與逐幀動畫上面的語法格式中android:onshot控制該動畫是否循環(huán)播放，如果該參數(shù)指定為true,則動畫將不會循環(huán)播放；否則該動畫將會循環(huán)播放。每個<item.../>子元素添加一幀。四AnimationDrawable與逐幀動畫Android完全支持在Java代碼中創(chuàng)建逐幀動畫，如果開發(fā)者喜歡，開發(fā)者完全可以先創(chuàng)建AnimationDrawable對象，然后調(diào)用addFrame(Drawableframe,intduration)向該動畫中添加幀，每調(diào)用一次addFrame方法，就向<animation-list.../>元素中添加一個<item.../>子元素。四AnimationDrawable與逐幀動畫一旦程序獲取了AnimationDrawable對象之后，接下來就可用ImageView把AnimationDrawable顯示出來---習(xí)慣上把AnimationDrawable設(shè)成ImageView的背景即可。四AnimationDrawable與逐幀動畫動手例子：

控制動畫的播放和停止對應(yīng)項目android_06_FrameAnimationExample關(guān)鍵代碼（res\anim\fat_po.xml)<animation-listxmlns:android="/apk/res/android"android:oneshot="false"><itemandroid:drawable="@drawable/fat_po_f01"android:duration="60"/><itemandroid:drawable="@drawable/fat_po_f02"android:duration="60"/></animation-list>四AnimationDrawable與逐幀動畫需要指出的是，AnimationDrawable代表的動畫默認(rèn)是不播放的，必須在程序中啟動動畫播放才可以。AnimationDrawable提供了如下兩個方法來開始、停止動畫。start():開始播放動畫。stop():停止播放動畫。四AnimationDrawable與逐幀動畫動手例子：

在指定點(diǎn)爆炸對應(yīng)項目android_06_BlastFrameAnimationExample四AnimationDrawable與逐幀動畫前面介紹“雷電”飛機(jī)游戲時已經(jīng)提到，當(dāng)敵機(jī)與用戶自己的飛機(jī)碰撞、或者自己的飛機(jī)發(fā)射的子彈與敵機(jī)碰撞時，都應(yīng)該在碰撞點(diǎn)播放“飛機(jī)爆炸”的動畫。

爆炸效果實際上是一個逐幀動畫，開發(fā)者需要收集從開始爆炸到爆炸結(jié)束的所有靜態(tài)圖片，再將這些圖片定義成一個逐幀動畫，接著在碰撞點(diǎn)播放該逐幀動畫即可。

本示例為了突出此處的“主題”---在指定點(diǎn)爆炸，并未增加飛機(jī)控制這些細(xì)節(jié)，只是簡單地檢測觸摸屏事件，當(dāng)用戶觸摸觸摸屏?xí)r，程序?qū)谟|碰點(diǎn)“爆炸”。五補(bǔ)間（Tween)動畫Android除了支持逐幀動畫之外，也提供了對補(bǔ)間（Tween)動畫的支持，補(bǔ)間動畫就是開發(fā)者只需要指定動畫開始、動畫結(jié)束“關(guān)鍵幀”，而動畫變化的“中間幀”由系統(tǒng)計算、并補(bǔ)齊。五補(bǔ)間（Tween)動畫補(bǔ)間動畫所定義的開始幀、結(jié)束幀其實只是一些簡單的變化。比如圖形大小的縮放、旋轉(zhuǎn)角度的改變等。Android使用Animation代表抽象的動畫類，它包括如下幾個子類。AlphaAnimation:透明度改變的動畫。創(chuàng)建該動畫時要指定動畫開始的透明度、結(jié)束時的透明度和動畫的持續(xù)時間。其中透明度可從0變化到1ScaleAnimation:大小縮放的動畫。創(chuàng)建該動畫時需要指定動畫開始時的縮放比（以X、Y軸的縮放參數(shù)來表示）、結(jié)束時動畫的縮放比（以X、Y軸的縮放參數(shù)來表示），并指定動畫持續(xù)時間。由于縮放時以不同點(diǎn)為中心縮放效果并不相同，因此指定縮放動畫時還要通過pivotX、privotY來指定縮放中心的坐標(biāo)五補(bǔ)間（Tween)動畫TranslateAnimation:位移變化的動畫，創(chuàng)建該動畫時只要指定動畫開始時的位置（以X、Y坐標(biāo)來表示）、結(jié)束時的位置（以X、Y坐標(biāo)來表示），并指定動畫持續(xù)時間即可RotateAnimation:旋轉(zhuǎn)動畫，創(chuàng)建該動畫時只要指定動畫開始時的旋轉(zhuǎn)角度、結(jié)束時的旋轉(zhuǎn)角度，并制定動畫持續(xù)時間即可。由于旋轉(zhuǎn)時以不同點(diǎn)為中心旋轉(zhuǎn)效果并不相同，因此指定旋轉(zhuǎn)動畫時還要通過pivotX、pivotY來指定“旋轉(zhuǎn)軸心”的坐標(biāo)五補(bǔ)間（Tween)動畫一旦為補(bǔ)間動畫指定了3個必要信息，Android就會根據(jù)動畫的開始幀、結(jié)束幀、動畫持續(xù)時間計算出需要在中間“補(bǔ)入”多少幀，并計算所有補(bǔ)入幀的圖形。當(dāng)用戶瀏覽補(bǔ)間動畫時，他看到的依然是“逐幀動畫”

為了控制在動畫期間需要動態(tài)“補(bǔ)入”多少幀，具體在動畫運(yùn)行的那些時刻補(bǔ)入幀，需要借助于Interpolator。五補(bǔ)間（Tween)動畫

Interpolator根據(jù)特定算法計算出整個動畫所需要動態(tài)插入幀的密度和位置，簡單地說，Interpolator負(fù)責(zé)控制動畫的變化速度，這就使得基本的動畫效果（Alpha、Scale、Translate、Rotate)能以勻速變化、加速、減速、拋物線速度等各種速度變化。Interpolator是一個接口，它定義了搜有Interpolator都需要實現(xiàn)的方法：floatgetInterpolation(floatinput),開發(fā)者完全可以通過實現(xiàn)Interpolator來控制動畫的變化速度。五補(bǔ)間（Tween)動畫

Android為Interpolator提供了如下幾個實現(xiàn)類，分別用于實現(xiàn)不同動畫變化速度。LinearInterpolator:動畫以均勻的速度改變AccelerateInterpolator:在動畫開始的地方改變速度較慢，然后開始加速。AccelerateDecelerateInterpolator:在動畫開始、結(jié)束的地方改變速度較慢，在中間的時候加速CycleInterpolator:動畫循環(huán)播放特定的次數(shù)，變化速度按正弦曲線改變DecelerateInterpolator:在動畫開始的地方改變速度較快，然后開始減速。五補(bǔ)間（Tween)動畫為了在動畫資源文件中指定補(bǔ)間動畫所使用的Interpolator,定義補(bǔ)間動畫的<set.../>元素支持一個android:interpolator屬性，該屬性的屬性值可指定為Android默認(rèn)支持的Interpolator.

例如：@android:anim/linear_interpolator@android:anim/accelerate_interpolator@android:anim/decelerate_interpolator其實上面的寫法很有規(guī)律，他們就是把系統(tǒng)提供的Interpolator實現(xiàn)類的類名的駝峰寫法改為中劃線寫法即可。五補(bǔ)間（Tween)動畫一旦在程序中通過AnimationUtils得到代表補(bǔ)間動畫的Animation之后，接下來就可調(diào)用View的startAnimation(Animationanim)方法開始對View執(zhí)行動畫了。雖然Android允許在程序中創(chuàng)建Animation對象，但實際上一般都會采用動畫資源文件來定義補(bǔ)間動畫五補(bǔ)間（Tween)動畫一旦在程序中通過AnimationUtils得到代表補(bǔ)間動畫的Animation之后，接下來就可調(diào)用View的startAnimation(Animationanim)方法開始對View執(zhí)行動畫了。雖然Android允許在程序中創(chuàng)建Animation對象，但實際上一般都會采用動畫資源文件來定義補(bǔ)間動畫五補(bǔ)間