一 介绍
1.1 TAB的容器。这个对象包含两个子元素:
- TabWidget:管理标签(tabs),用户点击来选择一个特定的标签,是它告诉TabHost去切换界面的
- FrameLayout:对象显示该页的内容
1.2 常用方法
- public void addTab(TabHost.TabSpec tabSpec)
- public void setup ():在addTab之前要先调用setup,不和TabActivity关联,通过findViewById获取的TabHost需要调用setup(),如果是在TabActivity中通过getTabHost()的方式获取的不需要调用这个方法
- setup(LocalActivityManager activityGroup): setContent中传入intent的时候才关注下这个方法
- clearAllTabs :移除所有的tab
- dispatchKeyEvent : 下发keyevent
- dispatchWindowFocuseChanged : 下发windowfocusChanged事件
- tabHost.newTabSpec :创建一个新的TabSpec,关联到具体内容
- getCurrentTab()/setCurrentTab():获取/设置当前需要显示的tab,通过index
- setCurrentTabByTag/getCurrentTabTag:通过tag设置当前需要显示的Tab,tag就是创建TabSpec的时候传入的字符串
- getCurrentTabView:设置/获取当前在TabWidget中显示的View,也就是作为标签的View而非内容
- getCurrentView :获取当前显示的内容
- setOnTabChangedListener : 设置标签页切换事件监听
- getTabContentView:获取内容页面的容器FrameLayout
- getTabWidget: 获取TabWidget
1.3 涉及接口及类
- class:TabHost.TabSpec
- interface:TabHost.OnTabChangeLisetener
- interface:TabHost.TabContentFactory
1.3.1 TabHost.TabSpec
tab(标签)有一个indicator,content.例如:
tabHost.addTab(tabHost.newTabSpec("tab_time").setIndicator("时钟").setContent(R.id.tab_time));
1.3.2 indicator
有三个重载的方法可以设置标签的名字和图案。返回值都是TabHost.TabSpec
- setIndicator(CharSequence label)
- setIndicator(View view)
- setIndicator(CharSequence lable,Drawable icon)
1.3.3 content
返回值都是TabHost.TabSpe。是第一个比较常用。
- **setContent(int viewId)**传入视图的ID与之关联起来
- setContet(Intent intent)在TabHost.TabContentFactory创建的这个视图的内容
- setContent((TabHost.TabContentFactory contentFactory)
1.3.4 tag
这是相当于一个tag的身份证,在 new TabSpec(String tag)决定了
二 TabHost源码
public class TabHost...{ //常用属性 private TabWidget mTabWidget; private FrameLayout mTabContent; private List<TabSpec> mTabSpecs = new ArrayList<TabSpec>(2); private OnKeyListener mTabKeyListener; public void setup(){ //这里实例化TabWiget mTabWidget = (TabWidget) findViewById(com.android.internal.R.id.tabs); if (mTabWidget == null) { throw new RuntimeException( "Your TabHost must have a TabWidget whose id attribute is 'android.R.id.tabs'"); } .... mTabWidget.setTabSelectionListener(new TabWidget.OnTabSelectionChanged() { public void onTabSelectionChanged(int tabIndex, boolean clicked) { setCurrentTab(tabIndex); if (clicked) { mTabContent.requestFocus(View.FOCUS_FORWARD); } } }); mTabContent = (FrameLayout) findViewById(com.android.internal.R.id.tabcontent); if (mTabContent == null) { throw new RuntimeException( "Your TabHost must have a FrameLayout whose id attribute is " + "'android.R.id.tabcontent'"); } } }
注意:在自定义自己的TabHost的时候,Tabwiget和FrameLayout不可以自定义Id。为它需要在setup里面实例化,因此需要在addTab添加内容之前调用setup方法
三 实例分析
代码地址:https://github.com/MichealPan9999/TabHost
3.1 布局
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/main_ll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<TabHost
android:id="@+id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- 设置的id必须是 "@android:id/tabcontent"-->
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="9">
<LinearLayout
android:id="@+id/tv_one"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="this is tab1 content" />
</LinearLayout>
<LinearLayout
android:id="@+id/tv_two"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="this is tab2 content" />
</LinearLayout>
<LinearLayout
android:id="@+id/tv_three"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="this is tab3 content" />
</LinearLayout>
<LinearLayout
android:id="@+id/tv_four"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="this is tab4 content" />
</LinearLayout>
</FrameLayout>
<!-- 设置的id必须是android:id="@android:id/tabs" -->
<TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:padding="5dp"
android:showDividers="none"></TabWidget>
</LinearLayout>
</TabHost>
</LinearLayout>
</LinearLayout>
3.2 MainActivity 实现
public class MainActivity extends FinalActivity { // 如果没有继承TabActivity时,通过该种方法加载启动tabHost @ViewInject(id = R.id.tabhost) TabHost mTabHost; private int[] unSelectedTabIcons = {R.drawable.menu_icon_0_normal, R.drawable.menu_icon_1_normal, R.drawable.menu_icon_2_normal, R.drawable.menu_icon_3_normal}; private int[] selectedTabIcons = {R.drawable.menu_icon_0_pressed, R.drawable.menu_icon_1_pressed, R.drawable.menu_icon_2_pressed, R.drawable.menu_icon_3_pressed}; private String[] menuText = {"添加联系人", "通讯录", "备忘录","设置"}; private int[] contentItems = {R.id.tv_one, R.id.tv_two, R.id.tv_three,R.id.tv_four}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mTabHost.setup();//初始化TabHost,在addTab之前要先调用setup;不和TabActivity关联,通过findViewById获取的TabHost需要调用setup();如果是在TabActivity中通过getTabHost()的方式获取的不需要调用这个方法 addTabHost(); mTabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() { @Override public void onTabChanged(String tabId) { updateTab(mTabHost,tabId); } }); mTabHost.setCurrentTab(0); ((TextView) mTabHost.getCurrentTabView().findViewById(R.id.tv_indicator)).setTextColor(getResources().getColor(R.color.colorGreen));//第一次进入的时候讲选中的Tab修改文字颜色 ((ImageView) mTabHost.getCurrentTabView().findViewById(R.id.iv_indicator)).setImageResource(selectedTabIcons[0]);//第一次进入的时候讲选中的Tab修改文字颜色 } private void addTabHost() { for (int i = 0;i< 4;i++) { View view = LayoutInflater.from(this).inflate(R.layout.indicator, null, false); TextView textView = (TextView) view.findViewById(R.id.tv_indicator); ImageView imageView = (ImageView) view.findViewById(R.id.iv_indicator); textView.setText(menuText[i]); imageView.setImageResource(unSelectedTabIcons[i]); mTabHost.addTab(mTabHost.newTabSpec(String.valueOf(i)).setIndicator(view).setContent(contentItems[i])); } } private void updateTab(TabHost tabHost,String tabId) { for (int i = 0; i < 4; i++) { ((TextView) tabHost.getTabWidget().getChildTabViewAt(i).findViewById(R.id.tv_indicator)).setTextColor(getResources().getColor(R.color.colorBlue)); ((ImageView) tabHost.getTabWidget().getChildTabViewAt(i).findViewById(R.id.iv_indicator)).setImageResource(unSelectedTabIcons[i]);//第一次进入的时候讲选中的Tab修改文字颜色 } Log.e("panzqww",tabHost.getCurrentTabTag()+" ::: "+tabId); if (tabHost.getCurrentTabTag().equals(tabId)) { int i = Integer.valueOf(tabId); ((TextView) tabHost.getCurrentTabView().findViewById(R.id.tv_indicator)).setTextColor(getResources().getColor(R.color.colorGreen)); ((ImageView) tabHost.getCurrentTabView().findViewById(R.id.iv_indicator)).setImageResource(selectedTabIcons[i]);//第一次进入的时候讲选中的Tab修改文字颜色 }//选中的那个Tab文字颜色修改 } }
3.3 TabActivity
TabActivity已经被废弃很久了,但是还是可以使用,在布局中将TabHost的id改成android:id=”@android:id/tabhost”,然后在继承了TabActivity的MainActivity.java中使用
mTabHost = getTabHost();
然后基本使用方法就和上面一样了