Android快速开发_建立MaterialDesign风格框架

建立左侧滑动Drawer

步骤1：

依赖库：
compile 'com.android.support:appcompat-v7:23.1.1'
compile 'com.android.support:design:23.1.1'

 

步骤2： 

主界面布局使用 

android.support.v4.widget.DrawerLayout

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     xmlns:app="http://schemas.android.com/apk/res-auto"
 4     android:id="@+id/drawer"
 5     android:layout_width="match_parent"
 6     android:layout_height="match_parent"
 7     android:fitsSystemWindows="true">
 8 
 9     <include layout="@layout/content_main"></include>
10 
11 
12     <android.support.design.widget.NavigationView
13         android:layout_width="match_parent"
14         android:layout_height="match_parent"
15         android:layout_gravity="start"
16         android:fitsSystemWindows="true"
17         app:headerLayout="@layout/nav_header"
18         app:menu="@menu/drawer_view">
19 
20     </android.support.design.widget.NavigationView>
21 </android.support.v4.widget.DrawerLayout>
View Code
步骤3：
1.建立左滑Drawer中的head部分布局,仅仅是一个linearlayout加上一个TextView
 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     android:layout_width="match_parent"
 3     android:layout_height="192dp"
 4     android:background="?attr/colorPrimaryDark"
 5     android:padding="16dp"
 6     android:theme="@style/ThemeOverlay.AppCompat.Dark"
 7     android:orientation="vertical"
 8     android:gravity="bottom">
 9 
10     <TextView
11         android:layout_width="match_parent"
12         android:layout_height="wrap_content"
13         android:text="Username"
14         android:textAppearance="@style/TextAppearance.AppCompat.Body1"/>
15 
16 </LinearLayout>
View Code

 

2.建立左滑Drawer中的menu布局(注意这个布局是在menu菜单中写的)
 1 <menu xmlns:android="http://schemas.android.com/apk/res/android">
 2 
 3     <group android:checkableBehavior="single">
 4         <item
 5             android:id="@+id/nav_home"
 6             android:icon="@drawable/ic_dashboard"
 7             android:title="Home" />
 8         <item
 9             android:id="@+id/nav_messages"
10             android:icon="@drawable/ic_event"
11             android:title="Messages" />
12         <item
13             android:id="@+id/nav_friends"
14             android:icon="@drawable/ic_headset"
15             android:title="Friends" />
16         <item
17             android:id="@+id/nav_discussion"
18             android:icon="@drawable/ic_forum"
19             android:title="Discussion" />
20     </group>
21 
22     <item android:title="Sub items">
23         <menu>
24             <item
25                 android:icon="@drawable/ic_dashboard"
26                 android:title="Sub item 1" />
27             <item
28                 android:icon="@drawable/ic_forum"
29                 android:title="Sub item 2" />
30         </menu>
31     </item>
32 
33 </menu>
View Code

 

左滑Drawer Down！




posted @ 2015-12-16 22:33  RainFool  阅读(681)  评论(0)  编辑  收藏  举报