一、安卓5.0是是有有史以来最重要的安卓版本之一,这其中有很大部分要归功于material design的引入,这种新的设计语言让整个安卓的用户体验焕然一新。这种设计对于开发者,尤其是那些在意向后兼容的开发者来说是一种挑战。在Android Design Support Library的帮助下,带来了一些重要的material design控件。你可以在这里面找到navigation drawer view,输入控件的悬浮标签,悬浮操作按钮,snackbar,选项卡以及将这些控件结合在一起的手势滚动框架。
Navigation View
抽屉导航是app识别度与内部导航的关键,保持这里设计上的一致性对app的可用性至关重要,尤其是对于第一次使用的用户。 NavigationView 通过提供抽屉导航所需的框架让实现更简单,同时它还能够直接通过菜单资源文件直接生成导航元素。下面介绍一些关于它的使用方法:
二、首先,这个控件在一个独立的包里,使用前要先导入它的包:根据自己android studio的版本导入相应的包
compile 'com.android.support:design:24.2.1'
其次,应该意识到,这是一个控件,所以把NavigationView作为DrawerLayout的内容视图来使用,比如下面的布局:
<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/main_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:background="#cc1448" tools:context="com.dc.xutils3.MainActivity"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent"> <Button android:id="@+id/btn" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="测试"/> </LinearLayout> <android.support.design.widget.NavigationView android:background="#dede56" android:id="@+id/navigation" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="left" app:headerLayout="@layout/nav_header" app:menu="@menu/nav_menu"/> </android.support.v4.widget.DrawerLayout>
你会注意到NavigationView的两个属性:app:headerLayout - 控制头部的布局, app:menu - 导航菜单的资源文件
(也可以在运行时配置)NavigationView处理好了和状态栏的关系,可以确保NavigationView 在API21以上的设备上正确的和状态栏交互。最简单
的抽屉菜单就是几个可点击的菜单集合:
在资源文件夹下创建menu文件夹,在其中创建一个menu文件:内容如下:
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <group> <item android:title="目录"> <menu> <item android:id="@+id/item1" android:icon="@drawable/ic_category_13" android:title="首页"/> </menu> </item> <item android:id="@+id/item2" android:icon="@drawable/ic_category_28" android:title="精彩推荐" /> <item android:id="@+id/item3" android:icon="@drawable/ic_category_30" android:title="最新消息" /> <item android:id="@+id/item4" android:icon="@drawable/ic_category_31" android:title="热门消息" /> <item android:id="@+id/item5" android:icon="@drawable/ic_category_36" android:title="红包福利" /> </group> </menu>这个文件在activity_main.xml中通过 app :menu= "@menu/nav_menu"来引入。
然后就是创建一个侧滑栏上面的布局:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="200dp" android:background="#59ac69" android:orientation="vertical"> <ImageView android:id="@+id/nav_header_image" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:src="@drawable/ic_category_34"/> <RelativeLayout android:layout_below="@+id/nav_header_image" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/nav_header_image_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="用户名:" android:textSize="16sp"/> </RelativeLayout> </RelativeLayout>
这个文件在activity_main.xml中通过app:headerLayout="@layout/nav_header"来引入。
最后就是MainActivity中的代码了,其中给了详细的注释,就不啰嗦了:
package com.dc.xutils3; import android.os.Bundle; import android.support.annotation.NonNull; import android.support.design.widget.NavigationView; import android.support.design.widget.Snackbar; import android.support.v4.widget.DrawerLayout; import android.support.v7.app.AppCompatActivity; import android.view.MenuItem; import android.view.View; import android.widget.Button; import android.widget.ImageView; import android.widget.TextView; import android.widget.Toast; public class MainActivity extends AppCompatActivity implements View.OnClickListener { protected Button mBtn; protected NavigationView mNavigation; protected DrawerLayout mMainLayout; private boolean flag=false; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.setContentView(R.layout.activity_main); initView(); mNavigation.setItemIconTintList(null); //获得侧滑栏里的头部的view View headerview=mNavigation.getHeaderView(0); //通过findViewById可以获得view里的控件 ImageView imageView= (ImageView) headerview.findViewById(R.id.nav_header_image); TextView textView= (TextView) headerview.findViewById(R.id.nav_header_image_text); //这里可以设置顶部图片的图片资源和点击事件 //imageView.setImageDrawable(); //下面可以设置点击事件和内容 textView.setText("设置"); //设置menu里的item的点击事件 mNavigation.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem item) { //根据itemid来判断要执行的响应事件 int itemid=item.getItemId(); switch(itemid){ //这里的id都是在创建menu时自己定义的(在menu文件中) case R.id.item1: //android 5.0提出的新控件,功能与Toast相似,用法在以后再写 Snackbar.make(mBtn,"点击了"+itemid,Snackbar.LENGTH_SHORT).show(); //Toast.makeText(MainActivity.this, "点击了"+itemid, Toast.LENGTH_SHORT).show(); break; case R.id.item2: Snackbar.make(mBtn,"点击了"+itemid,Snackbar.LENGTH_SHORT).show(); break; case R.id.item3: Snackbar.make(mBtn,"点击了"+itemid,Snackbar.LENGTH_SHORT).show(); break; case R.id.item4: Snackbar.make(mBtn,"点击了"+itemid,Snackbar.LENGTH_SHORT).show(); break; case R.id.item5: Snackbar.make(mBtn,"点击了"+itemid,Snackbar.LENGTH_SHORT).show(); break; } //设置点击item后策划栏自动关闭 mMainLayout.closeDrawers(); //返回值是false点击后的item还原成原来的状态,返回true时item点击后处于点击的状态 return true; } }); mMainLayout.setDrawerListener(new DrawerLayout.DrawerListener() { @Override public void onDrawerSlide(View drawerView, float slideOffset) { } @Override public void onDrawerOpened(View drawerView) { flag=true; } @Override public void onDrawerClosed(View drawerView) { flag=false; } @Override public void onDrawerStateChanged(int newState) { } }); } //监听返回键,返回两次才退出,返回弹出确定退出窗口,都可以通过对onBackPressed的监听 //还可以使用监听onKeydown来实现 @Override public void onBackPressed() { if (flag) { mMainLayout.closeDrawers(); } else { super.onBackPressed(); } } @Override public void onClick(View view) { if (view.getId() == R.id.btn) { } } private void initView() { mBtn = (Button) findViewById(R.id.btn); mBtn.setOnClickListener(MainActivity.this); mNavigation = (NavigationView) findViewById(R.id.navigation); mMainLayout = (DrawerLayout) findViewById(R.id.main_layout); } }这就是 NavigationView的基本方法的使用!