剖析源碼學自定義主題Theme

http://blog.csdn.net/dawanganban/article/details/17732701

還記得在Android菜鳥的成長筆記（3）中我們曾經遇到了一個問題嗎？"這個界面和真真的QQ界面還有點不同的就是上面的標題myFirstApp，怎麼去掉這個標題呢？"，當時我直接在AndroidMainfest.xml中添加了一個屬性：

android:theme="@android:style/Theme.NoTitleBar"

可能有的朋友就會迷惑了，爲什麼添加了這個屬性就可以了。這一篇文章將讓我們一起翻開Android系統源代碼來揭開困擾大家的關於主題使用以及自定義的謎團。

一、樣式（Style)與主題(Theme)

在Android的應用的資源文件中有一個style.xml文件，這個文件是幹什麼用的呢？我們有時候經常需要對某個類型的組件指定大致相似的格式，比如字體、顏色、背景色等，如果我們每次都爲某個View組件去重複指定這些屬性，這無疑會產生大量的工作，而且還不利於後期的代碼修改和維護。而Style就是一個樣式的格式，這個格式可以被多個View組件所使用，也可以說是一個樣式的集合類，被需要這一類樣式集合的View組件所使用。例如我們前面寫的QQ登錄界面中的登錄按鈕，我們可以給定義一個樣式

<style name="buttonStyle">
    <item name="android:background">@drawable/login_button_nor</item>
    <item name="android:textColor">@color/buttonTextColor</item>
</style>

在佈局文件中引入樣式

<Button
    android:layout_width="270dip"
    android:layout_height="40dip"
    android:text="@string/login_button"
    style="@style/buttonStyle"
    />

與樣式非常相似，主題資源的xml文件通常也放在/res/values目錄下，主題相當於整個應用或者某個Activity的樣式，換句話說主題是針對窗體級別或整個應用程序的樣式。與樣式比較，樣式是針對窗體內元素的樣式。主題的設置有兩種方式

（1）在AndroidMainfest.xml中爲Activity或者application指定主題

<application
    android:allowBackup="true"
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:theme="@android:style/Theme.NoTitleBar" >
    <activity
        android:name="com.example.myfirstapp.MainActivity"
        android:label="@string/app_name" >
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>

上面AndroidMainfest.xml代碼中給整個應用指定了一個主題，這個主題是沒有標題欄的系統主題。

（2）在Activity創建時調用 setTheme方法（必須在setContentView前面調用）來給某個Activity添加主題。

二、剖析主題（Theme）資源

我們先來創建一個工程名字爲helloworld，然後打開它的AndroiodMainfest.xml文件

<application
    android:allowBackup="true"
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:theme="@style/AppTheme" >
    <activity
        android:name="com.example.helloworld.MainActivity"
        android:label="@string/app_name" >
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>

可以看到我們在創建工程時，已經默認給我們的整個應用添加了一個主題

android:theme="@style/AppTheme"

打開我們資源文件res/values/下面的styles.xml文件，可以看到在樣式文件中有一個名字爲AppTheme的樣式，如下：

<resources>

    <!--
        Base application theme, dependent on API level. This theme is replaced
        by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
    -->
    <style name="AppBaseTheme" parent="android:Theme.Light">
        <!--
            Theme customizations available in newer API levels can go in
            res/values-vXX/styles.xml, while customizations related to
            backward-compatibility can go here.
        -->
    </style>

    <!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
    </style>

</resources>

