仿知乎日报(4)_加载侧滑菜单

完成侧滑菜单布局

1、界面分析

从“日常心理学”开始是一个ListView的内容，上面包括“首页”的内容是ListView的一个HeadView。

2、代码

1、menu_layout.xml（蓝色部分）

<?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="wrap_content"
    android:paddingTop="23dp"
    android:background="#009dd7"
    android:orientation="vertical">

    <TextView
        android:id="@+id/login"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:drawableLeft="@drawable/comment_avatar"
        android:drawablePadding="8dp"
        android:enabled="true"
        android:gravity="center_vertical"
        android:paddingLeft="13dp"
        android:paddingTop="13dp"
        android:layout_marginBottom="33dp"
        android:text="请登录"
        android:textColor="#ffffff"
        android:textSize="16sp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginBottom="13dp"
        android:layout_marginTop="13dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/favorities"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:clickable="true"
            android:drawableLeft="@drawable/favorites"
            android:drawablePadding="8dp"
            android:enabled="true"
            android:gravity="center_vertical"
            android:text="我的收藏"
            android:textColor="#ffffff" />

        <TextView
            android:id="@+id/download"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:clickable="true"
            android:drawableLeft="@drawable/favorites"
            android:drawablePadding="8dp"
            android:enabled="true"
            android:gravity="center_vertical"
            android:text="离线下载"
            android:textColor="#ffffff" />

    </LinearLayout>
</LinearLayout>

2、menu_head _view.xml

<?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">

    <include layout="@layout/menu_layout" />

    <TextView
        android:id="@+id/to_main"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#33000000"
        android:clickable="true"
        android:drawableLeft="@drawable/home"
        android:enabled="true"
        android:gravity="center_vertical"
        android:padding="13dp"
        android:text="首页"
        android:textColor="#009dd7"
        android:textSize="16sp" />

</LinearLayout>

3、menu_item.xml（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="53dp"
    android:descendantFocusability="blocksDescendants"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/menu_item"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_margin="13dp"
        android:layout_weight="1"
        android:background="#ffffff"
        android:text="知乎读吧"
        android:textColor="#000000"
        android:textSize="16sp" />

    <ImageButton
        android:id="@+id/isOrder"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginRight="53dp"
        android:focusable="false"
        android:background="@drawable/home_arrow" />

</LinearLayout>

4、MainAcivity.java(部分代码)

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    initView();
    initData();
    initEvent();
}

初始化布局

private void initView() {
    setContentView(R.layout.activity_main);
    //设置状态栏为透明
    if (Build.VERSION.SDK_INT >= 21) {
        View decorView = getWindow().getDecorView();
        int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                | View.SYSTEM_UI_FLAG_LAYOUT_STABLE;
        decorView.setSystemUiVisibility(option);
        getWindow().setStatusBarColor(Color.TRANSPARENT);
    }else {
        LinearLayout title_bar = (LinearLayout) findViewById(R.id.title_bar);
        title_bar.setPadding(0,0,0,0);
        ViewGroup.LayoutParams layoutParams = title_bar.getLayoutParams();
        int height = DensityUtil.dip2px(MainActivity.this,53);
        layoutParams.height = height;
        title_bar.setLayoutParams(layoutParams);

    }
    drawer_layout = (DrawerLayout)findViewById(R.id.drawer_layout);
    menu_title_bar = (ImageButton)findViewById(R.id.menu_title_bar);
    tv_title_bar = (TextView)findViewById(R.id.tv_title_bar);
    message_title_bar = (ImageButton)findViewById(R.id.message_title_bar);
    setting_title_bar = (ImageButton)findViewById(R.id.setting_title_bar);
    menuHeaderView = View.inflate(MainActivity.this,R.layout.menu_header_view,null);

    login = (TextView)menuHeaderView.findViewById( R.id.login );
    favorities = (TextView)menuHeaderView.findViewById( R.id.favorities );
    download = (TextView)menuHeaderView.findViewById( R.id.download );
    toMain = (TextView)menuHeaderView.findViewById( R.id.to_main );
    listViewMenu = (ListView)findViewById( R.id.list_view_menu );
}

初始化数据

private void initData() {
    //添加Fragment

    ......


    menuItems = new ArrayList<>();
    for (int i = 0;i<menus.length;i++){
        menuItems.add(new MenuItem(menus[i],false));
    }
    menuAdapter = new MenuAdapter(MainActivity.this,menuItems);
    listViewMenu.addHeaderView(menuHeaderView);
    listViewMenu.setAdapter(menuAdapter);
}

添加事件

private void initEvent() {
    //主界面titleBar事件监听

    ......

    /**
     * 侧滑菜单单击监听
     */
    login.setOnClickListener(new MyOnClickListener());
    favorities.setOnClickListener(new MyOnClickListener());
    download.setOnClickListener(new MyOnClickListener());
    toMain.setOnClickListener(new MyOnClickListener());
    /**
     * listView监听
     */
    listViewMenu.setOnItemClickListener(new MyOnItemClickListener());
}

class MyOnItemClickListener implements AdapterView.OnItemClickListener{

    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        Log.d("EYCK",position+"");
        if(position != 0) {
            isSetting = false;
            message_title_bar.setVisibility(View.GONE);
            setting_title_bar.setBackgroundResource(R.drawable.theme_add);
            tv_title_bar.setText(menus[position-1]);
        }else {
            isSetting = true;
            message_title_bar.setVisibility(View.VISIBLE);
            setting_title_bar.setBackgroundResource(R.drawable.abc_ic_menu_moreoverflow_mtrl_alpha);
            tv_title_bar.setText("首页");
        }
        BaseFragment destFragment = fragments.get(position);
        switchFragments(mFragment,destFragment);
    }
}

class MyOnClickListener implements View.OnClickListener{

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            //其他点击事件

            ......

            case  R.id.to_main:
                position = 0;
                isSetting = true;
                message_title_bar.setVisibility(View.VISIBLE);
                setting_title_bar.setBackgroundResource(R.drawable.abc_ic_menu_moreoverflow_mtrl_alpha);
                BaseFragment destFragment = fragments.get(0);
                switchFragments(mFragment,destFragment);
                break;
        }
    }
}

这里要注意的一点是由于我们为ListView添加了HeadView，因此ListView的下标是从1开始而不是从0开始。