【框架】侧滑菜单按钮 之SlidingMenu-master框架

当我们需要一个QQ一样侧滑（左滑动，或者右滑动）显示菜单时，就涉及到了自定义View以及其他的知识，其功能如何实现就不说了，我们可以利用别人做好的框架在展示我们所需要的功能，这里简单介绍一种github上提供的一种SlidingMenu-master侧滑框架，以及自己实现的一个小例子，通过点击侧滑出来的按钮，主界面显示不同网页

实现效果图片,通过点击左边的标题，显示不同的网站

点击后的图片

具体实现

1.下载并导Module

可以到gibhub下载 地址：https://github.com/jfeinstein10/SlidingMenu

百度云下载地址：链接：http://pan.baidu.com/s/1bp9k34z 密码：ixtw

提示：这里提供的百度云中的AS里面的两个Module是已经被AndroidStudio编译过的，导入时只要简单修改对应的SDK版本就可，app为自己实现的一个例子，另外一个压缩包为bithub上的工程

，如果想要实现上面的例子，请点击链接：http://pan.baidu.com/s/1bp9k34z 密码：ixtw

下载后，我们只需要将library以Module的形式倒进到我们工程中

2.bbuild.gradle的相关设置

注意：因为github提供的是从eclipse中导出来的，需要修改很多内容，导入时需要直接把build.gradle中直接把这段删除掉（这里会直接去下载，我们不需要），再修改其他信息，建议直接把下面提供的内容将整个build文件内容全部替换调用，再简单修改一下sdk版本就可以了

buildscript {
repositories {
mavenCentral()
}
dependencies {
classpath 'com.android.tools.build:gradle:0.4.+'
}
}

android studio 下的build.gradle文件

apply plugin: 'com.android.library'

dependencies {
compile 'com.android.support:support-v4:13.0.0'
}
android {
//需要修改成你有的sdk版本
compileSdkVersion 23
buildToolsVersion "23.0.1"

defaultConfig {
minSdkVersion 11
targetSdkVersion 23
}
sourceSets {
main {
java.srcDirs = ['src']
resources.srcDirs = ['src']
aidl.srcDirs = ['src']
renderscript.srcDirs = ['src']
res.srcDirs = ['res']
assets.srcDirs = ['assets']

manifest.srcFile 'AndroidManifest.xml'
}
}
}

在自己的Module中的build文件添加关联一下就可以直接使用了

dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:23.4.0'
//添加关联
compile project(':library')
}

3.Activity中实现的核心代码

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//把ContentFragment加载进来
cf = new ContentFragment();
getSupportFragmentManager().beginTransaction().replace(R.id.content_layout, cf).commit();
/*//默认加载百度
cf.loadUrl("http://www.baidu.com");*/
//设置侧滑布局
setBehindContentView(R.layout.leftlayout);
//初始化左菜单的Fragment
LeftMenuFragment lmf = new LeftMenuFragment();
//把这个Fragment加载到侧滑布局
getSupportFragmentManager().beginTransaction().replace(R.id.left_menu, lmf).commit();
//给LeftMenuFrgament设置ItemClick监听
lmf.setItemClick(new LeftMenuFragment.ItemClickCallBack() {
@Override
public void itemClick(String http) {
//LeftMenu点击时回调
//切换页面内容
cf.loadUrl(http);
//左侧菜单消失
getSlidingMenu().showContent();
}
});

SlidingMenu menu = getSlidingMenu();
//设置只有左侧滑出
menu.setMode(SlidingMenu.LEFT);
// 设置触摸屏幕的模式
menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
//设置侧滑阴影宽度
menu.setShadowWidthRes(R.dimen.shadow_width);
//设置侧滑阴影
menu.setShadowDrawable(R.drawable.shadow);
// 设置滑动菜单视图的宽度
menu.setBehindOffsetRes(R.dimen.slidingmenu_offset);
// menu.setBehindWidth()
// 设置渐入渐出效果的值
menu.setFadeDegree(0.35f);
// // menu.setBehindScrollScale(1.0f);

//进入时显示左侧菜单
menu.showMenu();
}

4.左滑的布局

左侧的布局中是一个继承ListFragment的LertMenuFragment,主要实现左侧滑出来时，显示ListVIew的数据以及相应的点击事件

public class LeftMenuFragment extends ListFragment {
public interface ItemClickCallBack {
//回调方法，MainActivity实现，调用ContentFragment中的loadUrl方法
//需要网址作为参数
public void itemClick(String http);
}
//定义一个接口实例
ItemClickCallBack iccb;

/**
* 向外提供一个方法，设置点击监听事件
*/
public void setItemClick(ItemClickCallBack cb) {
iccb = cb;
}
String[] titles = {
"百度", "网易", "新浪"
};
String[] urls = {
"http://www.baidu.com",
"http://www.163.com",
"http://www.sina.com.cn"
};
ArrayAdapter<String> adapter;
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
adapter = new ArrayAdapter<String>(getContext(), android.R.layout.simple_list_item_1, titles);
setListAdapter(adapter);
}
/**
* ListView的Item点击事件
* <p/>
* 点击时，切换MainActivity的ContentFragment中的内容
* <p/>
* 采用接口回调
* 接口定义在LeftMenuFragment中
* 接口方法调用也是在LeftMenuFrgament中
* 接口方法实现是在MainActivity中，
*/
@Override
public void onListItemClick(ListView l, View v, int position, long id) {
super.onListItemClick(l, v, position, id);
//调用ContentFragment中的loadUrl方法
//判断iccb是否为null
if (iccb != null) {
iccb.itemClick(urls[position]);
}

}
}

这个Fragment用于显示中间网页的数据，只要将这个Fragment放到Activity对应的布局就可了，这里基本都是Fragment的相关知识，具体请关注注释

public class ContentFragment extends Fragment {
WebView webView;
//创建布局
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
//找到这个Fragment使用的布局文件
View view = inflater.inflate(R.layout.contentlayout, container, false);
//找到布局里面的webView
webView = (WebView) view.findViewById(R.id.webview);
//设置webView，设置为可以使用脚本
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebViewClient(new WebViewClient());
return view;
}

@Override
//布局加载完后，系统自动加载此方法
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
//加载完布局后，初始化界面
loadUrl("http://www.baidu.com");
}

//向外提供一个接口，用来加载网页
public void loadUrl(String http) {
webView.loadUrl(http);
}
}

这里只说明如何使用第三方框架SlidingMenu-master，更多实现以及布局请下载源码自行实现