title: 带你实现开发者头条(二) 实现左滑菜单

tags: 左滑菜单,android 自带侧滑,DrawerLayout grammar_cjkRuby: true ---

今天开始模仿开发者头条的侧滑菜单，是本系列第二篇文章，相信大家已经看到很多app使用这种侧滑。今天我来教大家用android自带DrawerLayout控件实现。

DrawerLayout是SupportLibrary包中实现了侧滑菜单效果的控件，可以说DrawerLayout是因为第三方控件如MenuDrawer等的出现之后，google借鉴而出现的产物。DrawerLayout分为侧边菜单和主内容区两部分，侧边菜单可以根据手势展开与隐藏（DrawerLayout自身特性），主内容区的内容可以随着菜单的点击而变化（这需要使用者自己实现）。

一.先上效果图:

二.代码实现

1.drawerLayout其实是一个布局控件，跟LinearLayout等控件是一种东西，但是drawerLayout带有滑动的功能。只要按照drawerLayout的规定布局方式写完布局，就能有侧滑的效果。我这边把侧滑菜单的内容放一个布局文件了。

注意事项

主内容区的布局代码要放在侧滑菜单布局的前面,这可以帮助DrawerLayout判断谁是侧滑菜单，谁是主内容区 侧滑菜单的部分的布局（这里是ListView）可以设置layout_gravity属性，他表示侧滑菜单是在左边还是右边。

2.MainActivity.java 继承FragmentActivity

1).设置内容Fragment，设置状态栏 2).处理左侧点击事件,在点击事件中设置选中背景，关闭左边侧滑菜单。

public class MainActivity extends FragmentActivity{    private DrawerLayout mDrawerLayout;    private RelativeLayout rlHome, rlGift, rlShare;    private int currentSelectItem = R.id.rl_home;// 默认首页    private ContentFragment contentFragment;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);        findViewById(R.id.iv_menu).setOnClickListener(clickListener);                initLeftMenu();//初始化左边菜单                contentFragment=new ContentFragment();        getSupportFragmentManager().beginTransaction().add(R.id.content_frame,contentFragment).commit();          setWindowStatus();    }    private void initLeftMenu() {        rlHome = (RelativeLayout) findViewById(R.id.rl_home);        rlGift = (RelativeLayout) findViewById(R.id.rl_gift);        rlShare = (RelativeLayout) findViewById(R.id.rl_share);        rlHome.setOnClickListener(onLeftMenuClickListener);        rlGift.setOnClickListener(onLeftMenuClickListener);        rlShare.setOnClickListener(onLeftMenuClickListener);        rlHome.setSelected(true);    }    private OnClickListener onLeftMenuClickListener = new OnClickListener() {        @Override        public void onClick(View v) {            if (currentSelectItem != v.getId()) {
   //防止重复点击                currentSelectItem=v.getId();                noItemSelect();                                switch (v.getId()) {                case R.id.rl_home:                    rlHome.setSelected(true);                    contentFragment.setContent("这是首页");                    break;                case R.id.rl_gift:                    rlGift.setSelected(true);                    contentFragment.setContent("这是礼物兑换");                    break;                case R.id.rl_share:                    rlShare.setSelected(true);                    contentFragment.setContent("这是我的分享");                    break;                }                                mDrawerLayout.closeDrawer(Gravity.LEFT);            }        }    };        private void noItemSelect(){        rlHome.setSelected(false);        rlGift.setSelected(false);        rlShare.setSelected(false);    }    private OnClickListener clickListener = new OnClickListener() {        @Override        public void onClick(View v) {            switch (v.getId()) {            case R.id.iv_menu:// 打开左边抽屉                mDrawerLayout.openDrawer(Gravity.LEFT);                break;            }        }    };    // 设置状态栏    private void setWindowStatus() {        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {            // 透明状态栏            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);            // 透明导航栏            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);            // 设置状态栏颜色            getWindow().setBackgroundDrawableResource(R.color.main_color);        }    }}

3.左侧菜单item选中背景的布局文件 selector_left_menu_item.xml。

4.ContentFragment 显示内容的Fragment 这里我加了一个设置内容的方法，就是用来点击左侧切换显示用的。

public class ContentFragment extends Fragment{    private TextView tvContent;        @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState){        View rootView=LayoutInflater.from(getActivity()).inflate(R.layout.fragment_content, null);        tvContent=(TextView) rootView.findViewById(R.id.tv_content);        return rootView;    }        public void setContent(String content){        tvContent.setText(content);    }}

5.drawerLayout与Fragment是什么关系？

我们看到很多使用drawerLayout的代码中都同时使用了Fragment，这会造成误解，以为使用drawerLayout必须用到Fragment，其实这是错误的，使用Fragment是因为在侧滑菜单被点击的时候，主内容区如果内容比较复杂，用Fragment去填充会更容易，如果你的主内容区只是一个简单的字符串，只想在不同菜单点击的时候更新一下字符串的内容，我觉得没必要用Fragment。我这边用Fragment所做的就是更新字符串内容这么简单。