android項目中作一個默認圖片變暗,有焦點時變亮的效果。相信你們都能各類辦法,各類手段很容易的實現這個效果。這裏記錄下做者實現這個效果的過程及遇到的問題,僅供參考。
見下圖(注:由於是eclipse截圖,因此有點色差,黃色變成藍色,不過暗亮的效果仍是明顯的):
html
1.腦殼裏轉的第一個實現的想法是:
2張圖片,一張暗圖,一張亮圖。監聽焦點事件,更換圖片。
一個資源圖片弄2份,而且這圖片是從服務器上獲取的,不實際。
java
2.記得以前有過用設置控件的透明度。好,來試試:
有2個不一樣的重載方法,形參分別爲float和int。這倆有啥區別呢? android
public void setAlpha(float alpha)
設置View的透明度爲0~1的值,0徹底透明,1徹底不透明。注意這裏說的是View api
public void setAlpha(int alpha)
設置View的透明度爲0~255的值,0徹底透明,255徹底不透明。
服務器
設置 image 的透明度,而且該方法在API 16的版本里被setImageAlPha(int)代替 eclipse
眼見爲實,來分別看看效果: 測試
iv.setAlpha(0.5f)效果圖爲: this
setImageAlpha(100),效果爲:╮(╯▽╰)╭報異常退出了。 spa
07-08 21:17:12.012: E/AndroidRuntime(29310): java.lang.NoSuchMethodError: android.widget.ImageView.setImageAlpha
測試機爲android4.0.3,對應api爲15.eclipse裏有設置對應爲16的api,但一運行就掛了╮(╯▽╰)╭。目測應該是兼容性問題,這裏不深究了,感受上篇講的targetVersion有關,不過沒驗證。
這裏還有另一個方法,iv.getBackground().setAlpha(100);運行效果出來和上圖使用iv.setAlpha(0.5f),不過透明程度有點不一致(但沒大看出來)。前者值爲(1~255),後者爲(0~1)。 code
到這裏你們應該發現,和想要實現的效果相差甚遠吧,做者也大失所望。
繼續找找還有啥子方法呢?不當心找到了個這個方法:
顏色過濾?是不ps的濾鏡?來看下怎麼用:
經過setColorFilter能夠實現濾鏡效果。 如: final WallpaperManager wallpaperManager = WallpaperManager.getInstance(this);
//獲取壁紙
final Drawable wallpaperDrawable = wallpaperManager.getDrawable();
//指定濾鏡顏色以及混合模式
wallpaperDrawable.setColorFilter(Color.RED, PorterDuff.Mode.MULTIPLY);
/*注意:PorterDuff.Mode枚舉值:
1.PorterDuff.Mode.CLEAR 所繪製不會提交到畫布上。
2.PorterDuff.Mode.SRC 顯示上層繪製圖片
3.PorterDuff.Mode.DST 顯示下層繪製圖片
4.PorterDuff.Mode.SRC_OVER 正常繪製顯示,上下層繪製疊蓋。
5.PorterDuff.Mode.DST_OVER 上下層都顯示。下層居上顯示。
6.PorterDuff.Mode.SRC_IN 取兩層繪製交集。顯示上層。
7.PorterDuff.Mode.DST_IN 取兩層繪製交集。顯示下層。
8.PorterDuff.Mode.SRC_OUT 取上層繪製非交集部分。
9.PorterDuff.Mode.DST_OUT 取下層繪製非交集部分。
10.PorterDuff.Mode.SRC_ATOP 取下層非交集部分與上層交集部分
11.PorterDuff.Mode.DST_ATOP 取上層非交集部分與下層交集部分
12.PorterDuff.Mode.XOR //變暗
13.PorterDuff.Mode.DARKEN //調亮
14.PorterDuff.Mode.LIGHTEN //用於顏色濾鏡
15.PorterDuff.Mode.MULTIPLY
16.PorterDuff.Mode.SCREEN
來試下效果:
iv.setColorFilter(Color.TRANSPARENT,PorterDuff.Mode.XOR);貌似效果沒變。看看上面用法說明
Set a tinting option for the image
是設置圖片image,不是控件ImageView的.換成下面的用法:
Drawable drawable = imgs.get(i); drawable.setColorFilter(Color.TRANSPARENT,PorterDuff.Mode.XOR); iv.setImageDrawable(drawable);仍是沒效果。
drawable.setColorFilter(Color.GRAY,PorterDuff.Mode.MULTIPLY);
O(∩_∩)O~哈哈,效果出來了:
這是個不錯的嘗試。而後獲取焦點時,把這個濾鏡清掉就OK了。
drawable.clearColorFilter();顯示爲原始亮圖了。
注:其實做者最開始貼上去的2張圖並非用上面濾鏡方法實現的。上面方法只是在整理這篇博客時,臨時發現的。就嘗試下,沒想到成功了。早知道當時就都多試幾回,就不用下面這種方法了。
繼續瞅瞅ImageView的api吧,看看都有些啥子屬性。相信你們都會注意到ImageView特有的這2個方法:
public void setImageDrawable (Drawable drawable) Added in API level 1 Sets a drawable as the content of this ImageView. Parameters drawable The drawable to set
public void setBackgroundDrawable(Drawable background) This method was deprecated in API level 16. use setBackground(Drawable) instead這2者有啥區別呢?這個相信用過的人都不難理解。
當設置setBackgroundDrawable時,整個ImageView的控件背景色會變。
當設置setImageDrawable時,ImageView中間內容區會被圖片填充。可是周圍會有一些邊距,默認沒法填充整個控件(固然,這也是有屬性設置的)。
ScaleType的值分別表明的意義: ImageView是Android中的基礎圖片顯示控件,該控件有個重要的屬性是ScaleType,該屬性用以表示顯示圖片的方式,共有8種取值
ScaleType.CENTER::圖片大小爲原始大小,若是圖片大小大於ImageView控件,則截取圖片中間部分,若小於,則直接將圖片居中顯示。
ScaleType.CENTER_CROP:將圖片等比例縮放,讓圖像的短邊與ImageView的邊長度相同,即不能留有空白,縮放後截取中間部分進行顯示。
ScaleType.CENTER_INSIDE:將圖片大小大於ImageView的圖片進行等比例縮小,直到整幅圖可以居中顯示在ImageView中,小於ImageView的圖片不變,直接居中顯示。
ScaleType.FIT_CENTER:ImageView的默認狀態,大圖等比例縮小,使整幅圖可以居中顯示在ImageView中,小圖等比例放大,一樣要總體居中顯示在ImageView中。
ScaleType.FIT_END:縮放方式同FIT_CENTER,只是將圖片顯示在右方或下方,而不是居中。
ScaleType.FIT_START:縮放方式同FIT_CENTER,只是將圖片顯示在左方或上方,而不是居中。
ScaleType.FIT_XY:將圖片非等比例縮放到大小與ImageView相同。
ScaleType.MATRIX:是根據一個3x3的矩陣對其中圖片進行縮放
好比說上圖,藍色圖標爲setImageDrawable,後面灰色背景爲setBackgroundDrawable,src在背景之上。這樣你們應該能明白了吧。
好吧。言歸正傳,有這2個屬性+ScaleType.CENTER_CROP,徹底能夠實現圖片變暗變亮效果了。
1.用一張過濾遮蓋變暗的圖片filter_bg.png做爲ImageView的源圖片:setImageDrawable
2.把要顯示的圖片show.png設置爲背景:setBackgroundDrawable
3.當變亮時,用一張遮蓋後徹底透明的圖片transparent_bg.png替換filter_bg.png
這樣就實現變暗變亮的效果了。
注:設置時,要設置src填充整個控件CENTER_CROP
<ImageView android:id="@+id/ivs_show1" android:layout_width="315px" android:layout_height="120px" android:src="@drawable/filter_bg" android:scaleType="centerCrop"/>
做者就是採用這種笨方法來實現的。歡迎你們吐槽O(∩_∩)O~