我們可以看到，這個AppTheme的樣式繼承自上面的AppBaseTheme。而AppBaseTheme又繼承自系統的一個樣式Theme.Light，打開Android系統源代碼找到Theme.xml文件中的Theme.Light如下：

  <!-- Theme for a light background with dark text on top.  Set your activity
       to this theme if you would like such an appearance.  As with the
       default theme, you should try to assume little more than that the
       background will be a light color. -->
  <style name="Theme.Light">
      <item name="windowBackground">@drawable/screen_background_light</item>
      <item name="colorBackground">@android:color/background_light</item>
      <item name="colorForeground">@color/bright_foreground_light</item>
      <item name="colorForegroundInverse">@android:color/bright_foreground_light_inverse</item>

      <item name="textColorPrimary">@android:color/primary_text_light</item>
      <item name="textColorSecondary">@android:color/secondary_text_light</item>
      <item name="textColorTertiary">@android:color/tertiary_text_light</item>
      <item name="textColorPrimaryInverse">@android:color/primary_text_dark</item>
      <item name="textColorSecondaryInverse">@android:color/secondary_text_dark</item>
      <item name="textColorTertiaryInverse">@android:color/tertiary_text_dark</item>
      <item name="textColorPrimaryDisableOnly">@android:color/primary_text_light_disable_only</item>
      <item name="textColorPrimaryInverseDisableOnly">@android:color/primary_text_dark_disable_only</item>
      <item name="textColorPrimaryNoDisable">@android:color/primary_text_light_nodisable</item>
      <item name="textColorSecondaryNoDisable">@android:color/secondary_text_light_nodisable</item>
      <item name="textColorPrimaryInverseNoDisable">@android:color/primary_text_dark_nodisable</item>
      <item name="textColorSecondaryInverseNoDisable">@android:color/secondary_text_dark_nodisable</item>
      <item name="textColorHint">@android:color/hint_foreground_light</item>
      <item name="textColorHintInverse">@android:color/hint_foreground_dark</item>

      <item name="popupWindowStyle">@android:style/Widget.PopupWindow</item>

      <item name="textCheckMark">@android:drawable/indicator_check_mark_light</item>
      <item name="textCheckMarkInverse">@android:drawable/indicator_check_mark_dark</item>

      <item name="gestureOverlayViewStyle">@android:style/Widget.GestureOverlayView.White</item>
      <item name="expandableListViewStyle">@android:style/Widget.ExpandableListView.White</item>
      <item name="listViewStyle">@android:style/Widget.ListView.White</item>
      <item name="listDivider">@drawable/divider_horizontal_bright</item>
      <item name="listSeparatorTextViewStyle">@android:style/Widget.TextView.ListSeparator.White</item>

      <item name="progressBarStyle">@android:style/Widget.ProgressBar.Inverse</item>
<item name="progressBarStyleSmall">@android:style/Widget.ProgressBar.Small.Inverse</item>
<item name="progressBarStyleLarge">@android:style/Widget.ProgressBar.Large.Inverse</item>
<item name="progressBarStyleInverse">@android:style/Widget.ProgressBar</item>
<item name="progressBarStyleSmallInverse">@android:style/Widget.ProgressBar.Small</item>
<item name="progressBarStyleLargeInverse">@android:style/Widget.ProgressBar.Large</item>
  </style>

