自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

談?wù)凙ndroid Material Design 中的Tint

移動(dòng)開發(fā) Android
當(dāng)我開始接觸Tint這個(gè)詞的時(shí)候,其實(shí)是蠻不理解它的意思的,以及并不清楚Google發(fā)明它的目的,它一般搭配Background配合使用,但是現(xiàn)在已經(jīng)有了Background,為什么還需要Tint呢?

什么是Tint

當(dāng)我開始接觸Tint這個(gè)詞的時(shí)候,其實(shí)是蠻不理解它的意思的,以及并不清楚Google發(fā)明它的目的,它一般搭配Background配合使用,但是現(xiàn)在已經(jīng)有了Background,為什么還需要Tint呢?

Tint 翻譯為著色。

著色,著什么色呢?和背景有關(guān),當(dāng)然是著背景的色。當(dāng)我開發(fā)客戶端,使用了appcompat-v7包的時(shí)候,為了實(shí)現(xiàn)Material Design的效果,我們會(huì)去設(shè)置主題里的幾個(gè)顏色,重要的比如primaryColor,colorControlNormal,colorControlActived 等等,而我們使用的一些組件,比如EditText就會(huì)自動(dòng)變成我們想要的背景顏色,在背景圖只有一張的情況下,這樣的做法極大的減少了我們apk包的大小。

實(shí)現(xiàn)的方式就是用一個(gè)顏色為我們的背景圖片設(shè)置tint(著色)。
例子:

 

看看即將發(fā)布的SegmentFault for Android 2.7中,發(fā)布問題功能,這個(gè)EditText的顏色和我們的主要顏色相同。它利用了TintManager這個(gè)類,為自己的背景進(jìn)行著色(綠色)。
那么這個(gè)原始圖是什么樣子呢?我們從appcompat-v7包中找到了這個(gè)圖,是一個(gè).9圖,樣子如下:


其實(shí)它只是一個(gè)黑色的條,通過綠色的著色,變成了一個(gè)綠色的條。 就是這樣的設(shè)計(jì)方式,使得我們?cè)贛aterial Design中省了多少資源文件呀!

好了,既然理解了tint的含義,我們趕緊看下這一切是如何實(shí)現(xiàn)的吧。
其實(shí)底層特別簡單,了解過渲染的同學(xué)應(yīng)該知道PorterDuffColorFilter這個(gè)東西,我們使用SRC_IN的方式,對(duì)這個(gè)Drawable進(jìn)行顏色方面的渲染,就是在這個(gè)Drawable中有像素點(diǎn)的地方,再用我們的過濾器著色一次。
實(shí)際上如果要我們自己實(shí)現(xiàn),只用獲取View的backgroundDrawable之后,設(shè)置下colorFilter即可。

