Android Design Support Library--navigation View

Frontier

Android has introduced material design elements from 5.0, a new design language that gives the entire Android user experience a fresh start, and Google has encapsulated some of the important material in the Android Design support library. Design control, there have been a lot of different material design controls on GitHub before, but now Google has standardized some controls, note that the Android design support The Library and Android support library are different, and the Android Help library only supports the encapsulation of some basic controls, while Android Design The library is primarily implemented with some material design effects, and the Android Design Support library includes the following eight types of controls:

Navigation view--Drawer Navigation

Textinputlayout--edittext Suspension Label

Floating Action button--hover action button

snackbar--tips (like toast)

tablayout--tab

coordinatorlayout--Scrolling Control

collapsingtoolbarlayout--Collapsible toolbar (effects in Google +, photos)

appbarlayout--Container AppBar

This article is divided into the above control mainly to do the use of the introduction, temporary analysis of the source code. First Look at Navigation view

　　Navigation view-- Drawer navigation

　　A very useful kind of drawer navigation effect, support directly through the menu resource file directly generated navigation tags, implementation is very simple, the effect as shown:

　　

Steps to use:

(1) Introduction of the design package in the app Build.gradle the design package version with 23.1.1 as an example

dependencies {    compile ' com.android.support:design:23.1.1 '}

(2) XML layout files (activity_main.xml) and slidemenu need to be used to drawerlayout.

<Android.support.v4.widget.DrawerLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"Xmlns:app= "Http://schemas.android.com/apk/res-auto"Android:id= "@+id/drawer_layout"Android:layout_width= "Match_parent"Android:layout_height= "Match_parent"android:fitssystemwindows= "true">    <includeLayout= "@layout/include_list_viewpager" /><!--The layout of the display content area--    <Android.support.design.widget.NavigationViewAndroid:id= "@+id/nav_view"Android:layout_width= "Wrap_content"Android:layout_height= "Match_parent"android:layout_gravity= "Start"android:fitssystemwindows= "true"App:headerlayout= "@layout/nav_header"App:menu= "@menu/drawer_view" /></Android.support.v4.widget.DrawerLayout>

Two important attributes

app:headerlayout--Navigation Head Layout
app:menu--navigation Menu Layout

layout_gravity--used to control the left and right slide, start left slide, end right slide, in fact, this is related to drawerlayout, specific reference to the use of drawerlayout.

Nav_header.xml

<LinearLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"Android:layout_width= "Match_parent"Android:layout_height= "192DP"Android:background= "? Attr/colorprimarydark"android:gravity= "Bottom"android:orientation= "vertical"android:padding= "16DP"Android:theme= "@style/themeoverlay.appcompat.dark">    <TextViewAndroid:layout_width= "Match_parent"Android:layout_height= "Wrap_content"Android:text= "Username"android:textappearance= "@style/textappearance.appcompat.body1" /></LinearLayout>

Drawer_view.xml (focus on how to implement grouping)

<?XML version= "1.0" encoding= "Utf-8"?><Menuxmlns:android= "Http://schemas.android.com/apk/res/android">    <GroupAndroid:checkablebehavior= "single"><!--Implementation single  --        <ItemAndroid:id= "@+id/nav_home"Android:icon= "@drawable/ic_dashboard"Android:title= "Home" />        <ItemAndroid:id= "@+id/nav_messages"Android:icon= "@drawable/ic_event"Android:title= "Messages" />        <ItemAndroid:id= "@+id/nav_friends"Android:icon= "@drawable/ic_headset"Android:title= "Friends" />        <ItemAndroid:id= "@+id/nav_discussion"Android:icon= "@drawable/ic_forum"Android:title= "Discussion" />    </Group>    <ItemAndroid:title= "Sub items">        <Menu>            <ItemAndroid:icon= "@drawable/ic_dashboard"Android:title= "Sub Item 1" />            <ItemAndroid:icon= "@drawable/ic_forum"Android:title= "Sub Item 2" />        </Menu>    </Item></Menu>

(2) Declare the use in the code

Navigationview Navigationview =(Navigationview) Findviewbyid (R.id.nav_view); if(Navigationview! =NULL) {Navigationview.setnavigationitemselectedlistener (NewNavigationview.onnavigationitemselectedlistener () {@Override Public Booleanonnavigationitemselected (MenuItem MenuItem) {menuitem.setchecked (true);                        Mdrawerlayout.closedrawers (); return true;        }                }); }

In the onnavigationitemselected() method, you can get each item in the navigation menu to achieve the appropriate functionality.

Extensions: If you want your navigation menu to appear on the status bar, you need to set the following settings primarily for versions 5.0 and above

.. /valuse-v21/styles.xml

<Resources>    <stylename= "Theme.designdemo"Parent= "Base.Theme.DesignDemo">        <Itemname= "Android:windowdrawssystembarbackgrounds">True</Item>        <Itemname= "Android:statusbarcolor">@android: Color/transparent</Item>    </style></Resources>

Also add the following attributes to the Drawerlayout

Android:fitssystemwindows= "true"

If you feel navigation view is not strong enough, you can look at Materialdrawer and connect as follows: Https://github.com/mikepenz/MaterialDrawer

Android Design Support Library--navigation View