在做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>