問題概述

對于進度條我相信大家不陌生，這里我就不再多說什么了。因為這個不是重點。我們要說的是如何去自定義一個不一樣的進度條。這里用到兩張圖片（背景和前景），其實是三張（背景、前景和蒙圖）。當我們的蒙圖在移動的時候，動態地去顯示背景和前景。被蒙圖擋住的部分顯示前景，沒有擋住的部分顯示背景。而蒙圖的圖片大小，則需要不小于背景和前景圖片大小（如果你不是用來做進度條，就無所謂了），蒙圖的圖片內容沒有要求。

Android中對圖片的操作，很多時候都用到了位圖——Bitmap。

思路分析

想一想，我們應該怎么來實現這個功能？

拋開蒙板不提，單是做一個自定義的進度條的話，是不是應該讓一張背景圖保持不動，然后用一張同等大小、不同樣式的圖片來蓋在上面，最后寫一個方式來動態改變前景圖片需要顯示的長度即可。想法是好的，不過我想Android應該還沒有只去顯示一張圖片一部分的方式。如果你說你用的是純色的前景圖片，然后動態改變圖片的長度，這個是可以，不過還有一個問題，那就是如果我的類進度條是不規則的圖形呢？例如，圓、小車、房子、等等。。。

其實能想上面的這種方式，離真相就已經很接近了。下面我給一張我用畫圖工具畫的原理圖，圖畫得有點粗糙，不過還能看，大家請見諒。

也就是說我們的蒙板其實是由三張圖，經過兩次合成生成的。第一次是把前景圖和蒙板合成，第二是把背景圖和剛剛第一次合成好的前置圖再一次合成。三張圖從上到下的疊放順序是：蒙板圖、前景圖、背景圖。是不是想說既然蒙板在最上面，那么蒙板不是要把下面兩張圖給擋住了嗎？是這樣嗎？如果我們只是普通地疊放，的確是這樣，如果是這樣那這篇博客也就沒什么意義了。其實前面我也有一點鋪墊的描述，那就是我們的蒙板圖片只要大小合適，圖片里的內容是無關痛癢的。想想為什么？因為我們的蒙板圖片在這里根本不顯示出來。你可以把它想像成一片區域，在這片區域里面，我們背景或前景（本程序我們顯示背景，其實是A圖和蒙板圖片合成Bitmap后，有蒙板圖的區域就不顯示A。這樣一來，是不是有蒙板的區域就露出了背景的馬腳了？哈哈，就是這樣。。。）。

看到這里，大家是不是想問，為什么蒙板圖片會不顯示呢？是不是Android有一個控件有這樣的一個效果呢？沒有！不過我們可以自己寫，這就是為什么我們要用到Bitmap，一看名字就是它是對位進行操作。這里，我們是對像素進行一個控制。如下：

for (int i = 0; i < maskPixels.length; i++) {if (maskPixels[i] == 0xff000000) {showPicturePixels[i] = 0;} else if (maskPixels[i] == 0) {} else {maskPixels[i] &= 0xff000000;maskPixels[i] = 0xff000000 - maskPixels[i];showPicturePixels[i] &= 0x00ffffff;showPicturePixels[i] |= maskPixels[i];}} 對于像素點，顏色編碼這些自己百度，查資料，這里不做說明。不過可以簡單說明上面代碼的原理，它就是拿蒙板圖片與黑色作比較，拿前景圖片與白色作比較。得到蒙板中有圖的區域，再與前景圖片位或運算得到新的像素點。

那我們又如何控制蒙板要顯示的長度呢？可以先看看如下代碼：

int batteryLevel = 50; // 這里我定了一個50%的電量值，用來調節顯示百分之多少int showWidth = (int)(((double)batteryLevel / 100.0) * showBitmap.getWidth());maskBitmap.getPixels(maskPixels, 0, w, 0, 0, showWidth, h); 這里，我假設有一個手機電量的參數值。且自定義其數值為剩余50%的電量。通過這個50%來計算我需要顯示蒙板圖片到什么位置，即showWidth參數值。（關于電量的計算方式我之前的博客中有提到過，大家可以點擊查看。）

關于蒙板的關鍵技術問題，以上已經做了一個簡單的說明。如果大家感興趣，也可以下載我的Demo源碼。

程序效果圖.

最后我給出一張效果圖（綠色為背景、黃色為前景、蒙板為黑色，這里不可見。）：

源碼分享

http://download.csdn.net/download/u013761665/7700325

筆者最新開發的應用連接

http://zhushou.360.cn/detail/index/soft_id/2419729?recrefer=SE_D_%E6%A3%B1%E9%95%9C

http://www.wandoujia.com/apps/com.mastershield.personalstat

總結

以上是生活随笔為你收集整理的Android中用图片自定义一个进度条（实现蒙板效果）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。