自定义Android TabHost的背景及文字

在做Android开发时，默认的系统控件的UI风格跟应用的整体UI风格可能不搭配，这时就需要修改Android系统控件的UI样式，使之与应用协调。就拿TabHost控件为例，我们的应用整体颜色是红色，但Android的TabHost控件是灰色的，这时就需要对TabHost进行自定义。

默认TabHost样式

修改后的TabHost样式

修改TabHost样式很简单，下面就直接上代码。

    package com.sunchis.demo; 
     
    import android.app.Activity; 
    import android.os.Bundle; 
    import android.view.Gravity; 
    import android.view.Window; 
    import android.widget.RelativeLayout; 
    import android.widget.TabHost; 
    import android.widget.TabWidget; 
    import android.widget.TextView; 
    import android.widget.TabHost.OnTabChangeListener; 
     
    public class MainActivity extends Activity { 
        private TabHost tabHost; 
         
        @Override 
        public void onCreate(Bundle savedInstanceState) { 
            super.onCreate(savedInstanceState); 
            requestWindowFeature(Window.FEATURE_NO_TITLE);  // 设置无标题栏 
            setContentView(R.layout.tab_layt); 
             
            tabHost = (TabHost) findViewById(R.id.customer_tabhost); 
            tabHost.setup();    // 记得要用setup()方法来初始化TabHost 
             
            tabHost.addTab(tabHost.newTabSpec("tab_1").setIndicator("分类一").setContent(R.id.tab_1)); 
            tabHost.addTab(tabHost.newTabSpec("tab_2").setIndicator("分类二").setContent(R.id.tab_2)); 
             
            // 初始化设置一次标签背景 
            updateTabStyle(tabHost); 
             
            // 当某个Tab被选中时，则更新背景样式 
            tabHost.setOnTabChangedListener(new OnTabChangeListener() { 
                @Override 
                public void onTabChanged(String tabId) { 
                    updateTabStyle(tabHost); 
                } 
            }); 
        } 
         
        /** 
         * 更新Tab标签的背景图 
         * @param tabHost 
         */ 
        private void updateTabStyle(final TabHost mTabHost) { 
            TabWidget tabWidget = mTabHost.getTabWidget(); 
            for (int i = 0; i < tabWidget.getChildCount(); i++) { 
                RelativeLayout tabView = (RelativeLayout) mTabHost.getTabWidget().getChildAt(i); 
                 
                TextView text = (TextView) tabWidget.getChildAt(i).findViewById(android.R.id.title); 
                text.setTextSize(20); 
                 
                // 文字居中 
                RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) text.getLayoutParams(); 
                params.width = RelativeLayout.LayoutParams.MATCH_PARENT; 
                params.height = RelativeLayout.LayoutParams.MATCH_PARENT; 
                // params.addRule(RelativeLayout.CENTER_IN_PARENT); 
                text.setLayoutParams(params); 
                text.setGravity(Gravity.CENTER); 
                 
                if (mTabHost.getCurrentTab() == i) { 
                    // 选中 
                    tabView.setBackgroundResource(R.drawable.bg_tab_selected); 
                    text.setTextColor(this.getResources().getColorStateList(android.R.color.black)); 
                } else { 
                    // 未选中 
                    tabView.setBackgroundResource(R.drawable.bg_tab_normal); 
                    text.setTextColor(this.getResources().getColorStateList(android.R.color.darker_gray)); 
                } 
            } 
        } 
    } 

布局文件tab_layt.xml：

    <?xml version="1.0" encoding="utf-8"?> 
    <TabHost xmlns:android="http://schemas.android.com/apk/res/android" 
        android:id="@+id/customer_tabhost" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" > 
         
        <LinearLayout 
            android:layout_width="match_parent" 
            android:layout_height="match_parent" 
            android:background="#ffffff" 
            android:orientation="vertical" > 
     
            <TabWidget 
                android:id="@android:id/tabs" 
                android:layout_width="match_parent" 
                android:layout_height="wrap_content" > 
            </TabWidget> 
     
            <FrameLayout 
                android:id="@android:id/tabcontent" 
                android:layout_width="match_parent" 
                android:layout_height="match_parent" > 
     
                <LinearLayout 
                    android:id="@+id/tab_1" 
                    android:layout_width="match_parent" 
                    android:layout_height="match_parent" > 
                </LinearLayout> 
     
                <LinearLayout 
                    android:id="@+id/tab_2" 
                    android:layout_width="match_parent" 
                    android:layout_height="match_parent" > 
                </LinearLayout> 
            </FrameLayout> 
        </LinearLayout> 
    </TabHost>