AndroidSlidingMenu使用详解

转载请标明出处：http://blog.csdn.net/lmj623565791/article/details/36677279

很多APP都有侧滑菜单的功能，部分APP左右都是侧滑菜单~SlidingMenu 这个开源项目可以很好帮助我们实现侧滑功能，如果对SlidingMenu 还不是很了解的童鞋，可以参考下本篇博客。将侧滑菜单引入项目的方式很多中，本博客先通过例子介绍各种引入方式，然后给大家展示个实例：主布局ViewPager，左右各一个侧滑菜单的用法，差不多已经能满足大部分应用的需求了。关于常用属性，在文章末尾介绍。
1、在Activity中通过SlidingMenu构造方法，直接设置侧滑菜单

view
sourceprint?

01.

package

com.zhy.zhy_slidemenu_demo;

02.

03.

import

android.app.Activity;

04.

import

android.os.Bundle;

05.

06.

import

com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;

07.

08.

public

class

MainActivity

extends

Activity

09.

{

10.

11.

@Override

12.

protected

void

onCreate(Bundle
savedInstanceState)

13.

{

14.

super

.onCreate(savedInstanceState);

15.

setContentView(R.layout.activity_main);

16.

17.

//
configure the SlidingMenu

18.

SlidingMenu
menu =

new

SlidingMenu(

this

);

19.

menu.setMode(SlidingMenu.LEFT);

20.

//
设置触摸屏幕的模式

21.

menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);

22.

menu.setShadowWidthRes(R.dimen.shadow_width);

23.

menu.setShadowDrawable(R.drawable.shadow);

24.

25.

//
设置滑动菜单视图的宽度

26.

menu.setBehindOffsetRes(R.dimen.slidingmenu_offset);

27.

//
设置渐入渐出效果的值

28.

menu.setFadeDegree(

0

.35f);

29.

/**

30.

*
SLIDING_WINDOW will include the Title/ActionBar in the content

31.

*
section of the SlidingMenu,while SLIDING_CONTENT does not.

32.

*/

33.

menu.attachToActivity(

this

,
SlidingMenu.SLIDING_CONTENT);

34.

//为侧滑菜单设置布局

35.

menu.setMenu(R.layout.leftmenu);

36.

37.

}

38.

39.

}

效果图：



是不是特别简单~几行代码搞定~哈~
2、通过把Activity继承SlidingActivity

a、继承SlidingActivity

b、然后在onCreate中setBehindContentView(R.layout.leftmenu); 设置侧滑菜单的布局

c、通过getSlidingMenu()得到SlidingMenu对象，然后设置样式

view
sourceprint?

01.

package

com.zhy.zhy_slidemenu_demo02;

02.

03.

import

android.os.Bundle;

04.

05.

import

com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;

06.

import

com.jeremyfeinstein.slidingmenu.lib.app.SlidingActivity;

07.

08.

public

class

MainActivity

extends

SlidingActivity

09.

{

10.

@Override

11.

public

void

onCreate(Bundle
savedInstanceState)

12.

{

13.

super

.onCreate(savedInstanceState);

14.

setContentView(R.layout.activity_main);

15.

16.

setBehindContentView(R.layout.leftmenu);

17.

//
configure the SlidingMenu

18.

SlidingMenu
menu =getSlidingMenu();

19.

menu.setMode(SlidingMenu.LEFT);

20.

//
设置触摸屏幕的模式

21.

menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);

22.

menu.setShadowWidthRes(R.dimen.shadow_width);

23.

menu.setShadowDrawable(R.drawable.shadow);

24.

25.

//
设置滑动菜单视图的宽度

26.

menu.setBehindOffsetRes(R.dimen.slidingmenu_offset);

27.

//
设置渐入渐出效果的值

28.

menu.setFadeDegree(

0

.35f);

29.

/**

30.

*
SLIDING_WINDOW will include the Title/ActionBar in the content

31.

*
section of the SlidingMenu,while SLIDING_CONTENT does not.

32.

*/

33.

//
menu.attachToActivity(this,SlidingMenu.SLIDING_CONTENT);

34.

//
menu.setMenu(R.layout.leftmenu);

35.

36.

}

