在《【Android】标签页、计时器、单选按钮、复选按钮》(点击打开链接)我曾经介绍过安卓标签页的使用方式,但是,将标签页放到app的底部似乎更适合现在app所流行的风格,如下图所示。其实将这个Tabhost置底也很简单。
和原来的Tabhost一样,如果你要使用安卓的标签页,那么activity_main.xml这个主布局是定死了,其余的,你要新建多少个字标签页,就需要有多有个xml,也就是tab1.xml、tab2.xml等就是控制其余标签页内的布局。而activity_main.xml则完成标签的放置。
在activity_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"
android:layout_alignParentBottom="true" >
<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="0dip"
android:layout_weight="1" />
<TabWidget
android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</TabHost>
和原来的标签页默认的布局相比,在TabHost添加了android:layout_alignParentBottom="true"这个属性,而FrameLayout和TabWidget则反过来,同时,修改了FrameLayout的属性,android:layout_height从原来的"fill_parent"改成"0dip",并且添加了android:layout_weight="1"这个属性。
接下来和原来设置标签页的过程一模一样,这里就不再赘述了,就贴下代码。
tab1.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="@+id/tab2_TextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="@string/tab1_string"
android:textSize="24sp" />
</LinearLayout>
tab2.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/LinearLayout2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="@+id/tab2_TextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="@string/tab2_string"
android:textSize="24sp" />
</LinearLayout>
没什么好说的,就放两个textview标签文本上去,res\values\strings.xml则如下:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">标签页放底部</string>
<string name="tab1_string">标签1</string>
<string name="tab2_string">标签2</string>
</resources>
最后,同样,在MainActivity.java完成标签页的初始化即可!
package com.example.tabbottom;
import android.os.Bundle;
import android.app.Activity;
import android.view.LayoutInflater;
import android.widget.TabHost;
public class MainActivity extends Activity {
private TabHost tabHost;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
/* 标签页初始化 */
tabHost = (TabHost) findViewById(android.R.id.tabhost);
tabHost.setup();
LayoutInflater layoutInflater = LayoutInflater.from(this);
layoutInflater.inflate(R.layout.tab1, tabHost.getTabContentView());
layoutInflater.inflate(R.layout.tab2, tabHost.getTabContentView());
// 设置标签1的标题为“标签1”,且布局为LinearLayout1,须和layout中的布局文件tab1.xml同,下同理
tabHost.addTab(tabHost.newTabSpec("").setIndicator("标签1")
.setContent(R.id.LinearLayout1));
tabHost.addTab(tabHost.newTabSpec("").setIndicator("标签2")
.setContent(R.id.LinearLayout2));
}
}