一、問題描述
有時候我們需要在TextView的左邊或者是別的位置去顯示一張圖片(如圖1)。以往的做法是在TextView的左邊或者是別的位置添加一個ImageView控件,來達到我們想要的效果。仔細查看編譯器給我們的提示,我們會驚奇的發現,Android API給我們提供了“android:drawableLeft=”“”去設置TextView左邊顯示圖片,它也建議我們去採用這樣的方法去做。但事實上它並不能滿足我們想要的效果,當你想動態的去改變顯示的圖片,發現我們找不到這個方法了,還是得用以往的做法。都說度娘好,結果我卻沒有百度到(可能是個人能力差吧!),經過我不斷的摸索,找到了一個可行的辦法,但不一定都能滿足你想要的效果,寫篇小博客,把這個方法分享給大家。
圖1 TextView左邊顯示圖片
圖2 TextView上方顯示圖片
二、問題分析
TextView是Android經常用到的組件。當我們在自定義控件時,需要在TextVeiw的左邊(圖1)、上方(圖2)去顯示圖片。在Android API提供的方法中,可以在XML文件裏去設置,但很遺憾的是,我們在Java中找不到這樣的方法動態去改變要顯示的圖片。這時,你不得不在TextView的左邊或者是上方去嵌套一個ImageView來實現你想要的效果了。其實不用這麼繁瑣,小編幫你解決這個問題。
三、具體方法
1、首先新建一個XML文件,在佈局中加入一個TextView,並添加上控件ID。代碼如下:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="@+id/id_show_data_num"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="15dp"
android:textColor="@color/white"
android:textSize="18sp" />
<!-- 圖片與文字的間距可通過android:drawablePadding=""來設置 -->
</RelativeLayout>
2、在Java代碼裏獲取控件ID,此時便可以通過下面這個方法來設置你要顯示的圖片,這個方法需要傳入的是ID或者drawable資源。
參數含義:望文生義。當別的地方不需要顯示時,ID資源設置爲0(不要設置爲負數,否則會崩潰哦!目前只有0才屢試不爽,正數也不管用,自己可以去試試別的參數,具體原因,還在挖掘),drawable設置爲null即可。
TextView.setCompoundDrawablesWithIntrinsicBounds(Drawable left, Drawable top, Drawable right, Drawable bottom)
TextView.setCompoundDrawablesWithIntrinsicBounds(int left, int top, int right, int bottom)
//1、通過ID資源設置
id_show_data_num.setCompoundDrawablesWithIntrinsicBounds(resourceId, 0,
0, 0);
//2、通過drawable資源設置
id_show_data_num.setCompoundDrawablesWithIntrinsicBounds(null, drawable, null, null);
四、方法優化
上述的做法有一個最大的缺點,你所設置的圖片原圖有多大,它就顯示多大,這是很令人頭疼的。有時我需要大圖又需要小圖,那麼我就是將這個兩張圖片都準備出來,這不僅僅是增大了應用體積的問題,我還得想個好聽名稱去命名(對於我這種懶人無法接受)。下面告訴你解決這個問題的辦法,而你只需準備一張大圖就OK(爲什麼不用小圖:大圖變小圖很清晰,反過來呢??)。
方法:
上面說到,可以用drawable資源去設置要顯示的圖片,那麼在加載這個資源時,我們是可以變換一下drawable的大小的。將圖變成我們想要的大小後,我們在去設置顯示圖片。
/**
* 變換資源圖片的大小
* @param drawable 將要變換的圖片,可以是ID資源,此處使用drawable
* @param w 目標圖片寬
* @param h 目標圖片高
* @return Drawable
*/
public static Drawable zoomDrawable(Drawable drawable, int w, int h) {
//如果傳入的是ID資源,啓動此行代碼,要傳入當前上下文哦
//Drawable drawable = context.getResources().getDrawable(R.id.resourceId);
if(drawable == null)
return null;
// 取 drawable 的顏色格式
Bitmap.Config config = drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888
: Bitmap.Config.RGB_565;
// 建立對應 bitmap
Bitmap bitmap = Bitmap.createBitmap(w, h, config);
// 建立對應 bitmap 的畫布
Canvas canvas = new Canvas(bitmap);
drawable.setBounds(0, 0, w, h);
// 把 drawable 內容畫到畫布中
drawable.draw(canvas);
drawable = new BitmapDrawable(bitmap);
//圖片操作是很耗資源的,記得要釋放不需要的臨時變量
canvas = null;
bitmap = null;
return drawable;
}
//變換完圖片的大小後,我們就可以去設置要顯示的圖片了
//調用該方法後一定要判斷是否爲null
Drawable drawable = zoomDrawable(x,x,x);
if(drawable != null){
id_show_data_num.setCompoundDrawablesWithIntrinsicBounds(drawable, null, null, null);
//圖片操作是很耗資源的,記得要釋放不需要的臨時變量
drawable = null;
}
到此,我們便完成了同過Java代碼去設置TextView不同方位上的圖片了。
由於小編學藝不精,文中難免有錯誤之處,還望指正。謝謝合作!