Android TabHost 详细讲解

长平狐 发布于 2012/09/03 12:29
阅读 2K+
收藏 0
一、什么是TabHost。
Android 里面的TabHost就是选项卡,看下图(新浪微博界面):





至于选项卡有什么好处或者用途,我想代码哥们都知道吧,我就不多说了。

二、在Android里面如何实现TabHost
有两种方式可以实现。

1、继承TabActivity,然后用getTabHost()方法获取TabHost,最后在布局文件中定义各个Tab选项卡添加到TabHost中




2、不继承TabActivity,然后在布局文件中定义TabHost,最后讲各个Tab选项卡添加到TabHost中


总结以上两种方式为两步:

①:获取TabHost对象

②:把Tab添加到TabHost中。


我们先看第一种实现:

①:布局文件:

<?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="match_parent">


<!-- 第一个选项卡面板 -->
<LinearLayout
android:id="@+id/tab1"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<!-- 面板中只有一个TextView-->
<TextView android:id="@+id/V1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Touch Android"/>

</LinearLayout>


<!-- 第二个选项卡面板 -->
<LinearLayout
android:id="@+id/tab2"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<!-- 面板中只有一个TextView-->
<TextView android:id="@+id/V2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Touch Android"/>

</LinearLayout>

</LinearLayout>


②:Activity


/**
*Demo2Activity.java
*2011-9-17 下午12:07:48
*Touch Android
*http://bbs.droidstouch.com
*/
package com.droidstouch.tabhost;

import android.app.TabActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;

/**
* @author <a href="http://bbs.droidstouch.com">Touch Android</a>
*
*/
public class Demo2Activity extends TabActivity
{



protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);

// this.setContentView(R.layout.demo2); // 注意不要加上此行代码

//获取到TabHost对象
TabHost tabHost =this.getTabHost();

//把我们的布局文件添加到tabHost 的FrameLayout下面
LayoutInflater.from(this).inflate(R.layout.demo2, tabHost.getTabContentView(), true);



// 下面定义了两个选项卡

//获取一个新的TabHost.TabSpec,并关联到当前tab host
//参数:所需的选项卡标签
TabSpec pSpec = tabHost.newTabSpec("parent");
// 参数一:选项卡上的文字,参数二:选项卡的背景图片
pSpec.setIndicator("父类", this.getResources().getDrawable(R.drawable.f_root));
//设置选项卡内容
pSpec.setContent(R.id.tab1);


TabSpec subSpec = tabHost.newTabSpec("sub");
subSpec.setIndicator("子类", this.getResources().getDrawable(R.drawable.f_sub));
subSpec.setContent(R.id.tab2);


// 将选项卡添加到TabHost中
tabHost.addTab(pSpec);
tabHost.addTab(subSpec);

}

}

第二种方式
①:布局文件


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>



<!-- 定义TabHost ,自定义的TabHost一定得包含TabWidget 和 FrameLayout,
并且 TabWidget 的ID一定是@android:id/tabs
FrameLayout 的Id一定是@android:id/tabcontent
-->
<TabHost android:id="@+id/tabs"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>

<!-- 定义TabWidget,此控件 必须和TabHost一起使用 -->
<TabWidget android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>

<!-- 定义FrameLayout-->
<FrameLayout android:id="@android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<TextView android:id="@+id/txtV1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Touch Android"/>


<TextView android:id="@+id/txtV2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="http://bbs.droidstouch.com"/>


</FrameLayout>


</LinearLayout>
</TabHost>

</LinearLayout>


②:Activity:

package com.droidstouch.tabhost;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;

public class Dome1Activity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.demo1);




//从布局文件中 获取到TabHost
TabHost tabHost = (TabHost) this.findViewById(R.id.tabs);
//安装TabHost
tabHost.setup();


// 下面定义两个选项卡

//获取一个新的TabHost.TabSpec,并关联到当前tab host
//参数:所需的选项卡标签
TabSpec pSpec = tabHost.newTabSpec("parent");
pSpec.setIndicator("父类", this.getResources().getDrawable(R.drawable.f_root));
pSpec.setContent(R.id.txtV1);



TabSpec subSpec = tabHost.newTabSpec("sub");
subSpec.setIndicator("子类", this.getResources().getDrawable(R.drawable.f_root));
subSpec.setContent(R.id.txtV2);


//添加选项卡到TabHost中
tabHost.addTab(pSpec);
tabHost.addTab(subSpec);

}
}




原文链接:http://blog.csdn.net/t12x3456/article/details/7738454
加载中
返回顶部
顶部