37.

38.

}

效果图和第一种方式一样~是不是也很简单~~

3、将SlidingMenu当作普通控件

可以把SlidingMenu作为普通的view，然后在布局中声明，丧心病狂的玩~下面看个例子：

view
sourceprint?

01.

<RelativeLayout
xmlns:android=

"http://schemas.android.com/apk/res/android"

02.

xmlns:tools=

"http://schemas.android.com/tools"

03.

android:id=

"@+id/id_main_ly"

04.

android:layout_width=

"match_parent"

05.

android:layout_height=

"match_parent"

>

06.

07.

<LinearLayout

08.

android:layout_width=

"wrap_content"

09.

android:layout_height=

"wrap_content"

10.

android:layout_marginLeft=

"30dp"

11.

android:layout_marginTop=

"30dp"

>

12.

13.

14.

<com.jeremyfeinstein.slidingmenu.lib.SlidingMenu

15.

xmlns:sliding=

"http://schemas.android.com/apk/res-auto"

16.

android:id=

"@+id/slidingmenulayout"

17.

android:layout_width=

"120dp"

18.

android:layout_height=

"170dp"

19.

android:background=

"#ffffffff"

20.

sliding:behindOffset=

"0dp"

21.

sliding:behindScrollScale=

"1"

22.

sliding:fadeDegree=

"0.3"

23.

sliding:fadeEnabled=

"true"

24.

sliding:touchModeAbove=

"fullscreen"

25.

sliding:viewAbove=

"@layout/pic"

/>

26.

</LinearLayout>

27.

28.

</RelativeLayout>

我们SlidingMenu作为普通View在布局文件中设置了布局，并且设置了viewAbove的值为另一个布局。

下面看pic布局：

view
sourceprint?

1.

<?xml
version=

"1.0"

encoding=

"utf-8"

?>

2.

<ImageView
xmlns:android=

"http://schemas.android.com/apk/res/android"

3.

android:layout_width=

"120dp"

4.

android:layout_height=

"170dp"

5.

android:src=

"@drawable/zhy"

/>

就是一张妹子图片。

最后看主Activity:

view
sourceprint?

01.

package

com.zhy.zhy_slidemenu_demo03;

02.

03.

import

android.app.Activity;

04.

import

android.os.Bundle;

05.

import

android.view.View;

06.

import

android.view.View.OnClickListener;

07.

08.

import

com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;

09.

10.

public

class

MainActivity

extends

Activity

11.

{

12.

private

SlidingMenu
mLeftMenu;

13.

14.

@Override

15.

protected

void

onCreate(Bundle
savedInstanceState)

16.

{

17.

super

.onCreate(savedInstanceState);

18.

setContentView(R.layout.activity_main);

19.

20.

mLeftMenu
= (SlidingMenu) findViewById(R.id.slidingmenulayout);

21.

//
configure the SlidingMenu

22.

//
SlidingMenu menu = new SlidingMenu(this);

23.

mLeftMenu.setMode(SlidingMenu.LEFT);

24.

//
设置触摸屏幕的模式

25.

mLeftMenu.setShadowWidthRes(R.dimen.shadow_width);

26.

mLeftMenu.setShadowDrawable(R.drawable.shadow);

27.

28.

mLeftMenu.setMenu(R.layout.leftmenu);

29.

30.

mLeftMenu.setOnClickListener(

new

OnClickListener()

31.

{

32.

@Override

33.

public

void

onClick(View
v)

34.

{

35.

if

(mLeftMenu.isMenuShowing())

36.

mLeftMenu.toggle();

37.

}

38.

});

39.

//
设置滑动菜单视图的宽度

40.

//
设置渐入渐出效果的值

41.

/**

42.

*
SLIDING_WINDOW will include the Title/ActionBar in the content

43.

*
section of the SlidingMenu,while SLIDING_CONTENT does not.

44.

*/

45.

46.

}

47.

48.

}