看下最核心的代碼就這么幾行

 

  1. if (filter == null) { 
  2. // Cache miss, so create a color filter and add it to the cache 
  3. filter = new PorterDuffColorFilter(color, mode); 
  4.  
  5. d.setColorFilter(filter); 

 

通常情況下,我們的mode一般都是SRC_IN,如果想了解這個(gè)屬性相關(guān)的資料,這里是傳送門: http://blog.csdn.net/t12x3456/article/details/10432935 (中文)

由于API Level 21以前不支持background tint在xml中設(shè)置,于是提供了ViewCompat.setBackgroundTintList方法和ViewCompat.setBackgroundTintMode用來手動(dòng)更改需要著色的顏色,但要求相關(guān)的View繼承TintableBackgroundView接口。
源碼解析

看下源碼是如何實(shí)現(xiàn)的吧,我們以AppCompatEditText為例:
看下構(gòu)造函數(shù)(省略無關(guān)代碼)

 

  1. public AppCompatEditText(Context context, AttributeSet attrs, int defStyleAttr) { 
  2. super(TintContextWrapper.wrap(context), attrs, defStyleAttr); 
  3.  
  4. ... 
  5.  
  6. ColorStateList tint = a.getTintManager().getTintList(a.getResourceId(0, -1)); //根據(jù)背景的resource id獲取內(nèi)置的著色顏色。 
  7. if (tint != null) { 
  8. setInternalBackgroundTint(tint); //設(shè)置著色 
  9.  
  10. ... 
  11.  
  12. private void setInternalBackgroundTint(ColorStateList tint) { 
  13. if (tint != null) { 
  14. if (mInternalBackgroundTint == null) { 
  15. mInternalBackgroundTint = new TintInfo(); 
  16. mInternalBackgroundTint.mTintList = tint; 
  17. mInternalBackgroundTint.mHasTintList = true
  18. else { 
  19. mInternalBackgroundTint = null
  20. //上面的代碼是記錄tint相關(guān)的信息。 
  21. applySupportBackgroundTint(); //對(duì)背景應(yīng)用tint 
  22.  
  23.  
  24. private void applySupportBackgroundTint() { 
  25. if (getBackground() != null) { 
  26. if (mBackgroundTint != null) { 
  27. TintManager.tintViewBackground(this, mBackgroundTint); 
  28. else if (mInternalBackgroundTint != null) { 
  29. TintManager.tintViewBackground(this, mInternalBackgroundTint); //最重要的,對(duì)tint進(jìn)行應(yīng)用 
  30.  
  31. 然后我們進(jìn)入tintViewBackground看下TintManager里面的源碼 
  32.  
  33. public static void tintViewBackground(View view, TintInfo tint) { 
  34. final Drawable background = view.getBackground(); 
  35. if (tint.mHasTintList) { 
  36. //如果設(shè)置了tint的話,對(duì)背景設(shè)置PorterDuffColorFilter 
  37. setPorterDuffColorFilter( 
  38. background, 
  39. tint.mTintList.getColorForState(view.getDrawableState(), 
  40. tint.mTintList.getDefaultColor()), 
  41. tint.mHasTintMode ? tint.mTintMode : null); 
  42. else { 
  43. background.clearColorFilter(); 
  44.  
  45. if (Build.VERSION.SDK_INT <= 10) { 
  46. // On Gingerbread, GradientDrawable does not invalidate itself when it's ColorFilter 
  47. // has changed, so we need to force an invalidation 
  48. view.invalidate(); 
  49.  
  50.  
  51. private static void setPorterDuffColorFilter(Drawable d, int color, PorterDuff.Mode mode) { 
  52. if (mode == null) { 
  53. // If we don't have a blending mode specified, use our default 
  54. mode = DEFAULT_MODE; 
  55.  
  56. // First, lets see if the cache already contains the color filter 
  57. PorterDuffColorFilter filter = COLOR_FILTER_CACHE.get(color, mode); 
  58.  
  59. if (filter == null) { 
  60. // Cache miss, so create a color filter and add it to the cache 
  61. filter = new PorterDuffColorFilter(color, mode); 
  62. COLOR_FILTER_CACHE.put(color, mode, filter); 
  63.  
  64. // 最最重要,原來是對(duì)background drawable設(shè)置了colorFilter 完成了我們要的功能。 
  65. d.setColorFilter(filter); 

 

以上是對(duì)API21以下的兼容。
如果我們要實(shí)現(xiàn)自己的AppCompat組件實(shí)現(xiàn)tint的一些特性的話,我們就可以指定好ColorStateList,利用TintManager對(duì)自己的背景進(jìn)行著色,當(dāng)然需要對(duì)外開放設(shè)置的接口的話,我們還要實(shí)現(xiàn)TintableBackgroundView接口,然后用ViewCompat.setBackgroundTintList進(jìn)行設(shè)置,這樣能完成對(duì)v7以上所有版本的兼容。
實(shí)例

比如我現(xiàn)在要對(duì)一個(gè)自定義組件實(shí)現(xiàn)對(duì)Tint的支持,其實(shí)只用繼承下,加一些代碼就好了,代碼如下(幾乎通用):

 

  1. public class AppCompatFlowLayout extends FlowLayout implements TintableBackgroundView { 
  2.  
  3. private static final int[] TINT_ATTRS = { 
  4. android.R.attr.background 
  5. }; 
  6.  
  7. private TintInfo mInternalBackgroundTint; 
  8. private TintInfo mBackgroundTint; 
  9. private TintManager mTintManager; 
  10.  
  11. public AppCompatFlowLayout(Context context) { 
  12. this(context, null); 
  13.  
  14. public AppCompatFlowLayout(Context context, AttributeSet attributeSet) { 
  15. this(context, attributeSet, 0); 
  16.  
  17. public AppCompatFlowLayout(Context context, AttributeSet attributeSet, int defStyle) { 
  18. super(context, attributeSet, defStyle); 
  19.  
  20. if (TintManager.SHOULD_BE_USED) { 
  21. TintTypedArray a = TintTypedArray.obtainStyledAttributes(getContext(), attributeSet, 
  22. TINT_ATTRS, defStyle, 0); 
  23. if (a.hasValue(0)) { 
  24. ColorStateList tint = a.getTintManager().getTintList(a.getResourceId(0, -1)); 
  25. if (tint != null) { 
  26. setInternalBackgroundTint(tint); 

 

責(zé)任編輯:chenqingxiang 來源: Gemini @ SegmentFault
相關(guān)推薦

2017-02-14 13:35:15

AndroidMaterial De動(dòng)畫

2014-08-07 14:19:46

Material DeGoogle

2014-08-21 15:29:29

Material De概述

2014-12-08 14:35:51

Material De真實(shí)動(dòng)作

2014-12-08 13:40:10

Material De色彩

2015-07-21 15:02:37

設(shè)計(jì)扁平

2014-12-08 15:03:17

Material De圖像

2017-02-20 16:03:35

Android We谷歌硬件

2014-09-10 10:35:11

Material De設(shè)計(jì)原則

2014-10-21 15:26:37

Material DeAndroid應(yīng)用

2014-12-08 14:15:48

Material De字體排版

2014-08-19 16:10:05

Material DeUI設(shè)計(jì)趨勢(shì)

2014-08-21 15:40:53

Material De真實(shí)動(dòng)作

2014-07-22 10:44:21

Material De

2014-10-27 14:18:06

Material De交互響應(yīng)

2018-04-25 09:06:32

Chrome瀏覽器語言

2022-01-20 20:08:38

MaterialpalettesMaterial 3

2017-01-11 19:15:55

Android著色器Tint

2014-08-11 11:19:19

Material De

2014-07-02 10:26:52

Material DeGoogle
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)