tabhost实现android菜单切换
Posted slgkaifa
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了tabhost实现android菜单切换相关的知识，希望对你有一定的参考价值。
做APP项目已经有半个月了。慢慢地熟悉了这个开发环境和开发套路。
虽然是摸着石头过河。但也渐渐看到了水的深度！
作为一个电商项目APP，势必会涉及究竟部菜单条的功能。自己实现这个功能的过程是崎岖的，最总完毕之后才发现这样的崎岖对于自己的学习是非常有帮助的！
对于这部分的探索拿来和大家分享，希望能够相助于大家！
实现app底部菜单条的方法有非常多种，亲身尝试了tabhost和fragment两种方式，终于还是成功做成了tabhost,拿来和大家分享。
事实上tabhost实现底部菜单条的功能非常easy。真正的高手已经给我们建立了基础。须要我们做的就是熟悉并运用好它就可以实现我们要的功能。所以我们就非常有必要认真地研究一下abhost内部到底有什么好东西。它又是怎么帮助我们实现的页面切换。
首先让我们来认识一下tabhost中很重要的一些函数indicator(指示器)、content和tag.一个tab通常包括了indiicator(指示器)、content（tab相应展示的页面view。能够为这个view的id或者是一个intent）、tag。
当中TabSpec就是用来辅助设置这些选项：
<1> Indicator一般是设置tab的名称label和icon;
<2> Content：能够是一个view的id，也能够通过TabContentFactory创建一个view，还能够是一个Intent组件来载入一个activity。
用到的java类代码：
<span style="font-family:KaiTi_GB2312;">package jczb.shoping.ui; import android.app.Activity; import android.app.TabActivity; import android.content.Intent; import android.graphics.Color; import android.os.Bundle; import android.view.KeyEvent; import android.view.View; import android.view.View.OnClickListener; import android.view.animation.Animation; import android.view.animation.AnimationUtils; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TabHost; import android.widget.TextView; import android.widget.TabHost.TabSpec; public class MenuActivity extends TabActivity implements OnClickListener{ LinearLayout llchannel1,llchannel2,llchannel3,llchannel4; ImageView ivMain,ivCart,ivMine; Intent itMain,itCart,itMine; int mCurTabId = R.id.channel1; //定义tab的四个button public static String TAB_TAG_ANBIAOCHECK="anbiaocheck"; public static String TAB_TAG_SETTINGS="settings"; public static String TAB_TAG_DOWNLOAD="download"; public static TabHost mTabHost; private Animation left_in,left_out; private Animation right_in,right_out; @SuppressWarnings("deprecation") @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_menu); prepareAnim(); prepareIntent(); setupIntent(); findViewById(); initView(); } /*依据ID拿到控件*/ protected void findViewById() { ivMain = (ImageView)findViewById(R.id.imageView1); ivCart = (ImageView)findViewById(R.id.imageView2); ivMine = (ImageView)findViewById(R.id.imageView3); llchannel1 = (LinearLayout)findViewById(R.id.channel1); llchannel2 = (LinearLayout)findViewById(R.id.channel2); llchannel3 = (LinearLayout)findViewById(R.id.channel3); } /** * 动画效果 */ private void prepareAnim() { left_in = AnimationUtils.loadAnimation(this, R.anim.left_in); left_out = AnimationUtils.loadAnimation(this, R.anim.left_out); right_in = AnimationUtils.loadAnimation(this, R.anim.right_in); right_out = AnimationUtils.loadAnimation(this, R.anim.right_out); } /** * Intent跳转信息 */ private void prepareIntent(){ //首页 itMain = new Intent(this,MainActivity.class); //购物车 itCart = new Intent(this,CartActivity.class); //我的 itMine = new Intent(this,MineActivity.class); } /*供setupIntent调用 * 标记tag、载入图片，切换页面 * */ private TabHost.TabSpec buildTabSpec(String tag, int resLabel, int resIcon, final Intent content) { return mTabHost .newTabSpec(tag) .setIndicator(getString(resLabel), getResources().getDrawable(resIcon)) .setContent(content); } public static void setCurrentTabByTag(String tab) { mTabHost.setCurrentTabByTag(tab); } /** * 获取Tabhost */ private void setupIntent() { mTabHost = getTabHost(); mTabHost.addTab(buildTabSpec(TAB_TAG_ANBIAOCHECK, R.string.securitycheck_btn_str, R.drawable.main_bottom_tab_home_normal, itMain)); mTabHost.addTab(buildTabSpec(TAB_TAG_SETTINGS,R.string.securitycheck_btn_str, R.drawable.main_bottom_tab_cart_focus, itCart)); mTabHost.addTab(buildTabSpec(TAB_TAG_DOWNLOAD, R.string.securitycheck_btn_str, R.drawable.main_bottom_tab_personal_focus, itMine)); } /*单击事件监听器*/ protected void initView() { llchannel1.setOnClickListener(this); llchannel2.setOnClickListener(this); llchannel3.setOnClickListener(this); } @Override public boolean onKeyDown(int keyCode,KeyEvent event){ if (keyCode == KeyEvent.KEYCODE_BACK && event.getRepeatCount() == 0) { ivMain.performClick(); return true; } return super.onKeyDown(keyCode, event); } /*响应单位价格事件、改变button图片*/ @Override public void onClick(View v){ if (mCurTabId == v.getId()) { return; } int checkedId = v.getId(); final boolean o; if (mCurTabId < checkedId) { o = true; } else { o = false; } if (o) { mTabHost.getCurrentView().startAnimation(left_out); } else { mTabHost.getCurrentView().startAnimation(right_out); } switch (checkedId) { //实现相似于各个子tabhost点击之后图片切换的效果 case R.id.channel1: mTabHost.setCurrentTabByTag(TAB_TAG_ANBIAOCHECK); ivMine.setImageResource(R.drawable.main_bottom_tab_personal_focus); ivCart.setImageResource(R.drawable.main_bottom_tab_cart_focus); ivMain.setImageResource(R.drawable.main_bottom_tab_home_normal); break; case R.id.channel2: mTabHost.setCurrentTabByTag(TAB_TAG_SETTINGS); ivMine.setImageResource(R.drawable.main_bottom_tab_personal_focus); ivCart.setImageResource(R.drawable.main_bottom_tab_cart_normal); ivMain.setImageResource(R.drawable.main_bottom_tab_home_focus); break; case R.id.channel3: mTabHost.setCurrentTabByTag(TAB_TAG_DOWNLOAD); ivMine.setImageResource(R.drawable.main_bottom_tab_personal_normal); ivCart.setImageResource(R.drawable.main_bottom_tab_cart_focus); ivMain.setImageResource(R.drawable.main_bottom_tab_home_focus); break; default: break; } if (o) { mTabHost.getCurrentView().startAnimation(left_in); }else { mTabHost.getCurrentView().startAnimation(right_in); } mCurTabId = checkedId; } } </span>
页面的xml代码；
<span style="font-family:KaiTi_GB2312;"><?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:background="@color/black"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/white"
android:orientation="vertical" >
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" >
</FrameLayout>
<TabWidget
android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#000000"
android:visibility="gone" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="@color/whitesmoke" >
<!-- 主页 -->
<LinearLayout
android:id="@+id/channel1"
style="@style/main_tab_but_linear" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_weight="1"
android:src="@drawable/main_bottom_tab_home_normal" />
</LinearLayout>
<!-- 购物车 -->
<LinearLayout
android:id="@+id/channel2"
style="@style/main_tab_but_linear" >
<ImageView
android:id="@+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_weight="1"
android:src="@drawable/main_bottom_tab_cart_focus"/>
</LinearLayout>
<!-- 我的-->
<LinearLayout
android:id="@+id/channel3"
style="@style/main_tab_but_linear"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:orientation="vertical" >
<ImageView
android:id="@+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_weight="1"
android:src="@drawable/main_bottom_tab_personal_focus" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</TabHost>
</span>注意：
代码中设计到了其它跳转页面的xml。须要的话自己建立空白的xml页面就可以！
虽然实现了须要的功能，可是对于tabhost的理解还有待提高。对于tabhost中固定使用的三个函数还会在之后的文章中具体介绍。敬请期待！
以上是关于tabhost实现android菜单切换的主要内容，如果未能解决你的问题，请参考以下文章
Android 片段，在 TabHost 中找不到 id 的视图