相信很多朋友都见过可以侧滑的Android应用,比如QQ,知乎,谷歌音乐,CSDN等。这个现在几乎所有流行应用都在使用,今天看看这个是怎么实现的.
DrawerLayout
drawerLayout是Support Library包中实现了侧滑菜单效果的控件,可以说drawerLayout是因为第三方控件如MenuDrawer等的出现之后,google借鉴而出现的产物。drawerLayout分为侧边菜单和主内容区两部分,侧边菜单可以根据手势展开与隐藏(drawerLayout自身特性),主内容区的内容可以随着菜单的点击而变化(这需要使用者自己实现)。
DrawerLayout的使用:
- 直接将DrawerLayout作为根布局,然后其内部第一个View为内容区域,第二个View为左侧菜单,第三个View为右侧侧滑菜单,当前第三个是可选的。
- 第一个View的宽高应当设置为match_parent。
- 第二、三个View需要设置android:layout_gravity=”left”,和android:layout_gravity=”right”且一搬高度设置为match_parent,宽度为固定值,即侧滑菜单的宽度。
main.XML代码如下所示:
1 | <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" |
DrawerLayout常用的一些方法:
- 关闭抽屉: drawerlayout.closeDrawers();
- 打开抽屉:drawerlayout.openDrawer(抽屉view);
- 设置抽屉的阴影:setDrawerShadow(@DrawableRes int resId, @EdgeGravity int gravity) 如果你的抽屉在左边的话设置成 Gravity.LEFT显示.反之.
main.XML代码如下所示: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
50package com.example.drawerLayout;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.widget.DrawerLayout;
import android.view.Gravity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup.LayoutParams;
import android.widget.ImageView;
import android.widget.LinearLayout;
public class MainActivity extends Activity implements OnClickListener {
DrawerLayout drawerLayout;
ImageView iv_click;
LinearLayout ll;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
getActionBar().hide();
drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
iv_click = (ImageView) findViewById(R.id.iv_click);
ll = (LinearLayout) findViewById(R.id.ll);
iv_click.setOnClickListener(this);
//将侧滑菜单设置为屏幕的三分之二
LayoutParams layoutParams = ll.getLayoutParams();
layoutParams.width = getResources().getDisplayMetrics().widthPixels * 2 / 3;
ll.setLayoutParams(layoutParams);
}
public void onClick(View v) {
// TODO Auto-generated method stub
switch (v.getId()) {
case R.id.iv_click:
//监听 打开抽屉
drawerLayout.openDrawer(Gravity.LEFT);
break;
default:
break;
}
}
}
SlidingMenu
drawerLayout是Support Library包中实现了侧滑菜单效果的侧滑菜单栏,github上有个应用非常广泛的开源库SlidingMenu。很多著名的应用都用了这个开源库。
开源库地址: SlidingMenu
注:SlidingMenu是一个开源库,而不是一个完整的项目,要把它作为libary引入到你自己的工程里,简单配置一下就可以实现SlidingMenu的效果。
SlidingMenu的使用:
一、新建一个Android项目,将SlidingMenuLibrary导入新建的Android项目中,步骤如下:
1、 右键点击新建的Android项目,然后点击最下方的“Properties”选项;
2、 点击弹出对话框之后,在最左侧选择“Android”选项,然后再点击右下方的“Add”按钮;
3、 点击后弹出对话框,选中之前导入的SlidingMenuLibrary项目;
4、 导入成功之后会在Android的引用包中出现一个slidingmenulibrary.jar包;
注意:
有个地方需要特别注意:在新建完Android项目之后,较新的Eclipse版本都会在Android目录下 生成一个libs的文件夹,里面会有一个android-support-v4.jar的jar包,这个jar一定要删掉,否则运行程序的时候会出现异常,提示是找不到类的异常。最后发现出现异常的原因是因为在导入slidingmenulibrary类库的时候,这个类库里面本身就包含了android-support-v4.jar的jar包,所以运行的时候就会出现异常,系统不知道去调用哪个路径的下的包,所以程序崩溃,提示找不到类。
二、使用SlidingMenu开源库开发:1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24package com.example.sildingmenu;
import android.app.Activity;
import android.os.Bundle;
import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;
public class MainActivity extends Activity {
private SlidingMenu slidMenu;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
slidMenu = new SlidingMenu(this);
slidMenu.setMode(SlidingMenu.LEFT);
slidMenu.setMenu(R.layout.asdf);
slidMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN);
slidMenu.setTouchModeBehind(SlidingMenu.TOUCHMODE_MARGIN);
slidMenu.setBehindWidth(300);
slidMenu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);
}
}
SlidingMenu常用的一些方法:
方法名称 | 介绍 |
---|---|
slidMenu.setShadowWidth(10); | 设置阴影图片的宽度 |
slidMenu.setShadowWidth(10); | 设置阴影图片 |
menu.toggle(); | 动态判断自动关闭或开启SlidingMenu |
menu.showMenu(); | 显示SlidingMenu |
menu.showContent(); | 显示内容 |
menu.setOnOpenListener(onOpenListener); | 监听slidingmenu打开 |
menu.OnCloseListener(OnCloseListener); | 监听slidingmenu关闭时事件 |
menu.OnClosedListener(OnClosedListener); | 监听slidingmenu关闭后事件 |
NavigationView
Android Design Support Library 给开发者带来了一些重要的 Material Design 组件,并且向下兼容到 Android 2.1, NavigationView 就是其中之一,可用于方便地创建导航抽屉。
NavigationView 在很多App上都已经可以看到其效果图,国内的比如知乎(侧拉菜单滑出来的那一部分属于NavigationView),还有Google自己的那些app,也基本全都采用了NavigationView。
NavigationView的使用
- NavigationView 要放在一个 DrawerLayout 中,并且充当第二个子元素作为抽屉中的内容,即抽屉布局。android:layout_gravity=”start”是让NavigationView收进左侧。
- 在NavigationView中,必须规定app:headerLayout=”@layout/nav_header”、app:menu=”@menu/navigationdrawer_main”,其中的nav_header.xml和navigationdrawer_main.xml 指头部布局和菜单项,navigationdrawer_main.xml 中group与group之间会有横线。
- 在activity中初始化 DrawerLayout ,NavigationView ,然后实现点击头部事件,条目点击事件,在有toolbar的情况下,设置点击toolbar的navigationIcon打开NavigationView侧边栏。
activity_main.xml
1 | <?xml version="1.0" encoding="utf-8"?> |
nav_header.xml
1 | <?xml version="1.0" encoding="utf-8"?> |
navigationdrawer_main.xml
1 | <?xml version="1.0" encoding="utf-8"?> |
MainActivity.java
1 | public class MainActivity extends AppCompatActivity implements View.OnClickListener, NavigationView.OnNavigationItemSelectedListener { |
NavigationView扩展知识
- NavigationView放置在Toolbar下方
- ss
NavigationView在Toolbar下方
1 | <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" |