原创出处:http://blog.csdn.net/yangyu20121224/article/details/9016223
1、布局文件:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<FrameLayout
android:id="@+id/<span style="color: rgb(255, 0, 0);">realcontent</span>"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
/>
<android.support.v4.app.FragmentTabHost
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"/>
</android.support.v4.app.FragmentTabHost>
</LinearLayout>
2、导航栏中图片的xml布局文件:(点击图片变色)另外3个类似
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="@drawable/tabbar_home_selected"/><!--选中状态-->
<item android:state_window_focused="false" android:drawable="@drawable/tabbar_home" /><!--未选中状态-->
</selector>
3、导航栏中文字的xml布局文件:(点击文字变色)在textview中添加: android:textColor="@drawable/tabhost_text"
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_selected="true" android:color="#0082FF"></item>
<item android:state_selected="false" android:color="#000000"></item>
</selector>
4、导航栏单个item的布局文件:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
android:orientation="vertical"
>
<ImageView
android:id="@+id/ivItem"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_gravity="center"
/>
<TextView
android:id="@+id/tvItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="@drawable/tabhost_text"
/>
</LinearLayout>
5、主Activity:public class MainActivity extends FragmentActivity {
private FragmentTabHost mTabHost;
//导航栏item对应的Fragment:
private Class[] mFragemntArrays = {Home.class,Message.class, Find.class,User.class};
//导航栏item图片对应的背景文件:
private int[] mImageArrays = {R.drawable.tabhost_home,R.drawable.tabhost_message,R.drawable.tabhost_find,R.drawable.tabhost_user}; //
private String[] mTextArrays={"首页","消息","发现","我"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initTabHost();//fragmenttabhost初始化
}
private void initTabHost() {
//实例化
mTabHost = (FragmentTabHost)findViewById(android.R.id.tabhost);
mTabHost.setup(this, getSupportFragmentManager(),<span style="color:#ff0000;">R.id.realcontent</span>);
int count = mFragemntArrays.length;
for (int i=0;i<count;i++){
TabHost.TabSpec tabSpec = mTabHost.newTabSpec(mTextArrays[i]).setIndicator(getTabItemView(i));
mTabHost.addTab(tabSpec,mFragemntArrays[i],null);
//设置没有分割线
mTabHost.getTabWidget().setDividerDrawable(null);
}
}
//导航栏item设置图片和文字
private View getTabItemView(int i) {
View view_item = LayoutInflater.from(this).inflate(R.layout.tabhost_item, null);
ImageView imageView = (ImageView) view_item.findViewById(R.id.ivItem);
TextView textView = (TextView) view_item.findViewById(R.id.tvItem);
imageView.setBackgroundResource(mImageArrays[i]);
textView.setText(mTextArrays[i]);
return view_item;
}
}
6、导航栏item对应的Fragment:
public class Message extends Fragment {
private View view;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
view = inflater.inflate(R.layout.message,null);
return view;
}
}