Android 自己实现 NavigationView Design Support Library 1

2023-11-07 18:48

本文主要是介绍Android 自己实现 NavigationView Design Support Library 1,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow

也欢迎大家转载本篇文章。分享知识,造福人民,实现我们中华民族伟大复兴!

       

转载请标明出处:
  http://blog.csdn.net/lmj623565791/article/details/46405409;
  本文出自:【张鸿洋的博客】

一、概述

Google I/O 2015 给大家带来了Android Design Support Library,对于希望做md风格的app的来说,简直是天大的喜讯了~大家可以通过Android Design Support Library该文章对其进行了解,也可以直接在github上下载示例代码运行学习。为了表达我心中的喜悦,我决定针对该库写一系列的文章来分别介绍新增加的控件。

ok,那么首先介绍的就是NavigationView。

注意下更新下as的SDK,然后在使用的过程中,在build.gradle中添加:

compile 'com.android.support:design:22.2.0'
  • 1

在md风格的app中,例如如下风格的侧滑菜单非常常见:

在之前的设计中,你可能需要考虑如何去布局实现,例如使用ListView;再者还要去设计Item的选中状态之类~~

but,现在,google提供了NavigationView,你只需要写写布局文件,这样的效果就ok了,并且兼容到Android 2.1,非常值得去体验一下。接下来我们来介绍如何去使用这个NavigationView

二、使用

使用起来very simple ,主要就是写写布局文件~

(一)布局文件
<?xml version="1.0" encoding="utf-8"?><android.support.v4.widget.DrawerLayout    android:id="@+id/id_drawer_layout"    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:fitsSystemWindows="true"    >    <RelativeLayout        android:layout_width="match_parent"        android:layout_height="match_parent">        <android.support.v7.widget.Toolbar            android:id="@+id/id_toolbar"            android:layout_width="match_parent"            android:layout_height="?attr/actionBarSize"            android:background="?attr/colorPrimary"            app:layout_scrollFlags="scroll|enterAlways"            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>        <TextView            android:id="@+id/id_tv_content"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_centerInParent="true"            android:text="HelloWorld"            android:textSize="30sp"/>    </RelativeLayout>    <android.support.design.widget.NavigationView        android:id="@+id/id_nv_menu"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_gravity="left"        android:fitsSystemWindows="true"        app:headerLayout="@layout/header_just_username"        app:menu="@menu/menu_drawer"        /></android.support.v4.widget.DrawerLayout>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43

可以看到我们的最外层是DrawerLayout,里面一个content,一个作为drawer。我们的drawer为NavigationView
注意这个view的两个属性app:headerLayout="@layout/header_just_username"app:menu="@menu/menu_drawer",分别代表drawer布局中的header和menuitem区域,当然你可以根据自己的情况使用。

接下来看看header的布局文件和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="192dp"                android:background="?attr/colorPrimaryDark"                android:orientation="vertical"                android:padding="16dp"                android:theme="@style/ThemeOverlay.AppCompat.Dark">    <TextView        android:id="@+id/id_link"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:layout_marginBottom="16dp"        android:text="http://blog.csdn.net/lmj623565791"/>    <TextView        android:id="@+id/id_username"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_above="@id/id_link"        android:text="Zhang Hongyang"/>    <ImageView        android:layout_width="72dp"        android:layout_height="72dp"        android:layout_above="@id/id_username"        android:layout_marginBottom="16dp"        android:src="@mipmap/icon"/></RelativeLayout>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
<?xml version="1.0" encoding="utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android">    <group android:checkableBehavior="single">        <item            android:id="@+id/nav_home"            android:icon="@drawable/ic_dashboard"            android:title="Home"/>        <item            android:id="@+id/nav_messages"            android:icon="@drawable/ic_event"            android:title="Messages"/>        <item            android:id="@+id/nav_friends"            android:icon="@drawable/ic_headset"            android:title="Friends"/>        <item            android:id="@+id/nav_discussion"            android:icon="@drawable/ic_forum"            android:title="Discussion"/>    </group>    <item android:title="Sub items">        <menu>            <item                android:icon="@drawable/ic_dashboard"                android:title="Sub item 1"/>            <item                android:icon="@drawable/ic_forum"                android:title="Sub item 2"/>        </menu>    </item></menu>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34

