转载

Android底部菜单的实现

前言:以前制作菜单使用TabHost,但是android 3.0以上就被废弃了,google已经不建议使这个类了。ActionBar也是菜单,不过在头部,算是导航了

===本文就介绍怎么制作底部菜单===

1、底部菜单就是一张图片加一个文本,点击的时候改变颜色,先自定义个类MenuButton

public class MenuButton extends RelativeLayout{  private ImageView ivMenu;//菜单图片  private TextView tvMenu;//菜单文本  private int norColor;//文本未选中颜色  private int fosColor;//文本选中颜色  private int norImage;//未选中图片  private int fosImage;//选中图片    @SuppressLint("InflateParams")  public MenuButton(Context context, AttributeSet attrs) {   super(context, attrs);   addView(LayoutInflater.from(context).inflate(R.layout.layout_menu_button, null));   ivMenu = (ImageView) findViewById(R.id.iv_menu_button);   tvMenu = (TextView) findViewById(R.id.tv_menu_button);  }  public void setValues(String text, int norColor, int fosColor, int norImage, int fosImage){   this.norColor = norColor;   this.fosColor = fosColor;   this.norImage = norImage;   this.fosImage = fosImage;   tvMenu.setText(text);   setChecked(false);  }  public void setChecked(boolean isChecked){   if(isChecked){    ivMenu.setImageResource(fosImage);    tvMenu.setTextColor(getResources().getColor(fosColor));   }else{    ivMenu.setImageResource(norImage);    tvMenu.setTextColor(getResources().getColor(norColor));    }  } } 

布局文件如下:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  android:layout_width="fill_parent"  android:layout_height="fill_parent" >  <ImageView   android:id="@+id/iv_menu_button"   android:layout_width="wrap_content"   android:layout_height="wrap_content"   android:contentDescription="@null"   android:layout_centerHorizontal="true" />  <TextView   android:id="@+id/tv_menu_button"   android:layout_below="@id/iv_menu_button"   android:layout_width="wrap_content"   android:layout_height="wrap_content"   android:layout_centerHorizontal="true" /> </RelativeLayout> 

2、定义好的MenuButton放在首页底部,同时加一个ViewPager

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  android:layout_width="match_parent"  android:layout_height="match_parent" >  <LinearLayout   android:id="@+id/lay_menu"   android:layout_width="match_parent"   android:layout_height="48dp"   android:background="@color/menu_bg"   android:layout_alignParentBottom="true"   android:orientation="horizontal" >   <com.lining.menutest.view.MenuButton    android:id="@+id/mb_phone"    style="@style/MenuButton" />   <com.lining.menutest.view.MenuButton    android:id="@+id/mb_msg"    style="@style/MenuButton" />   <com.lining.menutest.view.MenuButton    android:id="@+id/mb_user"    style="@style/MenuButton" />  </LinearLayout>  <android.support.v4.view.ViewPager   android:id="@+id/vp_main"   android:layout_width="match_parent"   android:layout_height="match_parent"   android:layout_above="@id/lay_menu" /> </RelativeLayout> 

3、主要的初始化方法如下

private void initViews() {  mbPhone = (MenuButton) findViewById(R.id.mb_phone);  mbMsg = (MenuButton) findViewById(R.id.mb_msg);  mbUser = (MenuButton) findViewById(R.id.mb_user);  mbPhone.setValues("联系人", R.color.gray_text, R.color.blue_text,   R.drawable.menu_phone_normal, R.drawable.menu_phone_selected);  mbMsg.setValues("短信", R.color.gray_text, R.color.blue_text,   R.drawable.menu_msg_normal, R.drawable.menu_msg_selected);  mbUser.setValues("用户", R.color.gray_text, R.color.blue_text,   R.drawable.menu_user_normal, R.drawable.menu_user_selected);  mbPhone.setOnClickListener(this);  mbMsg.setOnClickListener(this);  mbUser.setOnClickListener(this);  vpMain = (ViewPager) findViewById(R.id.vp_main);//ViewPager  List<Fragment> fragmentList = new ArrayList<Fragment>();  fragmentList.add(new PhoneFragment());  fragmentList.add(new MsgFragment());  fragmentList.add(new UserFragment());  //Activity需要继承自FragmentActivity  vpMain.setAdapter(new MyPagerAdapter(getSupportFragmentManager(), fragmentList));  vpMain.addOnPageChangeListener(new OnPageChangeListener() {   @Override   public void onPageScrollStateChanged(int arg0) {   }   @Override   public void onPageScrolled(int arg0, float arg1, int arg2) {   }   @Override   public void onPageSelected(int arg0) {   switch (arg0) {   case 0:    setPhoneChecked();    break;   case 1:    setMsgChecked();    break;   case 2:    setUserChecked();    break;   }   }  });  mbPhone.setChecked(true);//设置显示第一个 } 
public class MyPagerAdapter extends FragmentPagerAdapter{  List<Fragment> fragmentList;  public MyPagerAdapter(FragmentManager fragmentManager, List<Fragment> fragmentList){   super(fragmentManager);   this.fragmentList = fragmentList;  }  @Override  public int getCount() {   return fragmentList.size();  }  @Override  public Fragment getItem(int position) {   return fragmentList.get(position);  } } 

4、写好了,看一看效果

就是这么简单: http://files.cnblogs.com/files/pear-lemon/MenuTest.zip

正文到此结束
Loading...