Android tint著色（優化，減小apk體積）

摘要： 參考 1、 Android-使用tint一張圖製作selector 2、 探索Android Material Design 中的Tint（著色） 3、 Android background tint顏色渲染 前言 tint翻譯而來就是著色（顏色渲染），就是在一...

參考

1、 Android-使用tint一張圖製作selector

2、 探索Android Material Design 中的Tint（著色）

3、 Android background tint顏色渲染

前言

tint翻譯而來就是著色（顏色渲染），就是在一張圖的圖層上刷顏色而達到不同效果，一個顯著的好處就是，一個簡單的icon圖示使用，不再需要美工做多張不同顏色的，直接用著色器多一張icon著色，就有好多張不同效果的icon圖片了，可以顯著減少apk體積。

PorterDuff.Mode屬性

tint著色的主要屬性，在xml中是tintMode，用來在不同場景中使用的

常量	含義
CLEAR	所繪製不會提交到畫布上
SRC	顯示上層繪製圖片
DST	顯示下層繪製圖片
SRC_OVER	正常繪製顯示，上下層繪製疊蓋
DST_OVER	上下層都顯示。下層居上顯示
SRC_IN	取兩層繪製交集。顯示上層
DST_IN	取兩層繪製交集。顯示下層
SRC_OUT	取上層繪製非交集部分
DST_OUT	取下層繪製非交集部分
SRC_ATOP	取下層非交集部分與上層交集部分
DST_ATOP	取上層非交集部分與下層交集部分
XOR	異或：去除兩圖層交集部分
DARKEN	取兩圖層全部區域，交集部分顏色加深
LIGHTEN	取兩圖層全部，點亮交集部分顏色
MULTIPLY	取兩圖層交集部分疊加後顏色
SCREEN	取兩圖層全部區域，交集部分變為透明色
ADD
OVERLAY

例項

截圖

程式碼

• 1、普通無著色、著紅色、著綠色背景橘黃色

  使用tint和android:backgroundTint這兩個屬性

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/dev_printer" />

<ImageView
android:layout_marginStart="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/dev_printer"
android:tint="@color/red"/>

<ImageButton
android:layout_marginStart="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/dev_printer"
android:tint="@color/green"
android:background="@color/pink"
android:backgroundTint="@color/orange"/>

• 2、變色器，按鈕點選觸發變色

  src加selector的drawable

<ImageView
android:layout_marginStart="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/bg_tint_press_selector"
android:clickable="true"/>

drawable/bg_tint_press_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="@drawable/bg_tint_press_on"/>
<item android:state_pressed="false" android:drawable="@drawable/dev_printer"/>
</selector>

selector中的drawable/bg_tint_press_on.xml，這裡使用tint屬性

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="@drawable/dev_printer"
android:tint="@color/green"
android:tintMode="multiply">

</bitmap>

3、Java程式碼實現tint變色，2種方式，api高於或等於21的直接用setImageTintList進行著色，api低的用著色好的drawable來載入

private void tint_red(){
//需要api21
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
LogUtil.d("setImageTintList red >>> ");
ibt_1.setImageTintList(ColorStateList.valueOf(getResources().getColor(R.color.red)));
}
else{
LogUtil.d("setImageDrawable red >>> ");
ibt_1.setImageDrawable(tintDrawable(this, R.mipmap.dev_printer, R.color.red));
}
}

public static Drawable tintDrawable(Context context, int resIcon, int resColor){
//利用ContextCompat工具類獲取drawable圖片資源
Drawable drawable = ContextCompat.getDrawable(context, resIcon);
return tintDrawable(drawable, ContextCompat.getColor(context,resColor));
}

public static Drawable tintDrawable(Drawable drawable, int colors) {
final Drawable wrappedDrawable = DrawableCompat.wrap(drawable).mutate();
DrawableCompat.setTint(wrappedDrawable, colors);
return wrappedDrawable;
}