Android Material Design: NavigationView抽屉导航菜单

快来打我* 2024-02-17 16:16 42阅读 0赞

**Android Material Design: NavigationView抽屉导航菜单**

之前我写了一篇关于实现Android抽屉导航菜单栏的文章《基于Android官方DrawerLayout实现抽屉导航菜单》，文章链接地址：[http://blog.csdn.net/zhangphil/article/details/48710453][http_blog.csdn.net_zhangphil_article_details_48710453]  
在最新的Android Material Design中引入了NavigationView增强DrawerLayout。也可以认为是谷歌官方Android SDK对抽屉导航菜单栏进一步代码规范化。  
效果如图所示：

![Center][]

测试的主Activity MainActivity.java :

package zhangphil.materialdesign;
    
    import android.app.Activity;
    import android.graphics.Color;
    import android.os.Bundle;
    import android.support.design.widget.NavigationView;
    import android.support.v4.view.GravityCompat;
    import android.support.v4.widget.DrawerLayout;
    import android.view.MenuItem;
    import android.view.View;
    import android.widget.Button;
    import android.widget.TextView;
    import android.widget.Toast;
    
    public class MainActivity extends Activity {
    
    	private DrawerLayout drawerLayout;
    
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.activity_main);
    
    		NavigationView navigationView = (NavigationView) findViewById(R.id.navigationView);
    		drawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
    		navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
    			@Override
    			public boolean onNavigationItemSelected(MenuItem menuItem) {
    				menuItem.setChecked(true);
    
    				// 关闭
    				drawerLayout.closeDrawers();
    
    				String t = menuItem.getTitle() + "";
    				Toast.makeText(getApplicationContext(), t, Toast.LENGTH_SHORT).show();
    
    				return true;
    			}
    		});
    
    		TextView text1 = (TextView) findViewById(android.R.id.text1);
    		text1.setText("头部1");
    		text1.setTextColor(Color.RED);
    		TextView text2 = (TextView) findViewById(android.R.id.text2);
    		text2.setText("头部2");
    		text2.setTextColor(Color.BLUE);
    
    		Button button = (Button) findViewById(R.id.button);
    		button.setOnClickListener(new View.OnClickListener() {
    
    			@Override
    			public void onClick(View v) {
    				// 由Button也可以打开
    				// 从左边打开
    				drawerLayout.openDrawer(GravityCompat.START);
    			}
    		});
    	}
    
    	// @Override
    	// public boolean onOptionsItemSelected(MenuItem item) {
    	// if (item.getItemId() == android.R.id.home){
    	//
    	// //打开
    	// drawerLayout.openDrawer(GravityCompat.START);
    	// }
    	//
    	// return super.onOptionsItemSelected(item);
    	// }
    }

MainActivity.java需要的布局文件：activity\_main.xml文件：

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/drawerLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >
    
            <Button
                android:id="@+id/button"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="打开 " />
    
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="主界面"
                android:textSize="50sp" />
        </LinearLayout>
    
        <android.support.design.widget.NavigationView
            android:id="@+id/navigationView"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="left"
            android:fitsSystemWindows="true"
            app:headerLayout="@android:layout/simple_list_item_2"
            app:itemIconTint="#ff5252"
            app:itemTextColor="#42a5f5"
            app:menu="@menu/main" >
        </android.support.design.widget.NavigationView>
    
    </android.support.v4.widget.DrawerLayout>

activity\_main.xml用到的的菜单布局文件main.xml代码：

<?xml version="1.0" encoding="utf-8"?>
    <menu xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    
        <item
            android:checkableBehavior="single"
            android:title="第一组菜单">
            <item
                android:id="@+id/open"
                android:icon="@drawable/ic_launcher"
                android:title="打开"/>
            <item
                android:id="@+id/close"
                android:icon="@drawable/ic_launcher"
                android:title="关闭"/>
            <item
                android:id="@+id/create"
                android:icon="@drawable/ic_launcher"
                android:title="新建"/>
        </item>
        <item android:title="第二组菜单">
            <menu>
                <item
                    android:id="@+id/exit"
                    android:icon="@drawable/ic_launcher"
                    android:title="退出"/>
                <item
                    android:id="@+id/about"
                    android:icon="@drawable/ic_launcher"
                    android:title="关于"/>
            </menu>
        </item>
    
    </menu>

（1）app:headerLayout表示要在弹出的抽屉导航菜单的顶部（头部）加载的布局。  
（2）app:itemIconTint设置抽屉导航菜单中图标icon的颜色。  
（3）app:itemTextColor设置抽屉导航菜单中的字体颜色。  
（4）app:menu设置加载的菜单布局文件。

[http_blog.csdn.net_zhangphil_article_details_48710453]: http://blog.csdn.net/zhangphil/article/details/48710453
[Center]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/30/31cc1a35e4f442a9a592ab762c25bada.png