SlidingPaneLayout,DrawerLayout,ActionBar,NavigationView 详解 <三> NavigationView,DrawerLayout 结合ActionB

 NavigationView,DrawerLayout 结合ActionBar

参考:http://blog.csdn.net/Rodulf/article/details/50419899

代码:NavigationView和DrawerLayout的结合


这个结合主要分为两步:

0:实现DrawerLayout 和ActionBar的联动,在第二个子控件(就是NavigationView)里面添加一个参数android:layout_gravity="left|start"

1:NavigationView的设置。里面有两个重要的自有参数就是设置menu和headerLayout

 


具体步骤:

0:布局,里面最关键的就是android:layout_gravity="left|start"

注意NavaigationView 是design包里面的需要导入。

布局里面要要导入自定义的appNs,xmlns:app="http://schemas.android.com/apk/res-auto"



<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"  xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"  android:layout_height="match_parent"  xmlns:app="http://schemas.android.com/apk/res-auto"  android:id="@+id/drawerlayout"  tools:context=".MainActivity">

    <LinearLayout  android:layout_width="match_parent"  android:layout_height="match_parent">
        <TextView android:text="Hello World!"  android:textSize="45sp"  android:layout_width="wrap_content"  android:layout_height="wrap_content" />
    </LinearLayout>
    <android.support.design.widget.NavigationView  android:layout_width="match_parent"  android:layout_height="match_parent"  android:id="@+id/navigationView"  android:layout_gravity="left|start"  app:menu="@menu/navigation_menu"  app:headerLayout="@layout/layout_menu_header"/>

</android.support.v4.widget.DrawerLayout>

1:然后在主函数添加ActionBar,并且设置这个联动的设置:


    mToggle = new ActionBarDrawerToggle(this,mDrawerLayout,0,0);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);//设置显示为3条杠的形式  mToggle.syncState();
    //看 源码 ActionBarDrawerToggle有 实现 Drawerlistener所以 可以添加  mDrawerLayout.setDrawerListener(mToggle);

//ActionBar来控制DrawerLayout @Override
public boolean onOptionsItemSelected(MenuItem item) {
    if(mToggle.onOptionsItemSelected(item)){
        return true;
    }
    return super.onOptionsItemSelected(item);
}
 
 

2:在res下面创建menu的文件夹,

然后在menu的文件夹下面创建navigation_menu文件

这个文件可以设置导航布局NavigationView的菜单栏,

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group>
<item android:id="@+id/menu_1" android:title="First" android:icon="@mipmap/ic_launcher" android:checked="true"/>
<item android:id="@+id/menu_2" android:title="Second" android:icon="@mipmap/ic_launcher"/>
<item android:id="@+id/menu_3" android:title="Third" android:icon="@mipmap/ic_launcher"/>
<item android:id="@+id/menu_exit" android:title="退出" android:icon="@mipmap/ic_launcher"/>
    </group>
    <item android:title="小分组">
        <menu>
            <item android:id="@+id/group_1" android:title="设置"></item>
            <item android:id="@+id/group_2" android:title="我的"></item>
            <item android:id="@+id/group_3" android:title="退出"></item>
        </menu>
    </item>
</menu>

在布局里面的NavigationView 里面的

app:menu="@menu/navigation_menu"
 

然后在activity 里面创建监听器来监听点击事件:

        //NavigationView 设置监听事件  mNavigationView = (NavigationView)findViewById(R.id.navigationView);
        mNavigationView.setNavigationItemSelectedListener(this);
    }

    //Returns:true to display the item as the selected item  //返回true,可以展示选中的 item  @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        int itemId = item.getItemId();
        switch (itemId){
            case R.id.menu_1:
                Toast.makeText(this,"111",Toast.LENGTH_LONG).show();
                break;
            case R.id.menu_2:
                Toast.makeText(this,"222",Toast.LENGTH_LONG).show();
                break;
            case R.id.menu_3:
                Toast.makeText(this,"333",Toast.LENGTH_LONG).show();
                break;
            case R.id.menu_exit:
                finish();
                break;
        }
// return false;  return true;
    }

3:在layout文件夹下面创建layout_menu_header文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  android:orientation="vertical" android:layout_width="match_parent"  android:layout_height="match_parent">
<ImageView  android:layout_width="100dp"  android:layout_height="100dp"  android:src="@mipmap/yoyo"/>
    <TextView  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:text="用户名"/>
    <TextView  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:text="高级 会员 "/>
</LinearLayout>

然后在NavigationView里面添加属性

app:headerLayout="@layout/layout_menu_header"

4:Activity的全部代码:

package tech.androidstudio.navigationviewdrawerlayoutdemo;

import android.support.design.widget.NavigationView;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity implements NavigationView.OnNavigationItemSelectedListener {

    private DrawerLayout mDrawerLayout;
    private ActionBarDrawerToggle mToggle;
    private NavigationView mNavigationView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mDrawerLayout = (DrawerLayout)findViewById(R.id.drawerlayout);

        mToggle = new ActionBarDrawerToggle(this,mDrawerLayout,0,0);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);//设置显示为3条杠的形式  mToggle.syncState();
        //看 源码 ActionBarDrawerToggle有 实现 Drawerlistener所以 可以添加  mDrawerLayout.setDrawerListener(mToggle);


        //NavigationView 设置监听事件  mNavigationView = (NavigationView)findViewById(R.id.navigationView);
        mNavigationView.setNavigationItemSelectedListener(this);
    }


    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if(mToggle.onOptionsItemSelected(item)){
            return true;
        }
        return super.onOptionsItemSelected(item);
    }

    //Returns:true to display the item as the selected item  //返回true,可以展示选中的 item  @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        int itemId = item.getItemId();
        switch (itemId){
            case R.id.menu_1:
                Toast.makeText(this,"111",Toast.LENGTH_LONG).show();
                break;
            case R.id.menu_2:
                Toast.makeText(this,"222",Toast.LENGTH_LONG).show();
                break;
            case R.id.menu_3:
                Toast.makeText(this,"333",Toast.LENGTH_LONG).show();
                break;
            case R.id.menu_exit:
                finish();
                break;
        }
// return false;  return true;
    }

    //TODO 注意了这里ActionBar DrawerLayout联动,需要重写的方法是 onOptionsItemSelected而不是onContextItemSelected   /**  @Override  public boolean onContextItemSelected(MenuItem item) { // return super.onContextItemSelected(item);  Toast.makeText(this,"Toggle Clicked",Toast.LENGTH_LONG).show();  if(mToggle.onOptionsItemSelected(item)){  return true;  }  return super.onContextItemSelected(item);  }  */ }

你可能感兴趣的:(SlidingPaneLayout,DrawerLayout,ActionBar,NavigationView 详解 <三> NavigationView,DrawerLayout 结合ActionB)