android菜单插件Slidingmenu和Actionbarsherlock组合使用做侧滑菜单

 Slidingmenu和Actionbarsherlock这种开源的android插件出来之后极大的方便了我们做一些炫酷的效果，使得初学者很容易做出一些炫酷的菜单了，等动画效果，我也是一个android学习者，邪门我就把我学习这2个插件的心得用例子写出来。

  首先我们要了解Fragment，因为现在多个页面切换已经不使用acvitity进行转换了，都换成Fragment了，这样改动其目的是为了解决不同屏幕分辩率的动态和灵活UI设计。大屏幕如平板小屏幕如手机，平板电脑的设计使得其有更多的空间来放更多的UI组件，而多出来的空间存放UI使其会产生更多的交互，从而诞生了fragments 。

我们做代码前的准备，首先准备Slidingmenu和Actionbarsherlock，我们从github上面直接搜索就可以下载下来,我们已经下载好了，这里提供下载地址，http://pan.baidu.com/s/1eQrx1p4和http://pan.baidu.com/s/1mgERMMO，自行下载。

下载完毕之后，打开我们的ADT，选择导入项目把Slidingmenu和Actionbarsherlock导入以is_library的形式即可，导入之后我们再进一步整合它们2个，右键我们导入的Slidingmenu把Actionbarsherlock的library加入进来（这里注意我们的Slidingmenu导入的是下面的library文件夹所以名字是library，当然也可以自定义名字）。

添加完成之后，我们还需要修改一个地方才可以完美一起使用它们2个，找到library下面的src下面的com.jeremyfeinstein.slidingmenu.lib.app下面的SlidingFragmentActivity.java，修改extends为SherlockFragmentActivity。

工作已经完成了，我们创建一个android项目，加入library这个包。

下面创建我们的布局文件。

首先创建主布局activity_main.xml：

<?xml version="1.0" encoding="utf-8"?><FrameLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/main_menu_frame"    android:layout_width="match_parent"    android:layout_height="match_parent"    ></FrameLayout>

中间的Fragment，center_menu_frame.xml：

<?xml version="1.0" encoding="utf-8"?><FrameLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/center_menu_frame"    android:layout_width="match_parent"    android:layout_height="match_parent"    ></FrameLayout>

中间的内容文件center_menu.xml：

<?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"    android:background="#0099CC"     >    <TextView         android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:text="我是中间的内容"        /></LinearLayout>

左边的Fragment文件left_menu_frame.xml：

<?xml version="1.0" encoding="utf-8"?><FrameLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/left_menu_frame"    android:layout_width="match_parent"    android:layout_height="match_parent"    ></FrameLayout>

左边的内容文件left_item.xml：

<?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"    android:background="#ff999999"    >        <TextView                 android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="我是左边的菜单滑动出现的"        />            </LinearLayout>

右侧Fragment文件right_menu_frame.xml：

<?xml version="1.0" encoding="utf-8"?><FrameLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/right_menu_frame"    android:layout_width="match_parent"    android:layout_height="match_parent"    ></FrameLayout>

右侧的内容文件right_item.xml：

<?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"     android:background="#ff999999"    >    <TextView                 android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="Hello,右边的菜单滑动出现的"        /></LinearLayout>

头部actionbar文件actionbar_item.xml：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"     android:background="#0099FF"    >            <ImageView        android:id="@+id/iv_left_icon"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginLeft="15dp"        android:layout_centerVertical="true"        android:src="@drawable/ic_title_list" />    <TextView        android:id="@+id/iv_right_icon"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentRight="true"        android:layout_marginRight="15dp"        android:layout_centerVertical="true"        android:text="设置" />        </RelativeLayout>

尺寸文件dimens.xml：

<resources>        <dimen name="sliding_menu_offset">150dp</dimen>   <dimen name="shadow_width">5dp</dimen></resources>

主布局文件的activity,MainActivity.java。

package com.example.slidingmenu;import com.actionbarsherlock.app.ActionBar;import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;import com.jeremyfeinstein.slidingmenu.lib.app.SlidingFragmentActivity;import android.os.Bundle;import android.view.View;import android.widget.ImageView;import android.widget.TextView;public class MainActivity extends SlidingFragmentActivity {    @Overridepublic void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initMenu();        initActionBar();        //SlidingMenu menu = new SlidingMenu(this);         SlidingMenu sm = getSlidingMenu();sm.setMode(SlidingMenu.LEFT_RIGHT);setBehindContentView(R.layout.left_menu_frame);sm.setSlidingEnabled(true);sm.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);sm.setShadowWidthRes(R.dimen.shadow_width);//sm.setShadowDrawable(R.drawable.shadow);getSupportActionBar().setDisplayHomeAsUpEnabled(true);getSupportFragmentManager().beginTransaction().replace(R.id.left_menu_frame, new LeftFragment()).commit();sm.setBehindOffsetRes(R.dimen.sliding_menu_offset);sm.setBehindScrollScale(0);sm.setFadeDegree(0.25f);sm.setSecondaryMenu(R.layout.right_menu_frame);//sm.setSecondaryShadowDrawable(R.drawable.shadow);getSupportFragmentManager().beginTransaction().replace(R.id.right_menu_frame, new RightFragment()).commit();            }  //加载中间的fragment    public void initMenu(){    getSupportFragmentManager().beginTransaction().replace(R.id.main_menu_frame, new CenterFragment()).commit();    }    //初始化actionbarprivate void initActionBar(){ActionBar actionBar = getSupportActionBar();actionBar.setCustomView(R.layout.actionbar_item);actionBar.setDisplayShowCustomEnabled(true);//去掉默认的actionBar.setDisplayShowHomeEnabled(false);//左边点击事件ImageView imageView = (ImageView) findViewById(R.id.iv_left_icon);imageView.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View arg0) {// TODO Auto-generated method stubtoggle();}});//右边点击事件TextView textView = (TextView) findViewById(R.id.iv_right_icon);textView.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View arg0) {// TODO Auto-generated method stubshowSecondaryMenu();}});}}

中间的Fragment内容展示activity，CenterFragment.java。

package com.example.slidingmenu;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class CenterFragment extends Fragment {@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {// TODO Auto-generated method stubView view = inflater.inflate(R.layout.center_menu, null);return view;}}

左边的Fragment内容展示文件LeftFragment.java。

package com.example.slidingmenu;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class LeftFragment extends Fragment {@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {// TODO Auto-generated method stubView view = inflater.inflate(R.layout.left_item, null);return view;}}

右边的Fragment内容展示acvitity，RightFragment.java。

package com.example.slidingmenu;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class RightFragment extends Fragment {@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {// TODO Auto-generated method stubView view = inflater.inflate(R.layout.right_item, null);return view;}}

源码地址：http://download.csdn.net/detail/gaoxuaiguoyi/9294399

效果图：