转载请注明出处: http://blog.csdn.net/forwardyzk/article/details/43021345
我们平时看到的菜单,都有侧滑菜单,有的只有右侧侧滑菜单,有的只有右侧侧滑菜单,有的左侧和右侧都有侧滑菜单。
下面介绍一个有三种模式的侧滑菜单,只有左侧,只有右侧,左侧和右侧都有。
首先要导入一个包,源码Demo中可以下载,然后引入项目中。
baseMenu = new SlidingMenu(this); baseMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN); baseMenu.setShadowWidthRes(R.dimen.slidingmenu_shadow_width); baseMenu.setShadowDrawable(R.drawable.slidingmenu_shadow); baseMenu.setBehindOffsetRes(R.dimen.slidingmenu_offset); DisplayMetrics dm = new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetrics(dm); baseMenu.setFadeDegree(0.35f); baseMenu.setBehindOffset(dm.widthPixels * 50 / 100); baseMenu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT); // 显示菜单模式 baseMenu.setMode(SlidingMenu.LEFT_RIGHT);// 这里模式设置为左右都有菜单,RIGHT显示右菜单,LEFT显示左菜单,LEFT_RIGH显示左右菜单 // 内容页 baseMenu.setContent(layoutResID); // 左侧菜单布局 baseMenu.setMenu(R.layout.slidingmenu_menu_left); // 右侧菜单布局 baseMenu.setSecondaryMenu(R.layout.slidingmenu_menu_right); // 设置右侧菜单的阴影效果 baseMenu.setSecondaryShadowDrawable(R.drawable.slidingmenu_shadow_2);
其中主要方法:
baseMenu.setMode(SlidingMenu.LEFT_RIGHT);设置侧滑模式,RIGHT、LEFT、LEFT_RIGH
baseMenu.setContent(layoutResID);主界面显示的布局文件
baseMenu.setMenu(R.layout.slidingmenu_menu_left);左侧菜单显示的布局
baseMenu.setSecondaryMenu(R.layout.slidingmenu_menu_right);右侧菜单显示布局
baseMenu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);将侧滑菜单添加到当前的Activity中
baseMenu.showMenu(true);展示左侧菜单
baseMenu.showSecondaryMenu(true);展示右侧菜单
baseMenu.toggle();菜单开关
下面介绍一个例子:
左侧菜单布局
slidingmenu_menu_left.xml
<span style="font-family:SimSun;font-size:18px;"><?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/ic_bg_for_dropdown" android:orientation="vertical" > <TextView android:id="@+id/menu_left_item1" android:layout_width="match_parent" android:layout_height="wrap_content" android:drawableRight="@drawable/ic_right_to" android:gravity="center" android:padding="10dp" android:text="栏目一" android:textSize="22sp" /> <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/ic_line" /> <TextView android:id="@+id/menu_left_item2" android:layout_width="match_parent" android:layout_height="wrap_content" android:drawableRight="@drawable/ic_right_to" android:gravity="center" android:padding="10dp" android:text="栏目二" android:textSize="22sp" /> <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/ic_line" /> <TextView android:id="@+id/menu_left_item3" android:layout_width="match_parent" android:layout_height="wrap_content" android:drawableRight="@drawable/ic_right_to" android:gravity="center" android:padding="10dp" android:text="栏目三" android:textSize="22sp" /> <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/ic_line" /> </LinearLayout></span>
<span style="font-family:SimSun;font-size:18px;"><?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:src="@drawable/head" /> <TextView android:id="@+id/menu_right_item1" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:padding="5dp" android:text="我的详细资料" android:textSize="20sp" /> <TextView android:id="@+id/menu_right_item2" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:padding="5dp" android:text="绑定电话号码" android:textSize="20sp" /> <TextView android:id="@+id/menu_right_item3" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:padding="5dp" android:text="我的财富" android:textSize="20sp" /> </LinearLayout></span>
将菜单的展示抽取到了BaseMenuActivity中,这样如果对于向有侧滑菜单的Activity,继承此Activity即可
<span style="font-family:SimSun;font-size:18px;">public class BaseMenuActivity extends Activity implements OnClickListener { public SlidingMenu baseMenu; private TextView menu_left_item1; private TextView menu_left_item2; private TextView menu_left_item3; private TextView menu_right_item1; private TextView menu_right_item2; private TextView menu_right_item3; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } public void setMentContent(int layoutResID) { initBaseMenu(layoutResID); } private void initBaseMenu(int layoutResID) { baseMenu = new SlidingMenu(this); baseMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN); baseMenu.setShadowWidthRes(R.dimen.slidingmenu_shadow_width); baseMenu.setShadowDrawable(R.drawable.slidingmenu_shadow); baseMenu.setBehindOffsetRes(R.dimen.slidingmenu_offset); DisplayMetrics dm = new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetrics(dm); baseMenu.setFadeDegree(0.35f); baseMenu.setBehindOffset(dm.widthPixels * 50 / 100); baseMenu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT); // 显示菜单模式 baseMenu.setMode(SlidingMenu.LEFT_RIGHT);// 这里模式设置为左右都有菜单,RIGHT显示右菜单,LEFT显示左菜单,LEFT_RIGH显示左右菜单 // 内容页 baseMenu.setContent(layoutResID); // 左侧菜单布局 baseMenu.setMenu(R.layout.slidingmenu_menu_left); // 右侧菜单布局 baseMenu.setSecondaryMenu(R.layout.slidingmenu_menu_right); // 设置右侧菜单的阴影效果 baseMenu.setSecondaryShadowDrawable(R.drawable.slidingmenu_shadow_2); initBaseMenuLeft(); initBaseMenuContent(); initBaseMenuRight(); } private void initBaseMenuRight() { menu_right_item1 = (TextView) findViewById(R.id.menu_right_item1); menu_right_item2 = (TextView) findViewById(R.id.menu_right_item2); menu_right_item3 = (TextView) findViewById(R.id.menu_right_item3); menu_right_item1.setOnClickListener(baseOnclickListener); menu_right_item2.setOnClickListener(baseOnclickListener); menu_right_item3.setOnClickListener(baseOnclickListener); } public void initBaseMenuContent() { } private void initBaseMenuLeft() { menu_left_item1 = (TextView) findViewById(R.id.menu_left_item1); menu_left_item2 = (TextView) findViewById(R.id.menu_left_item2); menu_left_item3 = (TextView) findViewById(R.id.menu_left_item3); menu_left_item1.setOnClickListener(baseOnclickListener); menu_left_item2.setOnClickListener(baseOnclickListener); menu_left_item3.setOnClickListener(baseOnclickListener); } private OnClickListener baseOnclickListener = new OnClickListener() { @Override public void onClick(View v) { switch (v.getId()) { case R.id.menu_left_item1: showShortToast("栏目一"); break; case R.id.menu_left_item2: showShortToast("栏目二"); break; case R.id.menu_left_item3: showShortToast("栏目三"); break; case R.id.menu_right_item1: showShortToast("我的资料"); baseMenu.toggle(); break; case R.id.menu_right_item2: showShortToast("修改资料"); baseMenu.toggle(); break; case R.id.menu_right_item3: showShortToast("我的财富"); baseMenu.toggle(); break; default: break; } } }; private void showShortToast(String message) { Toast.makeText(getApplicationContext(), message, 0).show(); } @Override public void onClick(View v) { // TODO Auto-generated method stub } } </span>
MainActivity.java
<span style="font-family:SimSun;font-size:18px;">public class MainActivity extends BaseMenuActivity { private ImageView menu_left; private ImageView menu_right; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setMentContent(R.layout.activity_main_slidingmenu_content); initMenuContent(); initView(); } private void initView() { findViewById(R.id.go_1).setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { startActivity(new Intent(MainActivity.this, Activity1.class)); } }); } private void initMenuContent() { menu_left = (ImageView) findViewById(R.id.menu_left); menu_right = (ImageView) findViewById(R.id.menu_right); menu_left.setOnClickListener(this); menu_right.setOnClickListener(this); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.menu_left: baseMenu.showMenu(true); break; case R.id.menu_right: baseMenu.showSecondaryMenu(true); break; default: break; } } private void showShortToast(String message) { Toast.makeText(getApplicationContext(), message, 0).show(); } } </span>在onCreate()中,调用setMentContent(显示布局文件的id)
然后对其布局文件中的控件进行操作即可,就是把我们开始使用的setContentView(layoutResID)换成setMentContent(layoutResID)即可。
源码下载: http://download.csdn.net/detail/forwardyzk/8386729
效果图: