你的位置:首页 > 操作系统

[操作系统]Android Material Design之 NavigationView侧滑界面自定义 随笔

一、侧滑界面Menu自定义:

在menu文件夹下新建activity_main_drawer.

 1 <? 2 <menu  3 <group android:checkableBehavior="single"> 4     <item android:id="@+id/nav_forWhy"   android:icon="@drawable/ic_nav_for_why" 5       android:title="十万个为什么" /> 6     <item android:id="@+id/nav_knowledge" android:icon="@drawable/ic_nav_knowledge" 7       android:title="百科知识" /> 8     <item android:id="@+id/nav_expo" android:icon="@drawable/ic_nav_expo" 9       android:title="科普博览" />10     <item android:id="@+id/nav_reader" android:icon="@drawable/ic_nav_reader"11       android:title="科普读物" />12     <item android:id="@+id/nav_favorite" android:icon="@drawable/ic_nav_favorite"13       android:title="我的私藏" />14   </group>15 16   <item android:title="其他">17     <menu>18       <item android:id="@+id/nav_author" android:icon="@drawable/ic_nav_author"19         android:title="作者"/>20       <item android:id="@+id/nav_about" android:icon="@drawable/ic_nav_about"21         android:title="版权说明" />22     </menu>23   </item>24 </menu>

 

二、侧滑界面头部布局自定义

在layout下新建nav_header_main.

 1 <? 2  3 <LinearLayout  4  5   android:layout_width="match_parent" 6  7   android:layout_height="@dimen/nav_header_height" 8  9   android:background="@drawable/side_nav_bar"10 11   android:paddingBottom="@dimen/activity_vertical_margin"12 13   android:paddingLeft="@dimen/activity_horizontal_margin"14 15   android:paddingRight="@dimen/activity_horizontal_margin"16 17   android:paddingTop="@dimen/activity_vertical_margin"18 19   android:theme="@style/ThemeOverlay.AppCompat.Dark"20 21   android:orientation="vertical"22 23   android:gravity="bottom">24 25 26 27   <ImageView android:layout_width="wrap_content"28 29     android:layout_height="wrap_content"30 31     android:paddingTop="@dimen/nav_header_vertical_spacing"32 33     android:src="@mipmap/ic_launcher"34 35     android:id="@+id/imageView" />36 37 38 39   <TextView android:layout_width="match_parent"40 41     android:layout_height="wrap_content"42 43     android:paddingTop="@dimen/nav_header_vertical_spacing"44 45     android:text="@string/app_name"46 47     android:textAppearance="@style/TextAppearance.AppCompat.Body1" />48 49 50 51   <TextView android:layout_width="wrap_content"52 53     android:layout_height="wrap_content"54 55     android:text="Encyclopedia World"56 57     android:id="@+id/textView" />58 59 60 61 </LinearLayout>

 

三、开始创建activity的布局文件

将自定义menu和头部布局添加到activity_main.
 1 <android.support.design.widget.NavigationView 2  3   android:id="@+id/nav_view" 4  5   android:layout_width="wrap_content" 6  7   android:layout_height="match_parent" 8  9   android:layout_gravity="start"10 11   android:fitsSystemWindows="true"12 13   app:headerLayout="@layout/nav_header_main"14 15   app:menu="@menu/activity_main_drawer" />

 

四、在activity声明并调用NavigationView
1、声明NavigationView:
1 NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);

2、对NavigationView每个item的进行监听:
 1 @Override 2  3 public boolean onNavigationItemSelected(MenuItem item) { 4  5   // Handle navigation view item clicks here. 6  7   int id = item.getItemId(); 8  9 10 11   switch (id){12 13     case R.id.nav_forWhy://十万个为什么14 15             break;16 17     case R.id.nav_knowledge://百科知识18 19            break;20 21     case R.id.nav_expo://科普博览22       break;23 24     case R.id.nav_reader://科普读物25 26            break;27 28     case R.id.nav_favorite://我的私藏29 30            break;31 32     case R.id.nav_author://作者33 34             break;35 36     case R.id.nav_about://版权说明37 38           break;39 40   }41 42 43 44   DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);45 46   drawer.closeDrawer(GravityCompat.START);//关闭侧滑界面47 48   return true;49 50 }

 

五、最终效果图:
 

Demo下载地址:http://zhushou.360.cn/detail/index/soft_id/3145828