先看看效果图吧,个人觉得图标丑了点,不过还行,自己用PS做的
下面是全部代码和流程,一定要按流程顺序来,不然错误!
1.tabhost.xml
- <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
- xmlns:tools="http://schemas.android.com/tools"
- android:id="@android:id/tabhost"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content" >
- <RelativeLayout
- android:id="@+id/relativelayout"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent" >
- <FrameLayout
- android:id="@android:id/tabcontent"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content" >
- <LinearLayout
- android:id="@+id/tab1"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="vertical" >
- </LinearLayout>
- <LinearLayout
- android:id="@+id/tab2"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="vertical" >
- </LinearLayout>
- <LinearLayout
- android:id="@+id/tab3"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="vertical" >
- </LinearLayout>
- <LinearLayout
- android:id="@+id/tab4"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="vertical" >
- </LinearLayout>
- <LinearLayout
- android:id="@+id/tab5"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="vertical" >
- </LinearLayout>
- </FrameLayout>
- <TabWidget
- android:id="@android:id/tabs"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:layout_alignParentBottom="true"
- android:background="@drawable/tabwidget_bj" >
- </TabWidget>
- </RelativeLayout>
- </TabHost>
2.tab_item_view.xml
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:orientation="vertical" >
- <ImageView
- android:id="@+id/imageview"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="center_horizontal|top"
- android:padding="3dp" />
- <TextView
- android:id="@+id/textview"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="center_horizontal|bottom"
- android:textColor="#fff"
- android:textSize="13sp"
- style="bold"/>
- </LinearLayout>
3.样式选择器selector:tab_item_style.xml,新建文件夹drawable,然后将该xml文件放进去
- <?xml version="1.0" encoding="utf-8"?>
- <selector xmlns:android="http://schemas.android.com/apk/res/android">
- <item android:drawable="@drawable/unpressed_bj" android:state_selected="false"/>
- <item android:drawable="@drawable/pressed_bj" android:state_selected="true"/>
- </selector>
4.java代码实现:MyTabHost.java
- package com.example.androidtabhost4;
- import android.os.Bundle;
- import android.app.Activity;
- import android.app.TabActivity;
- import android.content.Intent;
- import android.view.LayoutInflater;
- import android.view.Menu;
- import android.view.View;
- import android.widget.ImageView;
- import android.widget.TabHost;
- import android.widget.TextView;
- import android.widget.TabHost.TabSpec;
- public class MyTabHost extends TabActivity {
- private TabHost tabHost;
- private LayoutInflater layoutInflater;
- String[] mTitle = new String[] { "首页", "留言", "评论", "收藏", "更多" };
- int[] mIcon = new int[] { R.drawable.home, R.drawable.saying,
- R.drawable.zan, R.drawable.collect, R.drawable.more };
- int[] mTab = new int[] { R.id.tab1, R.id.tab2, R.id.tab3, R.id.tab4,
- R.id.tab5 };
- @Override
- protected void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.tabhost);
- init();
- }
- public View getTabItemView(int i) {
- // TODO Auto-generated method stub
- View view = layoutInflater.inflate(R.layout.tab_item_view, null);
- ImageView imageView = (ImageView) view.findViewById(R.id.imageview);
- imageView.setImageResource(mIcon[i]);
- TextView textView = (TextView) view.findViewById(R.id.textview);
- textView.setText(mTitle[i]);
- return view;
- }
- public void init() {
- // TODO Auto-generated method stub
- tabHost = getTabHost();
- layoutInflater = LayoutInflater.from(this);
- for (int i = 0; i < mTitle.length; i++) {
- TabSpec tabSpec = tabHost.newTabSpec(mTitle[i])
- .setIndicator(getTabItemView(i)).setContent(mTab[i]);
- tabHost.addTab(tabSpec);
- tabHost.getTabWidget().getChildAt(i)
- .setBackgroundResource(R.drawable.tab_item_style);
- tabHost.setup();
- }
- }
- }