Android 自定义TabHost,TabWidget样式

时间:2021-10-31 14:26:57
Android  自定义TabHost,TabWidget样式
Android  自定义TabHost,TabWidget样式
Android  自定义TabHost,TabWidget样式

Android  自定义TabHost,TabWidget样式

界面比较简单,要想做得漂亮换几张图片就可以了。

第一步:先在布局(这里用了main.xml创建时自动生成的)里面放上TabHost ,只要将TabHost控件托至屏幕中就可:

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/taskdescribe_buildingmeter_tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white" > <LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
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="0dp"
android:layout_weight="1">
<LinearLayout
android:id="@+id/buildingmeter_layout_unitname"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="@color/white">
</LinearLayout>
<LinearLayout
android:id="@+id/buildingmeter_layout_installstatus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="@color/white">
</LinearLayout>
<LinearLayout
android:id="@+id/buildingmeter_layout_storey"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="@color/white">
</LinearLayout> </FrameLayout>
</LinearLayout>
</TabHost>

第二步:创建显示此TabWidget的布局tab项tabmini.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="40dip"
android:paddingLeft="5dip"
android:paddingRight="5dip"> <TextView
android:id="@+id/tab_lable"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="TextView" /> </LinearLayout>

第三步:在Activity里实现TabHost:

private TabHost tabHost;
private TabWidget tabWidget;
LayoutInflater inflater = activity.getLayoutInflater();

View view1 = inflater.inflate(R.layout.tabhost_tag, null);
TextView txt1 = (TextView) view1.findViewById(R.id.tab_lable);
txt1.setText("按单元名"); View view2 = inflater.inflate(R.layout.tabhost_tag, null);
TextView txt2 = (TextView) view2.findViewById(R.id.tab_lable);
txt2.setText("按状态"); View view3 = inflater.inflate(R.layout.tabhost_tag, null);
TextView txt3 = (TextView) view3.findViewById(R.id.tab_lable);
txt3.setText("按楼层"); //得到TabHost对象实例
tabHost =(TabHost) activity.findViewById(R.id.taskdescribe_buildingmeter_tabhost);
//调用 TabHost.setup()
tabHost.setup();
tabWidget = tabHost.getTabWidget();
//创建Tab标签
tabHost.addTab(tabHost.newTabSpec("one").setIndicator(view1).setContent(R.id.buildingmeter_layout_unitname));
tabHost.addTab(tabHost.newTabSpec("two").setIndicator(view2).setContent(R.id.buildingmeter_layout_installstatus));
tabHost.addTab(tabHost.newTabSpec("three").setIndicator(view3).setContent(R.id.buildingmeter_layout_storey)); //设置第一次打开时默认显示的标签
tabHost.setCurrentTab(0);
//初始化Tab的颜色,和字体的颜色
updateTab(tabHost);
//选择监听器
tabHost.setOnTabChangedListener(new tabChangedListener());
  /**
* 更新Tab标签的颜色,和字体的颜色
* @param tabHost
*/
private void updateTab(final TabHost tabHost)
{
for (int i = 0; i < tabHost.getTabWidget().getChildCount(); i++)
{
View view = tabHost.getTabWidget().getChildAt(i);
TextView tv = (TextView) tabHost.getTabWidget().getChildAt(i).findViewById(R.id.tab_lable);
tv.setTextSize(16);
tv.setTypeface(Typeface.SERIF, 0); // 设置字体和风格
if (tabHost.getCurrentTab() == i)
{
//选中
view.setBackground(getResources().getDrawable(R.drawable.tabhost_current));//选中后的背景
tv.setTextColor(this.getResources().getColorStateList(android.R.color.white));
}
else
{
//不选中
view.setBackground(getResources().getDrawable(R.drawable.tabhost_default));//非选择的背景
tv.setTextColor(this.getResources().getColorStateList(android.R.color.black));
}
}
} /**
* TabHost选择监听器
* @author
*
*/
private class tabChangedListener implements OnTabChangeListener { @Override
public void onTabChanged(String tabId)
{
tabHost.setCurrentTabByTag(tabId);
updateTab(tabHost);
}
}