Android选项卡实现之TabHost/TabSpec/TabWidget

原创
2013/11/27 20:36
阅读数 1.5W
Tab是什么就不用再用我来描述了。android的ui开发中,承载Tab的容器就是TabHost,每一个Tab对应一个Activity,每个Activity均会有自己的布局。

1.继承TabActivity

2.布局文件中使用tabHost,tabWedgit和framework

3.在activity中通过源码添加tab选项卡,每个选项卡中显示指定activity中的内容。可以通过代码控制界面的显示效果。

下面还是通过一个代码示例来说明下吧:

(1)创建一个新的工程TestTab吧

(2)将生成的MainActivity的继承类改成TabActivity,如果没自动生成mainactivity,那就自己手动创建一个吧:

public class MainActivity extends TabActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }
}

(3)创建main的布局文件

注意:TabHost ,TabWidget ,FrameLayout的ID必须分别为@android :id/tabhost,@android :id/tabs,@android :id/tabcontent
另外还要注意一下android:layout_width宽度和android:layout_height高度的取值,还要LinearLayout的android:orientation=”vertical”(LinearLayout默认是横向的)当你看到布局和我不一样时你就要考虑一下这里是不是错了。(= =!因为我错过)

    这里面的TabHost就是tab区加上对应的属性页;TabWidget就是Tab按钮区,FrameLayout就是属性页区域.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    <TabHost
        android:id="@android :id/tabhost"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical" >
            <FrameLayout
                android:id="@android :id/tabcontent"
                android:layout_width="fill_parent"
                android:layout_height="0dp"
                android:layout_weight="1" />
            <TabWidget
                android:id="@android :id/tabs"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_weight="0"
                android:orientation="horizontal" />
            <!--  android:background="@drawable/jdy_tab_background"-->
        </LinearLayout>
    </TabHost>
</LinearLayout>

(4)创建tab元素:TabSpec

    这里面会涉及到对象TabSpec。该对象通常用TabHost来创建,里面包含了一个Tab元素所包含的信息需要用户来指定。下面来看看官方文档的解释吧:

A tab has a tab indicator, content, and a tag that is used to keep track of it. This builder helps choose among these options. For the tab indicator, your choices are: 1) set a label 2) set a label and an icon For the tab content, your choices are: 1) the id of a View 2) a TabHost.TabContentFactory that creates the View content. 3) an Intent that launches an Activity.
 

    一个tab通常包含了indicator(指示器)、content(tab对应展示的页面view,可以为这个view的id或者是一个intent)、tag。其中TabSpec就是用来辅助设置这些选项。

    <1> Indicator通常是设置tab的名称label和icon。

    <2> Content:可以是一个view的id,也可以通过TabContentFactory创建一个view,还可以是一个Intent组件来加载一个activity。

(5)创建两个Activity,暂且叫FirstActivity,SecActivity,并在Manifest文件中注册

public class SettingActivity extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
 
        TextView textview = new TextView(this);
        textview.setText("设置页面");
        setContentView(textview);
    }
}  

(6)在MainActivity中添加Tab -- 使用TabSpec

 protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        mTabHost = getTabHost();
        TabSpec spec;
        
        spec = mTabHost.newTabSpec("新建");    
        spec.setIndicator("新建");
        spec.setContent(new Intent(this, NewTaskActivity.class));
        mTabHost.addTab(spec);
        
        spec = mTabHost.newTabSpec("设置");    
        spec.setIndicator("设置");
        spec.setContent(new Intent(this, SettingActivity.class));
        mTabHost.addTab(spec);
          
        mTabHost.setCurrentTab(0);         
    }

至此,一个简单的tab就做完了,运行下就可以看到结果。你也可以根据自己的喜好更改下每个tab的内容的activity样子。

(7)TabWidget说明:

java.lang.Object
   ↳ android.view.View
     ↳ android.view.ViewGroup
       ↳ android.widget.LinearLayout
         ↳ android.widget.TabWidget

    通过上面的类继承关系就可以看出TabWidget是一个ViewGroup,即是一个线性布局的容器,能够容纳多个Tab。同时“The container object for this widget is TabHost”。它也是TabHost内的一个widget。


不过用过API4.0的小伙伴一定都会发现TabActivity已经被android弃用了。

    TabActivity has been deprecated, cause it is subclass of ActivityGroup, which also has been deprecated.

    ActityGroup has been deprecated, and instead Fragment has been introduced and suggested. As using Fragments is easier and more flexible than ActivityGroup. It also enable android components to have a homogeneous pattern.

后面,我们决定采用Fragment实现tab形式的页面,也与时俱进下。 待续... ...








展开阅读全文
加载中
点击加入讨论🔥(2) 发布并加入讨论🔥
打赏
2 评论
10 收藏
2
分享
返回顶部
顶部