[置顶] Android中两种实现底部Tab的方法

 

第一种：

下面的tabs.xml布局文件中，整个布局是垂直显示的，分为FrameLayout和TabWidget上下两部分，在FrameLayout 布局里面使用layout_weight=“1” ，而TabWidget没有设置这个属性，那就默认为0。那么在这布局中，FrameLayout 就按比例分得整个屏幕的3/4，而没有设置layout_weight属性的TabWidget只是占用刚好能显示自己空间大小的位置。这样的话，就能达到就Tab置于底部了。

layout_weight具体可以看看http://liangruijun.blog.51cto.com/3061169/632532里面的FrameLayout 布局

tabs.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"
 >
 <FrameLayout
 android:id="@android:id/tabcontent"
 android:layout_width="fill_parent"
 android:layout_height="match_parent"
 android:layout_weight="1"
 >
 <TextView
 android:id="@+id/view1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:text="nihao"
 />
 <TextView
 android:id="@+id/view2"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:text="nihenhao"
 />
 </FrameLayout>
 <TabWidget
 android:id="@android:id/tabs"
 android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 />
 </LinearLayout>
</TabHost>

main.xml

<?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"
 >
<TextView
 android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 android:text="@string/hello"
 />
</LinearLayout>

TestHostActivity.java

package com.lingdududu.test;

import android.app.TabActivity;
import android.os.Bundle;
import android.widget.TabHost;

public class TestHostActivity extends TabActivity {
 /** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.tabs);
 TabHost tabhost = getTabHost();
 tabhost.addTab(tabhost.newTabSpec("111").setIndicator("view1").setContent(R.id.view1));
 tabhost.addTab(tabhost.newTabSpec("222").setIndicator("view2").setContent(R.id.view2));
 }
}

效果：

第二种：

在LinerLayout布局里面嵌套FrameLayout和RelativeLayout布局，将TabWidget放置在RelativeLayout里面，之后设置RelativeLayout的android:layout_alignParentBottom="true" 属性，这个属性的功能是将TabWidget置于父元素(也就是LinerLayout)的底部。这样就能将Tab置于底部了。

<?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
 android:id="@+id/tabhost"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">
 <FrameLayout
 android:id="@android:id/tabcontent"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:paddingBottom="62px"
 >
 <TextView
 android:id="@+id/tab1"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:text="这是TabOne"
 />
 <TextView
 android:id="@+id/tab2"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:text="这是TabTwo"/>
 </FrameLayout>
 <RelativeLayout
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 >
 <TabWidget
 android:id="@android:id/tabs"
 android:layout_alignParentBottom="true"
 android:layout_width="fill_parent"
 android:layout_height="65.0px"
 android:background="@drawable/tab_bg"
 />
 </RelativeLayout>
 </TabHost>
</LinearLayout>

main.xml

<?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"
 >
<TextView
 android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 android:text="@string/hello"
 />
</LinearLayout>

TabHostActivity.java

package com.lingdududu.test;

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

public class TabHostActivity extends Activity {
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.tabs);
 TabHost tabs=(TabHost)findViewById(R.id.tabhost);

 tabs.setup();

 TabHost.TabSpec spec=tabs.newTabSpec("tag1");
 spec.setContent(R.id.tab1);
 spec.setIndicator("TabOne");
 tabs.addTab(spec);

 spec=tabs.newTabSpec("tag2");
 spec.setContent(R.id.tab2);
 spec.setIndicator("TabTwo");
 tabs.addTab(spec);

 tabs.setCurrentTab(0);
 }
}

效果图：