Android布局之TabLayout
为了使用Tab，必须使用TabHost和TabWidget，TabHost必须是布局文件中的根节点，它包含了tabWidget显示tabs，以及FrameLayout来显示tab的内容。
你可以用以下两种方式实现你的tab内容：
A．在同一个Acitivity里交换不同的View。
B．每一个Tab使用一个不同的Activity。
在这里先介绍第2种的实现方式，具体步骤如下：
1.创建一个项目HelloTabWidget
2.创建三个不同的Activity用来代表不同的Tab，在此创建了ArtistsActivity, AlbumsActivity, 和SongsActivity.具体代码如下：
ArtistsActivity.javaimport android.app.Activity; import android.os.Bundle; import android.widget.TextView; public class ArtistsActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); TextView tv = new TextView(this); tv.setText("This is the Artists tab"); setContentView(tv); } }
AlbumsActivity.java
import android.app.Activity; import android.os.Bundle; import android.widget.TextView; public class AlbumsActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); TextView tv = new TextView(this); tv.setText("This is the Albums tab"); setContentView(tv); } } SongsActivity.java
import android.app.Activity; import android.os.Bundle; import android.widget.TextView; public class SongsActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); TextView tv = new TextView(this); tv.setText("This is the Songs tab"); setContentView(tv); } } 在这里只是为了演示，三个Acitivity都没有设置布局文件，只是设置了一个Textview，在实际运用时可以换成需要的布局文件
3. 在AndriodManifest.xml文件中注册三个Activity。
4.每个tab都需要一组图片，即包含两个状态的图片，一个是这个tab被选中时的图片，另一个是没有被选中时的图片。建议选中时使用灰色图片，没有选中时使用白色图片。（具体效果如下图）
在此因为我们要创建三个tab，因此还需要为其他两个tab准备两组图片，为了方便，下面我为每个tab设置的都是这组图片，自己操作时可以准备好三组图片。
4.1将图片保存在res/drawable/ 下面
4.2在res/drawable/ 下面创建一个名为ic_tab_artists.xml用于定义不同的tab状态时显示不同的图片。
ic_tab_artists.xml<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- When selected, use grey --> <item android:drawable="@drawable/ic_tab_artists_grey" android:state_selected="true" /> <!-- When not selected, use white--> <item android:drawable="@drawable/ic_tab_artists_white" android:state_selected="false" /> </selector>
ic_tab_artists_grey和 ic_tab_artsits_white为图片名称
5.修改main.xml如下
main.xml
<?xml version="1.0" encoding="utf-8"?> <TabHost xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/tabhost" android:layout_width="fill_parent" android:layout_height="fill_parent"> <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:padding="5dp"> <TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="fill_parent" android:padding="5dp" /> </LinearLayout> </TabHost>
这个文件的设置是按照开篇的第一句话：为了使用Tab，必须使用TabHost和TabWidget，TabHost必须是布局文件中的根节点，它包含了tabWidget显示tabs，以及FrameLayout来显示tab的内容。（个人感觉这个就是一个格式，反正按这样做就行了）
6.修改HelloTabWidget.java的代码，让他继承TabActivity
HelloTabWidget.java
package lin.sdk.tablayout; import android.app.TabActivity; import android.content.Intent; import android.content.res.Resources; import android.os.Bundle; import android.widget.TabHost; public class HelloTabWidget extends TabActivity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); Resources res = getResources(); // Resource object to get Drawables TabHost tabHost = getTabHost(); // The activity TabHost TabHost.TabSpec spec; // Resusable TabSpec for each tab Intent intent; // Reusable Intent for each tab // Create an Intent to launch an Activity for the tab (to be reused) intent = new Intent().setClass(this, ArtistsActivity.class); // Initialize a TabSpec for each tab and add it to the TabHost spec = tabHost .newTabSpec("artists") .setIndicator("Artists", res.getDrawable(R.drawable.ic_tab_artists)) .setContent(intent); tabHost.addTab(spec); // Do the same for the other tabs intent = new Intent().setClass(this, AlbumsActivity.class); spec = tabHost .newTabSpec("albums") .setIndicator("Albums", res.getDrawable(R.drawable.ic_tab_artists)) .setContent(intent); tabHost.addTab(spec); intent = new Intent().setClass(this, SongsActivity.class); spec = tabHost .newTabSpec("songs") .setIndicator("Songs", res.getDrawable(R.drawable.ic_tab_artists)) .setContent(intent); tabHost.addTab(spec); tabHost.setCurrentTab(1); } } 上面可以把后面两个R.drawable.ic_tab_artsts换成为后面两个tab设置图片而创建的类似ic_tab_artists.xml文件
7.修改AndriodManifest.xml文件，去掉Titlebar
<activity android:name=".HelloTabWidget" android:label="@string/app_name" android:theme="@android:style/Theme.NoTitleBar">
整个AndroidManifest.xml如下：
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="lin.sdk.tablayout" android:versionCode="1" android:versionName="1.0"> <uses-sdk android:minSdkVersion="10" /> <application android:icon="@drawable/icon" android:label="@string/app_name"> <activity android:name=".HelloTabWidget" android:label="@string/app_name" android:theme="@android:style/Theme.NoTitleBar"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".AlbumsActivity"/> <activity android:name=".SongsActivity"/> <activity android:name=".ArtistsActivity"/> </application> </manifest>
如果直接复制上面的代码，需要修改package="lin.sdk.tablayout"为自己项目的包名
程序运行效果如下：