樣式的繼承有兩種方式，一種是上面看到的parent="",還有一種就是用”."的方式，上面的Theme.Light繼承自Theme。這兩種繼承有什麼區別呢？一個相當於咱們類之間的繼承extend,另一個相當於內部類，也可以使用外部類的屬性和方法。我們再來看看Theme.Light的父類Theme的樣式定義。

  <style name="Theme">

      <item name="colorForeground">@android:color/bright_foreground_dark</item>
      <item name="colorForegroundInverse">@android:color/bright_foreground_dark_inverse</item>
      <item name="colorBackground">@android:color/background_dark</item>
      <item name="colorBackgroundCacheHint">?android:attr/colorBackground</item>
      <item name="disabledAlpha">0.5</item>
      <item name="backgroundDimAmount">0.6</item>

      <!-- Text styles -->
      <item name="textAppearance">@android:style/TextAppearance</item>
      <item name="textAppearanceInverse">@android:style/TextAppearance.Inverse</item>

      <item name="textColorPrimary">@android:color/primary_text_dark</item>
      <item name="textColorSecondary">@android:color/secondary_text_dark</item>
      <item name="textColorTertiary">@android:color/tertiary_text_dark</item>
      <item name="textColorPrimaryInverse">@android:color/primary_text_light</item>
      <item name="textColorSecondaryInverse">@android:color/secondary_text_light</item>
      <item name="textColorTertiaryInverse">@android:color/tertiary_text_light</item>
      <item name="textColorPrimaryDisableOnly">@android:color/primary_text_dark_disable_only</item>
      <item name="textColorPrimaryInverseDisableOnly">@android:color/primary_text_light_disable_only</item>
      <item name="textColorPrimaryNoDisable">@android:color/primary_text_dark_nodisable</item>
      <item name="textColorSecondaryNoDisable">@android:color/secondary_text_dark_nodisable</item>
      <item name="textColorPrimaryInverseNoDisable">@android:color/primary_text_light_nodisable</item>
      <item name="textColorSecondaryInverseNoDisable">@android:color/secondary_text_light_nodisable</item>
      <item name="textColorHint">@android:color/hint_foreground_dark</item>
      <item name="textColorHintInverse">@android:color/hint_foreground_light</item>
      <item name="textColorSearchUrl">@android:color/search_url_text</item>

      <item name="textAppearanceLarge">@android:style/TextAppearance.Large</item>
      <item name="textAppearanceMedium">@android:style/TextAppearance.Medium</item>
      <item name="textAppearanceSmall">@android:style/TextAppearance.Small</item>
      <item name="textAppearanceLargeInverse">@android:style/TextAppearance.Large.Inverse</item>
      <item name="textAppearanceMediumInverse">@android:style/TextAppearance.Medium.Inverse</item>
      <item name="textAppearanceSmallInverse">@android:style/TextAppearance.Small.Inverse</item>
      <item name="textAppearanceSearchResultTitle">@android:style/TextAppearance.SearchResult.Title</item>
      <item name="textAppearanceSearchResultSubtitle">@android:style/TextAppearance.SearchResult.Subtitle</item>

      <item name="textAppearanceButton">@android:style/TextAppearance.Widget.Button</item>

      <item name="candidatesTextStyleSpans">@android:string/candidates_style</item>

      <item name="textCheckMark">@android:drawable/indicator_check_mark_dark</item>
      <item name="textCheckMarkInverse">@android:drawable/indicator_check_mark_light</item>

      <!-- Button styles -->
      <item name="buttonStyle">@android:style/Widget.Button</item>

      <item name="buttonStyleSmall">@android:style/Widget.Button.Small</item>
      <item name="buttonStyleInset">@android:style/Widget.Button.Inset</item>

      <item name="buttonStyleToggle">@android:style/Widget.Button.Toggle</item>

      <!-- List attributes -->
      <item name="listPreferredItemHeight">64dip</item>
      <!-- @hide -->
      <item name="searchResultListItemHeight">58dip</item>
      <item name="listDivider">@drawable/divider_horizontal_dark</item>
      <item name="listSeparatorTextViewStyle">@android:style/Widget.TextView.ListSeparator</item>

