Android中使用styles

在项目开发中经常遇到这样的问题，在很多的Activity中都会有标题栏，而这个标题栏通常拥有类似的效果，比如下面的截图所示。那么你需要统一控制标题栏中的文字的大小，字体的颜色等等。方便修改和维护。

 

 

1.在res/values/styles.xml 中为每个控件编写style：

<resources xmlns:android="http://schemas.android.com/apk/res/android">

    <!--
        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>

    <!-- 页面头部  返回按钮样式 -->
    <style name="header_button_back" parent="@android:style/TextAppearance.Widget.Button">
        <item name="android:textSize">@dimen/header_text_size</item>
        <item name="android:textColor">@color/header_button_text_color</item>
        <item name="android:layout_height">@dimen/header_button_height</item>
        <item name="android:layout_width">@dimen/header_button_back_width</item>
        <item name="android:background">@drawable/btn_back_selector</item>
        <item name="android:text">返回</item>
        <item name="android:layout_marginLeft">8dip</item>
        <item name="android:paddingLeft">8dp</item>
       <item name="android:layout_gravity">center</item> 
    </style>
    
    
    <!-- 页面头部  标题样式 -->
    <style name="header_text_view" parent="@android:style/TextAppearance.Widget.TextView">
        <item name="android:textSize">@dimen/header_title_text_size</item>
        <item name="android:textColor">@color/header_button_text_color</item>
        <item name="android:layout_height">@dimen/header_button_height</item>
        <item name="android:layout_width">0dp</item>
        <item name="android:layout_weight">1</item>
        <item name="android:gravity">center</item> 
        <item name="android:text">标题</item>
    </style> 
    
    
     <!-- 页面头部  操作按钮样式 -->
    <style name="header_button_operate" parent="@android:style/TextAppearance.Widget.Button">
       <item name="android:textSize">@dimen/header_text_size</item>
        <item name="android:textColor">@color/header_button_text_color</item>
        <item name="android:layout_height">@dimen/header_button_height</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_marginRight">5dp</item>
        <item name="android:layout_marginLeft">9dip</item>
        <item name="android:text">操作</item> 
        <item name="android:layout_gravity">center</item> 
    </style>
    
    
      <!-- 页面头部 容器样式 -->
    <style name="header_linear_layout"> 
        <item name="android:layout_width">fill_parent</item>
        <item name="android:layout_height">@dimen/header_height</item>
        <item name="android:background">@drawable/bg_navbar_no_line</item> 
        <item name="android:gravity">center</item> 
         
    </style> 

</resources>

 

2.在activity的布局文件中利用这些style：

 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <!-- HeadBar
    	 这样的话，你可以很容易地定义一个titlebar的样式，方便使用和统一修改。
    	 如果需要自定义可以在下面设置自己的属性，能够覆盖style中的属性，比如你可以设置layout_margin等等，能够覆盖style中的layout_margin
     -->

    <LinearLayout
        style="@style/header_linear_layout"
        android:layout_alignParentTop="true" >

        <Button
            android:id="@+id/btn_back"
            style="@style/header_button_back"
             />

        <TextView
            style="@style/header_text_view"
            android:text="我的个人中心" />

        <Button
            android:id="@+id/btn_operate"
            style="@style/header_button_operate"
            android:visibility="invisible" />
    </LinearLayout>

</RelativeLayout>

 

 

在你需要Titlebar的Activity的布局文件中使用上面的布局，就可以达到很方便控制所有控件属性的目的了。当然这也不妨碍你自定义某个控件的属性，因为你自定义的属性能够覆盖style中的属性。

 

 

上面style文件中用到的dimen这里也贴出来：res/values/dimens.xml

 

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <dimen name="header_height">50dip</dimen>
    <dimen name="header_button_height">50dip</dimen>
    <dimen name="header_text_size">16sp</dimen>
    <dimen name="header_title_text_size">22sp</dimen>
    <dimen name="header_button_back_width">60dp</dimen>
    <dimen name="header_tab_width">80dp</dimen>
    <dimen name="header_tab_group_width">162dp</dimen>

</resources>

 

同样的color:res/values/colors.xml :

 

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <color name="act_main_item_text_color">#505355</color>
    <color name="header_button_text_color">#e5e9ec</color>
    
</resources>

 

 

 

 

 

 

 

 

 

 

 

 

 

 

评论

2 楼 xy_feng_zhi_chao 2015-12-26  

多谢楼主分享

1 楼 wangchangbing 2014-02-26  

缺少2个资源 能否帮忙提供下 谢谢了！