需求:使用TabHost实现底部菜单栏;
效果图:
实现分析:
1.目录结构:
代码实现:
1.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="match_parent"
android:layout_height="match_parent" > <LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" > <FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" /> <TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="2dp"
android:layout_weight="0"
android:background="@drawable/tab_widget_background" />
</LinearLayout> </TabHost>
2 activity_one.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/image_01" > </FrameLayout>
3 item_tab_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:gravity="center"
android:orientation="vertical" > <ImageView
android:id="@+id/image_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dp" /> <TextView
android:id="@+id/text_name"
style="@style/item_tab_text_style"
android:layout_width="wrap_content"
android:layout_height="wrap_content" /> </LinearLayout>
4 tab_background_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/tab_item_p" android:state_pressed="true"/>
<item android:drawable="@drawable/tab_item_d" android:state_selected="true"/> </selector>
5 style.xml
<style name="item_tab_text_style">
<item name="android:textSize">10.0dip</item>
<item name="android:textColor">#ffffffff</item>
<item name="android:ellipsize">marquee</item>
<item name="android:singleLine">true</item>
</style>
6 Constant.java
package com.jjc.demo; /**
* @author ThinkPad
* 功能描述:常量工具类
*/
public class Constant { public static final class ConValue{ /**
* Tab选项卡的图标
*/
public static int mImageViewArray[] = {
R.drawable.tab_icon1,
R.drawable.tab_icon2,
R.drawable.tab_icon3,
R.drawable.tab_icon4,
R.drawable.tab_icon5
}; /**
* Tab选项卡的文字
*/
public static String mTextViewArray[] = {"主页", "关于", "设置", "搜索", "更多"}; /**
* 每一个Tab界面
*/
public static Class<?> mTabClassArray[] = {
ActivityOne.class,
ActivityTwo.class,
ActivityThree.class,
ActivityFour.class,
ActivityFive.class
};
}
}
7 ActivityOne.java
package com.jjc.demo; import android.app.Activity;
import android.os.Bundle; public class ActivityOne extends Activity{ @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_one);
}
}
8 MainActivity.java
package com.jjc.demo; import com.jjc.demo.Constant.ConValue; import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;
import android.widget.TextView; public class MainActivity extends TabActivity { private TabHost mTabHost;
private LayoutInflater mInflater; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); initView();
} /**
* 初始化组件
*/
private void initView() {
// 实例化TabHost对象,得到TabHost
mTabHost = getTabHost(); // 实例化布局对象
mInflater = LayoutInflater.from(this); // 得到Activity的个数
int count = ConValue.mTabClassArray.length; for (int i = 0; i < count; i++) {
// 为每一个Tab按钮设置图标、文字和内容
TabSpec tabSpec = mTabHost.newTabSpec(ConValue.mTextViewArray[i])
.setIndicator(getTabItemView(i))
.setContent(getTabItemIntent(i));
// 将Tab按钮添加进Tab选项卡中
mTabHost.addTab(tabSpec);
// 设置Tab按钮的背景
mTabHost.getTabWidget().getChildAt(i)
.setBackgroundResource(R.drawable.tab_background_selector);
}
} /**
* 给Tab按钮设置图标和文字
*/
private View getTabItemView(int index) {
View view = mInflater.inflate(R.layout.item_tab_view, null);
ImageView imageView = (ImageView) view.findViewById(R.id.image_icon);
if (imageView != null) {
imageView.setImageResource(ConValue.mImageViewArray[index]);
}
TextView textView = (TextView) view.findViewById(R.id.text_name);
textView.setText(ConValue.mTextViewArray[index]);
return view;
} /**
* 给Tab选项卡设置内容(每个内容是一个Activity)
*/
private Intent getTabItemIntent(int index) {
Intent intent = new Intent(this, ConValue.mTabClassArray[index]);
return intent;
}
}