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); } */ }