首页 > 代码库 > 从源码中浅析Android中如何利用attrs和styles定义控件

从源码中浅析Android中如何利用attrs和styles定义控件

一直有个问题就是,Android中是如何通过布局文件,就能实现控件效果的不同呢?比如在布局文件中,我设置了一个TextView,给它设置了textColor,它就能够改变这个TextView的文本的颜色。这是如何做到的呢?我们分3个部分来看这个问题1.attrs.xml  2.styles.xml  3.看组件的源码。

1.attrs.xml:

 我们知道Android的源码中有attrs.xml这个文件,这个文件实际上定义了所有的控件的属性,就是我们在布局文件中设置的各类属性

你可以找到attrs.xml这个文件,打开它,全选,右键->Show In->OutLine。可以看到整个文件的解构

下面是两个截图:

 

 

我们大概可以看出里面是Android中的各种属性的声明,比如textStyle这个属性是这样定义的:

1 <!-- Default text typeface style. -->2     <attr name="textStyle">3         <flag name="normal" value="http://www.mamicode.com/0" />4         <flag name="bold" value="http://www.mamicode.com/1" />5         <flag name="italic" value="http://www.mamicode.com/2" />6     </attr>

那么现在你知道,我们在写android:textStyle的时候为什么会出现normal,bold和italic这3个东西了吧,就是定义在这个地方。

再看看textColor:

1 <!-- Color of text (usually same as colorForeground). -->2     <attr name="textColor" format="reference|color" />

 format的意思是说:这个textColor可以以两种方式设置,要么是关联一个值,要么是直接设置一个颜色的RGB值,这个不难理解,因为我们可以平时也这样做过。

 

也就是说我们平时在布局文件中所使用的各类控件的属性都定义在这里面,那么这个文件,除了定义这些属性外还定义了各种具体的组件,比如TextView,Button,SeekBar等所具有的各种特有的属性

比如SeekBar:

1 <declare-styleable name="SeekBar">2         <!-- Draws the thumb on a seekbar. -->3         <attr name="thumb" format="reference" />4         <!-- An offset for the thumb that allows it to extend out of the range of the track. -->5         <attr name="thumbOffset" format="dimension" />6     </declare-styleable>

也许你会问SeekBar的background,等属性怎么没有看到?这是因为Android中几乎所有的组件都是从View中继承下来的,SeekBar自然也不例外,而background这个属性几乎每个控件都有,因此被定义到了View中,你可以在declare-styleable:View中找到它。 

 

总结下,也就是说attrs.xml这个文件定义了布局文件中的各种属性attr:***,以及每种控件特有的属性declare-styleable:***

 

2.styles.xml:

刚才的attrs.xml定义的是组件的属性,现在要说的style则是针对这些属性所设置的值,一些默认的值。

 

 

 

这个是SeekBar的样式,我们可以看到,这里面设置了一个SeekBar的默认的样式,即为attrs.xml文件中的各种属性设置初始值

 1 <style name="Widget.SeekBar"> 2         <item name="android:indeterminateOnly">false</item> 3         <item name="android:progressDrawable">@android:drawable/progress_horizontal</item> 4         <item name="android:indeterminateDrawable">@android:drawable/progress_horizontal</item> 5         <item name="android:minHeight">20dip</item> 6         <item name="android:maxHeight">20dip</item> 7         <item name="android:thumb">@android:drawable/seek_thumb</item> 8         <item name="android:thumbOffset">8dip</item> 9         <item name="android:focusable">true</item>10     </style>

这个是Button的样式:

1 <style name="Widget.Button">2         <item name="android:background">@android:drawable/btn_default</item>3         <item name="android:focusable">true</item>4         <item name="android:clickable">true</item>5         <item name="android:textAppearance">?android:attr/textAppearanceSmallInverse</item>6         <item name="android:textColor">@android:color/primary_text_light</item>7         <item name="android:gravity">center_vertical|center_horizontal</item>8     </style>

有了属性和值,但是这些东西是如何关联到一起的呢?它们如何被android的framework层所识别呢?

 

3.组件的源码