<item name="listChoiceIndicatorSingle">@android:drawable/btn_radio</item>
    <item name="listChoiceIndicatorMultiple">@android:drawable/btn_check</item>

      <item name="expandableListPreferredItemPaddingLeft">40dip</item>
      <item name="expandableListPreferredChildPaddingLeft">
              ?android:attr/expandableListPreferredItemPaddingLeft</item>

      <item name="expandableListPreferredItemIndicatorLeft">3dip</item>
      <item name="expandableListPreferredItemIndicatorRight">33dip</item>
      <item name="expandableListPreferredChildIndicatorLeft">
              ?android:attr/expandableListPreferredItemIndicatorLeft</item>
      <item name="expandableListPreferredChildIndicatorRight">
              ?android:attr/expandableListPreferredItemIndicatorRight</item>

      <!-- Gallery attributes -->
      <item name="galleryItemBackground">@android:drawable/gallery_item_background</item>

      <!-- Window attributes -->
      <item name="windowBackground">@android:drawable/screen_background_dark</item>
      <item name="windowFrame">@null</item>
      <item name="windowNoTitle">false</item>
      <item name="windowFullscreen">false</item>
      <item name="windowIsFloating">false</item>
      <item name="windowContentOverlay">@android:drawable/title_bar_shadow</item>
      <item name="windowShowWallpaper">false</item>
      <item name="windowTitleStyle">@android:style/WindowTitle</item>
      <item name="windowTitleSize">25dip</item>
      <item name="windowTitleBackgroundStyle">@android:style/WindowTitleBackground</item>
      <item name="android:windowAnimationStyle">@android:style/Animation.Activity</item>
      <item name="android:windowSoftInputMode">stateUnspecified|adjustUnspecified</item>

      <!-- Dialog attributes -->
      <item name="alertDialogStyle">@android:style/AlertDialog</item>

      <!-- Panel attributes -->
      <item name="panelBackground">@android:drawable/menu_background</item>
      <item name="panelFullBackground">@android:drawable/menu_background_fill_parent_width</item>
      <!-- These three attributes do not seems to be used by the framework. Declared public though -->
      <item name="panelColorBackground">#000</item>
      <item name="panelColorForeground">?android:attr/textColorPrimary</item>
      <item name="panelTextAppearance">?android:attr/textAppearance</item>

      <!-- Scrollbar attributes -->
      <item name="scrollbarFadeDuration">250</item>
      <item name="scrollbarDefaultDelayBeforeFade">300</item>
      <item name="scrollbarSize">10dip</item>
      <item name="scrollbarThumbHorizontal">@android:drawable/scrollbar_handle_horizontal</item>
      <item name="scrollbarThumbVertical">@android:drawable/scrollbar_handle_vertical</item>
      <item name="scrollbarTrackHorizontal">@null</item>
      <item name="scrollbarTrackVertical">@null</item>

      <!-- Text selection handle attributes -->
      <item name="textSelectHandleLeft">@android:drawable/text_select_handle_left</item>
      <item name="textSelectHandleRight">@android:drawable/text_select_handle_right</item>
      <item name="textSelectHandle">@android:drawable/text_select_handle_middle</item>
      <item name="textSelectHandleWindowStyle">@android:style/Widget.TextSelectHandle</item>

      <!-- Widget styles -->
      <item name="absListViewStyle">@android:style/Widget.AbsListView</item>
      <item name="autoCompleteTextViewStyle">@android:style/Widget.AutoCompleteTextView</item>
      <item name="checkboxStyle">@android:style/Widget.CompoundButton.CheckBox</item>
      <item name="dropDownListViewStyle">@android:style/Widget.ListView.DropDown</item>
      <item name="editTextStyle">@android:style/Widget.EditText</item>
      <item name="expandableListViewStyle">@android:style/Widget.ExpandableListView</item>
      <item name="expandableListViewWhiteStyle">@android:style/Widget.ExpandableListView.White</item>
      <item name="galleryStyle">@android:style/Widget.Gallery</item>
      <item name="gestureOverlayViewStyle">@android:style/Widget.GestureOverlayView</item>
      <item name="gridViewStyle">@android:style/Widget.GridView</item>
      <item name="imageButtonStyle">@android:style/Widget.ImageButton</item>
      <item name="imageWellStyle">@android:style/Widget.ImageWell</item>
      <item name="listViewStyle">@android:style/Widget.ListView</item>
      <item name="listViewWhiteStyle">@android:style/Widget.ListView.White</item>
      <item name="popupWindowStyle">@android:style/Widget.PopupWindow</item>
      <item name="progressBarStyle">@android:style/Widget.ProgressBar</item>
      <item name="progressBarStyleHorizontal">@android:style/Widget.ProgressBar.Horizontal</item>
      <item name="progressBarStyleSmall">@android:style/Widget.ProgressBar.Small</item>
      <item name="progressBarStyleSmallTitle">@android:style/Widget.ProgressBar.Small.Title</item>
      <item name="progressBarStyleLarge">@android:style/Widget.ProgressBar.Large</item>
      <item name="progressBarStyleInverse">@android:style/Widget.ProgressBar.Inverse</item>
