经典效果组件篇4：安卓的tab标签控件

本系列博客持续更新，由浅入深，欢迎关注和收藏，也欢迎指正与评论

标签控件是简洁应用里常用的，但是在网站上讲解的很少看到，而且乱起八糟的，太多的东西搀和在一起。所以自己写了一个简单纯净的Demo。

话不多说，先上效果图 

点击想要打开的标签页，即会切换到对应的标签页，并显示标签内的内容，内容是通过layout和Activity来布局和设定的，开放度和自由度比较高

为了保证最简单Demo的原则，所以没有添加左右滑动手势。后面会介绍。

使用简介：

可以这样理解，Tabs标签控件分为两个，一个是总体的标签容器，用来盛放一页页标签，这个容器叫TabHost，而那一页页的标签，叫TabSpec，而TabSpec里面的内容可以通过指定他的布局文件来指定。然后我们把这一页页的标签放进TabHost中就是一个完整的标签控件了

实现步骤：

1 定义三个Activity，并分别为他们定义三个Layout，很简单，直接上代码。

第一个Activity：IndexActivity，其实啥也没有，只是指定了这个Activity的布局文件

public class IndexActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_index);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.index, menu);
		return true;
	}
}

对应的Layout：activity_index.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="这是第一个标签，可以随便写写东西" />
</RelativeLayout>

后面依样再写俩就行

2 修改主Activity

将主Activity继承的类换成TabActivity，将TabHost声明为成员变量，并将activity作为TabSpec放入host中集中显示，具体代码如下

public class MainActivity extends TabActivity {
	public TabHost tabHost;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		//获取对象  
        tabHost = getTabHost();  
          
         
        tabHost.addTab(tabHost.newTabSpec("index")  
                .setIndicator("实时新闻")  
                .setContent(new Intent(this, IndexActivity.class)));  
        tabHost.addTab(tabHost.newTabSpec("center")  
                .setIndicator("我的空间")  
                .setContent(new Intent(this, MiddleActivity.class))); 
        tabHost.addTab(tabHost.newTabSpec("self")  
                .setIndicator("设置")  
                .setContent(new Intent(this, LastActivity.class))); 
          
        
        //指定的当前的tab  
        //通过索引指定  索引从0开始  
        //即一开始要显示的是哪一页
        tabHost.setCurrentTab(0); //从零开始  
		
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}

注意的是，本来代码中有设置layout的语句，一定要去掉，这里不需要指定布局了。否则会报错。

这样，标签的效果就可以实现了，只是没有添加手势识别滑动，会在下一篇单独做出来

下面的是我自己的Demo工程

Demo工程