前言:以前制作菜单使用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