别放错文件夹哈~

布局文件写完了,基本就好了,是不是很爽~看似复杂的效果,写写布局文件就ok。

ps:默认的颜色很多是从当前的主题中提取的,比如icon的stateColor,当然你也可以通过以下属性修改部分样式:

app:itemIconTint=""app:itemBackground=""app:itemTextColor=""
  • 1
  • 2
  • 3
(二)Activity

最后是Activity:

package com.imooc.testandroid;import android.os.Bundle;import android.support.design.widget.NavigationView;import android.support.v4.widget.DrawerLayout;import android.support.v7.app.ActionBar;import android.support.v7.app.ActionBarActivity;import android.support.v7.widget.Toolbar;import android.view.MenuItem;public class NavigationViewActivity extends ActionBarActivity{    private DrawerLayout mDrawerLayout;    private NavigationView mNavigationView;    @Override    protected void onCreate(Bundle savedInstanceState)    {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_navigation_view);        mDrawerLayout = (DrawerLayout) findViewById(R.id.id_drawer_layout);        mNavigationView = (NavigationView) findViewById(R.id.id_nv_menu);        Toolbar toolbar = (Toolbar) findViewById(R.id.id_toolbar);        setSupportActionBar(toolbar);        final ActionBar ab = getSupportActionBar();        ab.setHomeAsUpIndicator(R.drawable.ic_menu);        ab.setDisplayHomeAsUpEnabled(true);        setupDrawerContent(mNavigationView);    }    private void setupDrawerContent(NavigationView navigationView)    {        navigationView.setNavigationItemSelectedListener(                new NavigationView.OnNavigationItemSelectedListener()                {                    @Override                    public boolean onNavigationItemSelected(MenuItem menuItem)                    {                        menuItem.setChecked(true);                        mDrawerLayout.closeDrawers();                        return true;                    }                });    }    @Override    public boolean onCreateOptionsMenu(Menu menu)    {        // Inflate the menu; this adds items to the action bar if it is present.        getMenuInflater().inflate(R.menu.menu_navigation_view, menu);        return true;    }    @Override    public boolean onOptionsItemSelected(MenuItem item)    {        if(item.getItemId() == android.R.id.home)        {            mDrawerLayout.openDrawer(GravityCompat.START);            return true ;        }        return super.onOptionsItemSelected(item);    }}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77

我们在Activity里面可以通过navigationView去navigationView.setNavigationItemSelectedListener,当selected的时候,menuItem去setChecked(true)。

别忘了设置theme~

<resources>    <!-- Base application theme. -->    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">        <!-- Customize your theme here. -->    </style>    <style name="Theme.DesignDemo" parent="Base.Theme.DesignDemo">    </style>    <style name="Base.Theme.DesignDemo" parent="Theme.AppCompat.Light.NoActionBar">        <item name="colorPrimary">#673AB7</item>        <item name="colorPrimaryDark">#512DA8</item>        <item name="colorAccent">#FF4081</item>        <item name="android:windowBackground">@color/window_background</item>    </style></resources><color name="window_background">#FFF5F5F5</color> <activity    android:name=".NavigationViewActivity"    android:label="@string/title_activity_navigation_view"    android:theme="@style/Theme.DesignDemo"></activity>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28

ok,到此就搞定了~~

不过存在一个问题,此时你如果点击Sub items里面的Sub item,如果你期望当前选中应该是Sub item,你会发现不起作用。那怎么办呢?

(三)Sub Item支持Cheable

这里可以修改menu的配置文件:

<?xml version="1.0" encoding="utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android">    <group>        <item            android:id="@+id/nav_home"            android:checkable="true"            android:icon="@drawable/ic_dashboard"            android:title="Home"/>        <item            android:id="@+id/nav_messages"            android:checkable="true"            android:icon="@drawable/ic_event"            android:title="Messages"/>        <item            android:id="@+id/nav_friends"            android:checkable="true"            android:icon="@drawable/ic_headset"            android:title="Friends"/>        <item            android:id="@+id/nav_discussion"            android:checkable="true"            android:icon="@drawable/ic_forum"            android:title="Discussion"/>    </group>    <item android:title="Sub items">        <menu>            <item                android:checkable="true"                android:icon="@drawable/ic_dashboard"                android:title="Sub item 1"/>            <item                android:checkable="true"                android:icon="@drawable/ic_forum"                android:title="Sub item 2"/>        </menu>    </item></menu>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40

android:checkableBehavior="single"去掉,然后给每个item项添加android:checkable="true"

然后在代码中:

navigationView.setNavigationItemSelectedListener(                new NavigationView.OnNavigationItemSelectedListener()                {                    private MenuItem mPreMenuItem;                    @Override                    public boolean onNavigationItemSelected(MenuItem menuItem)                    {                        if (mPreMenuItem != null) mPreMenuItem.setChecked(false);                        menuItem.setChecked(true);                        mDrawerLayout.closeDrawers();                        mPreMenuItem = menuItem;                        return true;                    }                });
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17

存一下preMenuItem,手动切换。

效果:

ok,哈~其实这个还是参考链接2里面的一个评论说的~~

到此用法就介绍完了有木有一点小激动~ 但是还有个问题,对于app,就像ActionBar最初的出现,一开始大家都欢欣鼓舞,后来发现app中多数情况下需要去定制,尼玛,是不是忽然觉得ActionBar太死板了,恶心死了(当然了现在有了ToolBar灵活度上好多了)对于上述NavigationView可能也会存在定制上的问题,比如我希望选中的Item左边有个高亮的竖线之类的效果。那么,针对于各种需求,想要能解决各种问题,最好的方式就是说对于NavigationView的效果自己可以实现。最好,我们就来看看NavigationView自己实现有多难?

三、自己实现NavigationView效果

其实NavigationView的实现非常简单,一个ListView就可以了,甚至都不需要去自定义,简单写一个Adapter就行了~~

首先观察该图,有没有发现神奇之处,恩,你肯定发现不了,因为我们做的太像了。

其实这个图就是我通过ListView写的一个~是不是和原版很像(~哈~参考了源码的实现,当然像。)

接下来分析,如果说是ListView,那么Item的type肯定不止一种,那我们数一数种类:

  • 带图标和文本的
  • 仅仅是文本的 Sub Items
  • 分割线

你会说还有顶部那个,顶部是headview呀~~

这么分析完成,是不是瞬间觉得没有难度了~

(一)首先布局文件
<?xml version="1.0" encoding="utf-8"?><android.support.v4.widget.DrawerLayout    android:id="@+id/id_drawer_layout"    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:fitsSystemWindows="true"    >    <RelativeLayout        android:layout_width="match_parent"        android:layout_height="match_parent">        <android.support.v7.widget.Toolbar            android:id="@+id/id_toolbar"            android:layout_width="match_parent"            android:layout_height="?attr/actionBarSize"            android:background="?attr/colorPrimary"            app:layout_scrollFlags="scroll|enterAlways"            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>        <TextView            android:id="@+id/id_tv_content"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_centerInParent="true"            android:text="HelloWorld"            android:textSize="30sp"/>    </RelativeLayout>    <ListView        android:id="@+id/id_lv_left_menu"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_gravity="start"        android:paddingTop="0dp"        android:background="#ffffffff"        android:clipToPadding="false"        android:divider="@null"        android:listSelector="?attr/selectableItemBackground"        /></android.support.v4.widget.DrawerLayout>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45

布局文件上:和上文对比,我们仅仅把NavigationView换成了ListView.

下面注意了,一大波代码来袭.

(二) Activity
package com.imooc.testandroid;public class NavListViewActivity extends ActionBarActivity{    private ListView mLvLeftMenu;    private DrawerLayout mDrawerLayout;    @Override    protected void onCreate(Bundle savedInstanceState)    {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_nav_list_view);        mDrawerLayout = (DrawerLayout) findViewById(R.id.id_drawer_layout);        mLvLeftMenu = (ListView) findViewById(R.id.id_lv_left_menu);        Toolbar toolbar = (Toolbar) findViewById(R.id.id_toolbar);        setSupportActionBar(toolbar);        final ActionBar ab = getSupportActionBar();        ab.setHomeAsUpIndicator(R.drawable.ic_menu);        ab.setDisplayHomeAsUpEnabled(true);        setUpDrawer();    }    private void setUpDrawer()    {        LayoutInflater inflater = LayoutInflater.from(this);        mLvLeftMenu.addHeaderView(inflater.inflate(R.layout.header_just_username, mLvLeftMenu, false));        mLvLeftMenu.setAdapter(new MenuItemAdapter(this));    }    @Override    public boolean onCreateOptionsMenu(Menu menu)    {        // Inflate the menu; this adds items to the action bar if it is present.        getMenuInflater().inflate(R.menu.menu_nav_list_view, menu);        return true;    }    @Override    public boolean onOptionsItemSelected(MenuItem item)    {        // Handle action bar item clicks here. The action bar will        // automatically handle clicks on the Home/Up button, so long        // as you specify a parent activity in AndroidManifest.xml.        int id = item.getItemId();        //noinspection SimplifiableIfStatement        if (id == android.R.id.home)        {            mDrawerLayout.openDrawer(GravityCompat.START);            return true;        }        return super.onOptionsItemSelected(item);    }}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64

直接看onCreate中的setUpDrawer(),可以看到我们首先去addHeadView,然后去setAdapter。

那么核心代码就是我们的Adapter了~~

(三)MenuItemAdapter
    public class LvMenuItem    {        public LvMenuItem(int icon, String name)        {            this.icon = icon;            this.name = name;            if (icon == NO_ICON && TextUtils.isEmpty(name))            {                type = TYPE_SEPARATOR;            } else if (icon == NO_ICON)            {                type = TYPE_NO_ICON;            } else            {                type = TYPE_NORMAL;            }            if (type != TYPE_SEPARATOR && TextUtils.isEmpty(name))            {                throw new IllegalArgumentException("you need set a name for a non-SEPARATOR item");            }            L.e(type + "");        }        public LvMenuItem(String name)        {            this(NO_ICON, name);        }        public LvMenuItem()        {            this(null);        }        private static final int NO_ICON = 0;        public static final int TYPE_NORMAL = 0;        public static final int TYPE_NO_ICON = 1;        public static final int TYPE_SEPARATOR = 2;        int type;        String name;        int icon;    }    public class MenuItemAdapter extends BaseAdapter    {        private final int mIconSize;        private LayoutInflater mInflater;        private Context mContext;        public MenuItemAdapter(Context context)        {            mInflater = LayoutInflater.from(context);            mContext = context;            mIconSize = context.getResources().getDimensionPixelSize(R.dimen.drawer_icon_size);//24dp        }        private List<LvMenuItem> mItems = new ArrayList<LvMenuItem>(                Arrays.asList(                        new LvMenuItem(R.drawable.ic_dashboard, "Home"),                        new LvMenuItem(R.drawable.ic_event, "Messages"),                        new LvMenuItem(R.drawable.ic_headset, "Friends"),                        new LvMenuItem(R.drawable.ic_forum, "Discussion"),                        new LvMenuItem(),                        new LvMenuItem("Sub Items"),                        new LvMenuItem(R.drawable.ic_dashboard, "Sub Item 1"),                        new LvMenuItem(R.drawable.ic_forum, "Sub Item 2")                ));        @Override        public int getCount()        {            return mItems.size();        }        @Override        public Object getItem(int position)        {            return mItems.get(position);        }        @Override        public long getItemId(int position)        {            return position;        }        @Override        public int getViewTypeCount()        {            return 3;        }        @Override        public int getItemViewType(int position)        {            return mItems.get(position).type;        }        @Override        public View getView(int position, View convertView, ViewGroup parent)        {            LvMenuItem item = mItems.get(position);            switch (item.type)            {                case LvMenuItem.TYPE_NORMAL:                    if (convertView == null)                    {                        convertView = mInflater.inflate(R.layout.design_drawer_item, parent,                                false);                    }                    TextView itemView = (TextView) convertView;                    itemView.setText(item.name);                    Drawable icon = mContext.getResources().getDrawable(item.icon);                    setIconColor(icon);                    if (icon != null)                    {                        icon.setBounds(0, 0, mIconSize, mIconSize);                        TextViewCompat.setCompoundDrawablesRelative(itemView, icon, null, null, null);                    }                    break;                case LvMenuItem.TYPE_NO_ICON:                    if (convertView == null)                    {                        convertView = mInflater.inflate(R.layout.design_drawer_item_subheader,                                parent, false);                    }                    TextView subHeader = (TextView) convertView;                    subHeader.setText(item.name);                    break;                case LvMenuItem.TYPE_SEPARATOR:                    if (convertView == null)                    {                        convertView = mInflater.inflate(R.layout.design_drawer_item_separator,                                parent, false);                    }                    break;            }            return convertView;        }        public void setIconColor(Drawable icon)        {            int textColorSecondary = android.R.attr.textColorSecondary;            TypedValue value = new TypedValue();            if (!mContext.getTheme().resolveAttribute(textColorSecondary, value, true))            {                return;            }            int baseColor = mContext.getResources().getColor(value.resourceId);            icon.setColorFilter(baseColor, PorterDuff.Mode.MULTIPLY);        }    }
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100
  • 101
  • 102
  • 103
  • 104
  • 105
  • 106
  • 107
  • 108
  • 109
  • 110
  • 111
  • 112
  • 113
  • 114
  • 115
  • 116
  • 117
  • 118
  • 119
  • 120
  • 121
  • 122
  • 123
  • 124
  • 125
  • 126
  • 127
  • 128
  • 129
  • 130
  • 131
  • 132
  • 133
  • 134
  • 135
  • 136
  • 137
  • 138
  • 139
  • 140
  • 141
  • 142
  • 143
  • 144
  • 145
  • 146
  • 147
  • 148
  • 149
  • 150
  • 151
  • 152
  • 153
  • 154
  • 155
  • 156
  • 157
  • 158
  • 159
  • 160
  • 161
  • 162
  • 163
  • 164
  • 165
  • 166

首先我们的每个Item对应于一个LvMenuItem,包含icon、name、type,可以看到我们的type分为3类。

那么adapter中代码就很简单了,多Item布局的写法。

这样就完成了,我们自己去书写NavigationView,是不是很简单~~如果你的app需要类似效果,但是又与NavigationView的效果并非一模一样,可以考虑按照上面的思路自己写一个。

最后贴一下用到的Item的布局文件:

  • design_drawer_item_subheader.xml
<?xml version="1.0" encoding="utf-8"?><TextView xmlns:android="http://schemas.android.com/apk/res/android"          android:layout_width="match_parent"          android:layout_height="?attr/listPreferredItemHeightSmall"          android:gravity="center_vertical|start"          android:maxLines="1"          android:paddingLeft="?attr/listPreferredItemPaddingLeft"          android:paddingRight="?attr/listPreferredItemPaddingRight"          android:textAppearance="?attr/textAppearanceListItem"          android:textColor="?android:textColorSecondary"/>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • design_drawer_item_separator.xml
<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"             android:layout_width="match_parent"             android:layout_height="wrap_content">    <View android:layout_width="match_parent"          android:layout_height="1dp"          android:background="?android:attr/listDivider"/></FrameLayout>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • design_drawer_item,xml:
<?xml version="1.0" encoding="utf-8"?><TextView        xmlns:android="http://schemas.android.com/apk/res/android"        android:layout_width="match_parent"        android:layout_height="?attr/listPreferredItemHeightSmall"        android:paddingLeft="?attr/listPreferredItemPaddingLeft"        android:paddingRight="?attr/listPreferredItemPaddingRight"        android:drawablePadding="32dp"        android:gravity="center_vertical|start"        android:maxLines="1"        android:textAppearance="?attr/textAppearanceListItem"        android:textColor="?android:attr/textColorPrimary"/>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

ok,其实上述ListView的写法也正是NavigationView的源码实现~~item的布局文件直接从源码中拖出来的,还是爽爽哒~

源码点击下载
~~hava a nice day ~~

新浪微博

   

微信公众号:hongyangAndroid
  (欢迎关注,第一时间推送博文信息)
 

参考链接

  • https://guides.codepath.com/android/Fragment-Navigation-Drawer
  • http://antonioleiva.com/navigation-view/
  • http://android-developers.blogspot.com/2015/05/android-design-support-library.html
           

给我老师的人工智能教程打call!http://blog.csdn.net/jiangjunshow
这里写图片描述

这篇关于Android 自己实现 NavigationView Design Support Library 1的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/365582

相关文章

Redis实现分布式锁全过程

《Redis实现分布式锁全过程》文章介绍Redis实现分布式锁的方法,包括使用SETNX和EXPIRE命令确保互斥性与防死锁,Redisson客户端提供的便捷接口,以及Redlock算法通过多节点共识... 目录Redis实现分布式锁1. 分布式锁的基本原理2. 使用 Redis 实现分布式锁2.1 获取锁

Linux实现查看某一端口是否开放

《Linux实现查看某一端口是否开放》文章介绍了三种检查端口6379是否开放的方法:通过lsof查看进程占用,用netstat区分TCP/UDP监听状态,以及用telnet测试远程连接可达性... 目录1、使用lsof 命令来查看端口是否开放2、使用netstat 命令来查看端口是否开放3、使用telnet

使用SpringBoot+InfluxDB实现高效数据存储与查询

《使用SpringBoot+InfluxDB实现高效数据存储与查询》InfluxDB是一个开源的时间序列数据库,特别适合处理带有时间戳的监控数据、指标数据等,下面详细介绍如何在SpringBoot项目... 目录1、项目介绍2、 InfluxDB 介绍3、Spring Boot 配置 InfluxDB4、I

基于Java和FFmpeg实现视频压缩和剪辑功能

《基于Java和FFmpeg实现视频压缩和剪辑功能》在视频处理开发中,压缩和剪辑是常见的需求,本文将介绍如何使用Java结合FFmpeg实现视频压缩和剪辑功能,同时去除数据库操作,仅专注于视频处理,需... 目录引言1. 环境准备1.1 项目依赖1.2 安装 FFmpeg2. 视频压缩功能实现2.1 主要功

使用Python实现无损放大图片功能

《使用Python实现无损放大图片功能》本文介绍了如何使用Python的Pillow库进行无损图片放大,区分了JPEG和PNG格式在放大过程中的特点,并给出了示例代码,JPEG格式可能受压缩影响,需先... 目录一、什么是无损放大?二、实现方法步骤1:读取图片步骤2:无损放大图片步骤3:保存图片三、示php

使用Python实现一个简易计算器的新手指南

《使用Python实现一个简易计算器的新手指南》计算器是编程入门的经典项目,它涵盖了变量、输入输出、条件判断等核心编程概念,通过这个小项目,可以快速掌握Python的基础语法,并为后续更复杂的项目打下... 目录准备工作基础概念解析分步实现计算器第一步:获取用户输入第二步:实现基本运算第三步:显示计算结果进

Python多线程实现大文件快速下载的代码实现

《Python多线程实现大文件快速下载的代码实现》在互联网时代,文件下载是日常操作之一,尤其是大文件,然而,网络条件不稳定或带宽有限时,下载速度会变得很慢,本文将介绍如何使用Python实现多线程下载... 目录引言一、多线程下载原理二、python实现多线程下载代码说明:三、实战案例四、注意事项五、总结引

Python利用PySpark和Kafka实现流处理引擎构建指南

《Python利用PySpark和Kafka实现流处理引擎构建指南》本文将深入解剖基于Python的实时处理黄金组合:Kafka(分布式消息队列)与PySpark(分布式计算引擎)的化学反应,并构建一... 目录引言:数据洪流时代的生存法则第一章 Kafka:数据世界的中央神经系统消息引擎核心设计哲学高吞吐

C++ STL-string类底层实现过程

《C++STL-string类底层实现过程》本文实现了一个简易的string类,涵盖动态数组存储、深拷贝机制、迭代器支持、容量调整、字符串修改、运算符重载等功能,模拟标准string核心特性,重点强... 目录实现框架一、默认成员函数1.默认构造函数2.构造函数3.拷贝构造函数(重点)4.赋值运算符重载函数

Java调用Python脚本实现HelloWorld的示例详解

《Java调用Python脚本实现HelloWorld的示例详解》作为程序员,我们经常会遇到需要在Java项目中调用Python脚本的场景,下面我们来看看如何从基础到进阶,一步步实现Java与Pyth... 目录一、环境准备二、基础调用:使用 Runtime.exec()2.1 实现步骤2.2 代码解析三、