我们看下TextView的源码:

  1 public TextView(Context context) {  2         this(context, null);  3     }//这个构造器用来给用户调用,比如new TextView(this);  4   5     public TextView(Context context,  6                     AttributeSet attrs) {  7         this(context, attrs, com.android.internal.R.attr.textViewStyle);  8     }  9  10     public TextView(Context context, 11                     AttributeSet attrs, 12                     int defStyle) { 13         super(context, attrs, defStyle);//为用户自定义的TextView设置默认的style 14         mText = ""; 15  16         //设置画笔 17         mTextPaint = new TextPaint(Paint.ANTI_ALIAS_FLAG); 18         mTextPaint.density = getResources().getDisplayMetrics().density; 19         mTextPaint.setCompatibilityScaling( 20                 getResources().getCompatibilityInfo().applicationScale); 21         22         mHighlightPaint = new Paint(Paint.ANTI_ALIAS_FLAG); 23         mHighlightPaint.setCompatibilityScaling( 24                 getResources().getCompatibilityInfo().applicationScale); 25  26         mMovement = getDefaultMovementMethod(); 27         mTransformation = null; 28  29         //attrs中包含了这个TextView控件在布局文件中定义的属性,比如android:background,android:layout_width等 30         //com.android.internal.R.styleable.TextView中包含了TextView中的针对attrs中的属性的默认的值 31         //也就是说这个地方能够将布局文件中设置的属性获取出来,保存到一个TypeArray中,为这个控件初始化各个属性 32         TypedArray a = 33             context.obtainStyledAttributes( 34                 attrs, com.android.internal.R.styleable.TextView, defStyle, 0); 35  36         int textColorHighlight = 0; 37         ColorStateList textColor = null; 38         ColorStateList textColorHint = null; 39         ColorStateList textColorLink = null; 40         int textSize = 15; 41         int typefaceIndex = -1; 42         int styleIndex = -1; 43  44         /* 45          * Look the appearance up without checking first if it exists because 46          * almost every TextView has one and it greatly simplifies the logic 47          * to be able to parse the appearance first and then let specific tags 48          * for this View override it. 49          */ 50         TypedArray appearance = null; 51         //TextView_textAppearance不太了解为什么要这样做?难道是为了设置TextView的一些默认的属性? 52         int ap = a.getResourceId(com.android.internal.R.styleable.TextView_textAppearance, -1); 53         if (ap != -1) { 54             appearance = context.obtainStyledAttributes(ap, 55                                 com.android.internal.R.styleable. 56                                 TextAppearance); 57         } 58         if (appearance != null) { 59             int n = appearance.getIndexCount(); 60             for (int i = 0; i < n; i++) { 61                 int attr = appearance.getIndex(i); 62  63                 switch (attr) { 64                 case com.android.internal.R.styleable.TextAppearance_textColorHighlight: 65                     textColorHighlight = appearance.getColor(attr, textColorHighlight); 66                     break; 67  68                 case com.android.internal.R.styleable.TextAppearance_textColor: 69                     textColor = appearance.getColorStateList(attr); 70                     break; 71  72                 case com.android.internal.R.styleable.TextAppearance_textColorHint: 73                     textColorHint = appearance.getColorStateList(attr); 74                     break; 75  76                 case com.android.internal.R.styleable.TextAppearance_textColorLink: 77                     textColorLink = appearance.getColorStateList(attr); 78                     break; 79  80                 case com.android.internal.R.styleable.TextAppearance_textSize: 81                     textSize = appearance.getDimensionPixelSize(attr, textSize); 82                     break; 83  84                 case com.android.internal.R.styleable.TextAppearance_typeface: 85                     typefaceIndex = appearance.getInt(attr, -1); 86                     break; 87  88                 case com.android.internal.R.styleable.TextAppearance_textStyle: 89                     styleIndex = appearance.getInt(attr, -1); 90                     break; 91                 } 92             } 93  94             appearance.recycle(); 95         } 96         //各类属性 97  boolean editable = getDefaultEditable(); 98         CharSequence inputMethod = null; 99         int numeric = 0;100         CharSequence digits = null;101         boolean phone = false;102         boolean autotext = false;103         int autocap = -1;104         int buffertype = 0;105         boolean selectallonfocus = false;106         Drawable drawableLeft = null, drawableTop = null, drawableRight = null,107             drawableBottom = null;108         int drawablePadding = 0;109         int ellipsize = -1;110         boolean singleLine = false;111         int maxlength = -1;112         CharSequence text = "";113         CharSequence hint = null;114         int shadowcolor = 0;115         float dx = 0, dy = 0, r = 0;116         boolean password = false;117         int inputType = EditorInfo.TYPE_NULL;118 119         int n = a.getIndexCount();120         for (int i = 0; i < n; i++) {121             int attr = a.getIndex(i);122             //通过switch语句将用户设置的,以及默认的属性读取出来并初始化123             switch (attr) {124             case com.android.internal.R.styleable.TextView_editable:125                 editable = a.getBoolean(attr, editable);126                 break;127 128             case com.android.internal.R.styleable.TextView_inputMethod:129                 inputMethod = a.getText(attr);130                 break;131 132             case com.android.internal.R.styleable.TextView_numeric:133                 numeric = a.getInt(attr, numeric);134                 break;135 136            //更多的case语句...137 138            case com.android.internal.R.styleable.TextView_textSize:139                 textSize = a.getDimensionPixelSize(attr, textSize);//设置当前用户所设置的字体大小140                 break;141 142             case com.android.internal.R.styleable.TextView_typeface:143                 typefaceIndex = a.getInt(attr, typefaceIndex);144                 break;145            //更多的case语句...146 }