效果图：



通过SlidingMenu给图片设置一个滑动展示介绍，你也可以滑动显示任何东西，下载、分享按钮什么的。图片很多的时候不知道效率咋样，可以这么玩，但是不建议哈~
4、SlidingMenu设置左右侧滑菜单例子

上面介绍的3个方法，SlidingMenu的布局中控件的事件都需要写在Activity中，这样代码比较臃肿，一般会使用Fragment作为侧滑菜单的布局容器。

核心代码：

view
sourceprint?

1.

Fragment
leftMenuFragment =

new

MenuLeftFragment();

2.

setBehindContentView(R.layout.left_menu_frame);

3.

getSupportFragmentManager().beginTransaction()

4.

.replace(R.id.id_left_menu_frame,
leftMenuFragment).commit();

5.

SlidingMenu
menu =getSlidingMenu();

6.

menu.setMode(SlidingMenu.LEFT_RIGHT);

7.

//
设置触摸屏幕的模式

8.

menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN);

先给侧滑菜单通过 setBehindContentView(R.layout.left_menu_frame);设置一个布局，此布局中只有一个FrameLayout，然后使用FragmentManager将Fragment替换掉此Fragment，这样这个Fragment就作为我们侧滑菜单的布局了，我们的事件处理代码也可以写在Fragement中，而不是Activity中。

下面看具体例子：

首先分别是左右两边的两个Fragment:

MenuLeftFragment

view
sourceprint?

01.

package

com.zhy.zhy_slidemenu_demo04;

02.

03.

import

java.util.Arrays;

04.

import

java.util.List;

05.

06.

import

android.os.Bundle;

07.

import

android.support.v4.app.Fragment;

08.

import

android.view.LayoutInflater;

09.

import

android.view.View;

10.

import

android.view.ViewGroup;

11.

import

android.widget.ArrayAdapter;

12.

import

android.widget.ListAdapter;

13.

import

android.widget.ListView;

14.

15.

public

class

MenuLeftFragment

extends

Fragment

16.

{

17.

private

View
mView;

18.

private

ListView
mCategories;

19.

private

List<String>
mDatas = Arrays

20.

.asList(

"聊天"

,

"发现"

,

"通讯录"

,

"朋友圈"

,

"订阅号"

);

21.

private

ListAdapter
mAdapter;

22.

23.

@Override

24.

public

View
onCreateView(LayoutInflater inflater,ViewGroup container,

25.

Bundle
savedInstanceState)

26.

{

27.

if

(mView
==

null

)

28.

{

29.

initView(inflater,
container);

30.

}

31.

return

mView;

32.

}

33.

34.

private

void

initView(LayoutInflater
inflater,ViewGroup container)

35.

{

36.

mView
= inflater.inflate(R.layout.left_menu,container,

false

);

37.

mCategories
= (ListView) mView

38.

.findViewById(R.id.id_listview_categories);

39.

mAdapter
=

new

ArrayAdapter<String>(getActivity(),

40.

android.R.layout.simple_list_item_1,
mDatas);

41.

mCategories.setAdapter(mAdapter);

42.

}

43.

}

左边的侧滑布局就是一个ListView，代码比较简单~

MenuRightFragment

view
sourceprint?

01.

package

com.zhy.zhy_slidemenu_demo04;

02.

03.

import

android.os.Bundle;

04.

import

android.support.v4.app.Fragment;

05.

import

android.view.LayoutInflater;

06.

import

android.view.View;

07.

import

android.view.ViewGroup;

08.

09.

public

class

MenuRightFragment

extends

Fragment

10.