<item name="progressBarStyleSmallInverse">@android:style/Widget.ProgressBar.Small.Inverse</item>
   <item name="progressBarStyleLargeInverse">@android:style/Widget.ProgressBar.Large.Inverse</item>
      <item name="seekBarStyle">@android:style/Widget.SeekBar</item>
      <item name="ratingBarStyle">@android:style/Widget.RatingBar</item>
      <item name="ratingBarStyleIndicator">@android:style/Widget.RatingBar.Indicator</item>
      <item name="ratingBarStyleSmall">@android:style/Widget.RatingBar.Small</item>
      <item name="radioButtonStyle">@android:style/Widget.CompoundButton.RadioButton</item>
      <item name="scrollViewStyle">@android:style/Widget.ScrollView</item>
      <item name="horizontalScrollViewStyle">@android:style/Widget.HorizontalScrollView</item>
      <item name="spinnerStyle">@android:style/Widget.Spinner</item>
      <item name="starStyle">@android:style/Widget.CompoundButton.Star</item>
      <item name="tabWidgetStyle">@android:style/Widget.TabWidget</item>
      <item name="textViewStyle">@android:style/Widget.TextView</item>
      <item name="webTextViewStyle">@android:style/Widget.WebTextView</item>
      <item name="webViewStyle">@android:style/Widget.WebView</item>
      <item name="dropDownItemStyle">@android:style/Widget.DropDownItem</item>
      <item name="spinnerDropDownItemStyle">@android:style/Widget.DropDownItem.Spinner</item>
      <item name="spinnerItemStyle">@android:style/Widget.TextView.SpinnerItem</item>
      <item name="dropDownHintAppearance">@android:style/TextAppearance.Widget.DropDownHint</item>
      <item name="keyboardViewStyle">@android:style/Widget.KeyboardView</item>
      <item name="quickContactBadgeStyleWindowSmall">@android:style/Widget.QuickContactBadge.WindowSmall</item>
      <item name="quickContactBadgeStyleWindowMedium">@android:style/Widget.QuickContactBadge.WindowMedium</item>
      <item name="quickContactBadgeStyleWindowLarge">@android:style/Widget.QuickContactBadge.WindowLarge</item>
      <item name="quickContactBadgeStyleSmallWindowSmall">@android:style/Widget.QuickContactBadgeSmall.WindowSmall</item>
      <item name="quickContactBadgeStyleSmallWindowMedium">@android:style/Widget.QuickContactBadgeSmall.WindowMedium</item>
      <item name="quickContactBadgeStyleSmallWindowLarge">@android:style/Widget.QuickContactBadgeSmall.WindowLarge</item>

      <!-- Preference styles -->
      <item name="preferenceScreenStyle">@android:style/Preference.PreferenceScreen</item>
      <item name="preferenceCategoryStyle">@android:style/Preference.Category</item>
      <item name="preferenceStyle">@android:style/Preference</item>
      <item name="preferenceInformationStyle">@android:style/Preference.Information</item>
      <item name="checkBoxPreferenceStyle">@android:style/Preference.CheckBoxPreference</item>
      <item name="yesNoPreferenceStyle">@android:style/Preference.DialogPreference.YesNoPreference</item>
      <item name="dialogPreferenceStyle">@android:style/Preference.DialogPreference</item>
      <item name="editTextPreferenceStyle">@android:style/Preference.DialogPreference.EditTextPreference</item>
      <item name="ringtonePreferenceStyle">@android:style/Preference.RingtonePreference</item>
      <item name="preferenceLayoutChild">@android:layout/preference_child</item>

      <!-- Search widget styles -->
      <item name="searchWidgetCorpusItemBackground">@android:color/search_widget_corpus_item_background</item>
  </style>

我們可以看到裏面定義了關於我們整個應用中文字的樣式，按鈕的樣式，列表的樣式，畫廊的樣式，窗體的樣式，對話框的樣式等。這個樣式是系統的默認樣式，也是最符合HOLO的樣式。Theme中定義的是最基本的主題樣式，Theme的樣式擴展樣式有我們上面的Theme.Light還有Theme.NoTitleBar、Theme.NoTitleBar.Fullscreen、Theme.Light.NoTitleBar、Theme.Light.NoTitleBar.Fullscreen、Theme.Black、......

三、自定義主題

有了上面對Theme的瞭解之後，下面我們通過改變標題欄來自定義主題樣式，首先繼承Theme，標題欄是與窗體樣式（Window attributes）相關的樣式，我們在Theme.xml中找到這幾句代碼.

<!-- Window attributes -->
       <item name="windowBackground">@android:drawable/screen_background_dark</item>
       <item name="windowFrame">@null</item>
       <item name="windowNoTitle">false</item>
       <item name="windowFullscreen">false</item>
       <item name="windowIsFloating">false</item>
       <item name="windowContentOverlay">@android:drawable/title_bar_shadow</item>
       <item name="windowShowWallpaper">false</item>
       <item name="windowTitleStyle">@android:style/WindowTitle</item>
       <item name="windowTitleSize">25dip</item>
       <item name="windowTitleBackgroundStyle">@android:style/WindowTitleBackground</item>
       <item name="android:windowAnimationStyle">@android:style/Animation.Activity</item>
       <item name="android:windowSoftInputMode">stateUnspecified|adjustUnspecified</item>

將上面主題中Title的大小和背景覆蓋

<!-- 自定義的主題樣式 -->
<style name="myTheme" parent="android:Theme">
    <item name="android:windowTitleBackgroundStyle">@style/myThemeStyle</item>
    <item name="android:windowTitleSize">50dip</item>
</style>

<!-- 主題中Title的背景樣式 -->
<style name="myThemeStyle">
    <item name="android:background">#FF0000</item>
</style>

默認主題樣式

自定義主題樣式

如果有的朋友還想改變整個應用的字體、或者風格都可以通過繼承Theme覆蓋原有的樣式來達到自定義的效果。