通过上面的代码大概可以知道,每个组件基本都有3个构造器,其中只传递一个Context上下文的那个构造器一般用来在java代码中实例化使用。

比如你可以

TextView tv = new TextView(context);

来实例化一个组件。

 

最终调用的是第3个构造器

1 public TextView(Context context,2                     AttributeSet attrs,3                     int defStyle)

 在这个构造器中为你设置了默认的属性attrs和值styles。关键不在这里,而是后面通过使用下面的代码

1 TypedArray a =2             context.obtainStyledAttributes(3                 attrs, com.android.internal.R.styleable.TextView, defStyle, 0);

 来将属性和值获取出来,放到一个TypeArray中,然后再利用一个switch语句将里面的值取出来。再利用这些值来初始化各个属性。这个View最终利用这些属性将这个控件绘制出来。

如果你在布局文件中定义的一个View的话,那么你定义的值,会被传递给构造器中的attrs和styles。也是利用同样的方式来获取出你定义的值,并根据你定义的值来绘制你想要的控件。

再比如其实Button和EditText都是继承自TextView。看上去两个控件似乎差异很大,其实不然。Button的源码其实相比TextView变化的只是style而已:

 1 public class Button extends TextView { 2     public Button(Context context) { 3         this(context, null); 4     } 5  6     public Button(Context context, AttributeSet attrs) { 7         this(context, attrs, com.android.internal.R.attr.buttonStyle); 8     } 9 10     public Button(Context context, AttributeSet attrs, int defStyle) {11         super(context, attrs, defStyle);12     }13 }

 再看看EditText:

 1 public class EditText extends TextView { 2     public EditText(Context context) { 3         this(context, null); 4     } 5  6     public EditText(Context context, AttributeSet attrs) { 7         this(context, attrs, com.android.internal.R.attr.editTextStyle); 8     } 9 10     public EditText(Context context, AttributeSet attrs, int defStyle) {11         super(context, attrs, defStyle);12     }13 14     @Override15     protected boolean getDefaultEditable() {16         return true;17     }18 19     @Override20     protected MovementMethod getDefaultMovementMethod() {21         return ArrowKeyMovementMethod.getInstance();22     }23 24     @Override25     public Editable getText() {26         return (Editable) super.getText();27     }28 29     @Override30     public void setText(CharSequence text, BufferType type) {31         super.setText(text, BufferType.EDITABLE);32     }33 34     /**35      * Convenience for {@link Selection#setSelection(Spannable, int, int)}.36      */37     public void setSelection(int start, int stop) {38         Selection.setSelection(getText(), start, stop);39     }40 41     /**42      * Convenience for {@link Selection#setSelection(Spannable, int)}.43      */44     public void setSelection(int index) {45         Selection.setSelection(getText(), index);46     }47 48     /**49      * Convenience for {@link Selection#selectAll}.50      */51     public void selectAll() {52         Selection.selectAll(getText());53     }54 55     /**56      * Convenience for {@link Selection#extendSelection}.57      */58     public void extendSelection(int index) {59         Selection.extendSelection(getText(), index);60     }61 62     @Override63     public void setEllipsize(TextUtils.TruncateAt ellipsis) {64         if (ellipsis == TextUtils.TruncateAt.MARQUEE) {65             throw new IllegalArgumentException("EditText cannot use the ellipsize mode "66                     + "TextUtils.TruncateAt.MARQUEE");67         }68         super.setEllipsize(ellipsis);69     }70 }

 不知道你是不是和我一样感到意外呢?

 

不得不说这种方式非常的好。最大程度地利用了继承,并且可以让控件之间的属性可以很方便的被开发者使用。也利用以后的扩展,实际上,不同的style就可以得到不同的UI,这也是MVC的一种体现。

比如用户想自定义某个控件,只要覆盖父类的style就可以很轻松的实现,可以参考我的一篇博文,就是使用style自定义ProgressBar。

Android中的主题theme也是使用的style。当用户在Activity中设置一个style的时候那么会影响到整个Activity,如果为Application设置style的话,则会影响所有的Activity,所以,如果你在开发一个应用的时候

可以考虑将应用的Activity的背景颜色等一类的属性放到一个style中去,在Application中调用,这种做法会比较方便。

themes.xml:

 1 <!-- Variant of the default (dark) theme with no title bar --> 2     <style name="Theme.NoTitleBar"> 3         <item name="android:windowNoTitle">true</item> 4     </style> 5      6     <!-- Variant of the default (dark) theme that has no title bar and 7          fills the entire screen --> 8     <style name="Theme.NoTitleBar.Fullscreen"> 9         <item name="android:windowFullscreen">true</item>10         <item name="android:windowContentOverlay">@null</item>11     </style>

 我们平时使用的主题实际上就定义在这个文件中。也是一个style。