{

11.

private

View
mView;

12.

13.

@Override

14.

public

View
onCreateView(LayoutInflater inflater,ViewGroup container,

15.

Bundle
savedInstanceState)

16.

{

17.

if

(mView
==

null

)

18.

{

19.

mView
= inflater.inflate(R.layout.right_menu,container,

false

);

20.

}

21.

return

mView
;

22.

}

23.

}

右边的侧滑菜单的Fragment，加载了一个布局，没有做任何事件处理~

最后是MainActivity

view
sourceprint?

001.

package

com.zhy.zhy_slidemenu_demo04;

002.

003.

import

java.util.ArrayList;

004.

import

java.util.List;

005.

006.

import

android.os.Bundle;

007.

import

android.support.v4.app.Fragment;

008.

import

android.support.v4.app.FragmentPagerAdapter;

009.

import

android.support.v4.view.ViewPager;

010.

import

android.view.View;

011.

import

android.view.Window;

012.

013.

import

com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;

014.

import

com.jeremyfeinstein.slidingmenu.lib.app.SlidingFragmentActivity;

015.

016.

public

class

MainActivity

extends

SlidingFragmentActivity

017.

{

018.

019.

private

ViewPager
mViewPager;

020.

private

FragmentPagerAdapter
mAdapter;

021.

private

List<Fragment>
mFragments =

new

ArrayList<Fragment>();

022.

023.

@Override

024.

public

void

onCreate(Bundle
savedInstanceState)

025.

{

026.

super

.onCreate(savedInstanceState);

027.

this

.requestWindowFeature(Window.FEATURE_NO_TITLE);

028.

setContentView(R.layout.activity_main);

029.

//
初始化SlideMenu

030.

initRightMenu();

031.

//
初始化ViewPager

032.

initViewPager();

033.

034.

}

035.

036.

private

void

initViewPager()

037.

{

038.

mViewPager
= (ViewPager) findViewById(R.id.id_viewpager);

039.

MainTab01
tab01 =

new

MainTab01();

040.

MainTab02
tab02 =

new

MainTab02();

041.

MainTab03
tab03 =

new

MainTab03();

042.

mFragments.add(tab01);

043.

mFragments.add(tab02);

044.

mFragments.add(tab03);

045.

/**

046.

*
初始化Adapter

047.

*/

048.

mAdapter
=

new

FragmentPagerAdapter(getSupportFragmentManager())

049.

{

050.

@Override

051.

public

int

getCount()

052.

{

053.

return

mFragments.size();

054.

}

055.

056.

@Override

057.

public

Fragment
getItem(

int

arg0)

058.

{

059.

return

mFragments.get(arg0);

060.

}

061.

};

062.

mViewPager.setAdapter(mAdapter);

063.

}

064.

065.

private

void

initRightMenu()

066.

{

067.

068.

Fragment
leftMenuFragment =

new

MenuLeftFragment();

069.

setBehindContentView(R.layout.left_menu_frame);

070.

getSupportFragmentManager().beginTransaction()

071.

.replace(R.id.id_left_menu_frame,
leftMenuFragment).commit();

072.

SlidingMenu
menu =getSlidingMenu();

073.

menu.setMode(SlidingMenu.LEFT_RIGHT);

074.

//
设置触摸屏幕的模式

075.

menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN);

076.

menu.setShadowWidthRes(R.dimen.shadow_width);

077.

menu.setShadowDrawable(R.drawable.shadow);

078.

//
设置滑动菜单视图的宽度

079.

menu.setBehindOffsetRes(R.dimen.slidingmenu_offset);

080.

//
设置渐入渐出效果的值

081.

menu.setFadeDegree(

0

.35f);

082.

//
menu.setBehindScrollScale(1.0f);

083.

menu.setSecondaryShadowDrawable(R.drawable.shadow);

084.

//设置右边（二级）侧滑菜单

085.

menu.setSecondaryMenu(R.layout.right_menu_frame);

086.

Fragment
rightMenuFragment =

new

MenuRightFragment();

087.

getSupportFragmentManager().beginTransaction()

088.

.replace(R.id.id_right_menu_frame,
rightMenuFragment).commit();

089.

}

090.

091.

public

void

showLeftMenu(View
view)

092.

{

093.

getSlidingMenu().showMenu();

094.

}

095.

096.

public

void

showRightMenu(View
view)

097.

{

098.

getSlidingMenu().showSecondaryMenu();

099.

}

100.

}

简单说明一下，MainActivity继承的是SlidingFragmentActivity ，在Activity中FragmentPagerAdapter和viewPager作为主布局，然后分别初始化SlidingMenu的两边的菜单。

效果图：



哈哈，微信又躺枪了~~这个例子应该可以满足一般APP的需求了。
5、SlidingMenu的一些常用属性

//设置侧滑菜单的位置，可选值LEFT ,RIGHT ,LEFT_RIGHT （两边都有菜单时设置）

menu.setMode(SlidingMenu.LEFT_RIGHT);

// 设置触摸屏幕的模式，可选只MARGIN ,CONTENT

menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN);

//根据dimension资源文件的ID来设置阴影的宽度

menu.setShadowWidthRes(R.dimen.shadow_width);

//根据资源文件ID来设置滑动菜单的阴影效果

menu.setShadowDrawable(R.drawable.shadow);

// 这两个都是设置滑动菜单视图的宽度，二选一

//设置SlidingMenu离屏幕的偏移量

menu.setBehindOffsetRes(R.dimen.slidingmenu_offset);

//设置宽度

menu.setBehindWidth()

// 设置渐入渐出效果的值

menu.setFadeDegree(0.35f);

//设置SlidingMenu与下方视图的移动的速度比，当为1时同时移动，取值0-1

menu.setBehindScrollScale(1.0f);

//设置二级菜单的阴影效果

menu.setSecondaryShadowDrawable(R.drawable.shadow);

//设置右边（二级）侧滑菜单

menu.setSecondaryMenu(R.layout.right_menu_frame);

//为侧滑菜单设置布局

menu.setMenu(R.layout.leftmenu);

//把滑动菜单添加进所有的Activity中，可选值SLIDING_CONTENT ， SLIDING_WINDOW

menu.attachToActivity(this,SlidingMenu.SLIDING_CONTENT);

还有几个监听事件：

view
sourceprint?

01.

/**

02.

*
设置打开监听事件，当滑动菜单被打开时调用

03.

*/

04.

public

void

setOnOpenListener(OnOpenListener
listener) {

05.

mOpenListener
= listener;

06.

}

07.

08.

/**

09.

*
设置关闭监听事件，当滑动菜单被关闭时调用

10.

*/

11.

public

void

setOnCloseListener(OnCloseListener
listener) {

12.

//mViewAbove.setOnCloseListener(listener);

13.

mCloseListener
= listener;

14.

}

15.

16.

/**

17.

*
设置打开监听事件，当滑动菜单被打开过之后调用

18.

*/

19.

public

void

setOnOpenedListener(OnOpenedListener
listener) {

20.

mViewAbove.setOnOpenedListener(listener);

21.

}

22.

23.

/**

24.

*
设置关闭监听事件，当滑动菜单被关闭过之后调用

25.

*/

26.

public

void

setOnClosedListener(OnClosedListener
listener) {

27.

mViewAbove.setOnClosedListener(listener);

28.

}

还有一些用到的时候查查把~

有任何问题~欢迎留言~

我把上面的所有例子包括slidingmenu的lib打了一个包~

源码点击下载 http://www.it165.net/uploadfile/files/2014/0703/zhy_slidingmenu_demo.rar
这个例子也不错： http://www.krislq.com/2013/03/android_case_slidingmenu_fragment/