Eoeclient源代码分析---SlidingMenu的使用

Eoeclient源代码分析及代码凝视

使用滑动菜单SlidingMenu，单击滑动菜单的不同选项，能够通过ViewPager和PagerIndicator显示相应的数据内容。

0 BaseSlidingFragmentActivity.java

主要函数：

(1)showMenu()

/** * Opens the menu and shows the menu view.*/

public void showMenu() {

showMenu(true);

}

(2)showContent()

/**Closes the menu and shows the above view. */

public void showContent() {

showContent(true);

}

(3)toggle()

/**Toggle the SlidingMenu. If it is open, it will be closed, and viceversa.*/

public void toggle() {

toggle(true);

}

/**

* Toggle the SlidingMenu. If it is open, itwill be closed, and vice versa.

*

* @param animate true to animate thetransition, false to ignore animation

*/

public void toggle(booleananimate) {

if (isMenuShowing()) {

showContent(animate);

} else {

showMenu(animate);

}

}

(4)

//设置SlidingMenu使用的布局

publicvoid setBehindContentView(int id)
{

setBehindContentView(getLayoutInflater().inflate(id,null));

}

public
void setBehindContentView(View v) {

setBehindContentView(v, new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT));

}

public
void setBehindContentView(View v, LayoutParams params) {

mHelper.setBehindContentView(v, params);

}

//获取与该Acitivity相关的SlidingMenu对象

public SlidingMenu getSlidingMenu() {

returnmHelper.getSlidingMenu();

}

1. behind_sldingmenu.xml 滑动菜单的部分页面布局文件

滑动菜单主要由一个标题布局(@layout/behinf_title)、菜单选项列表布局和两个自己定义图形button等控件元素组成

<FrameLayoutxmlns:android="http://schemas.android.com/apk/res/android"

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

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#dadada"

android:orientation="vertical">

<!--sliding menu layout -->

<includelayout="@layout/behind_title"/>

<ListView

android:id="@+id/behind_list_show"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:layout_gravity="top"

android:layout_marginBottom="@dimen/list_margin_height"

android:layout_marginTop="@dimen/title_height"

android:divider="@drawable/dis_behind_side"

android:listSelector="#0fff"

android:cacheColorHint="#0000">

</ListView>

</FrameLayout>

2. 初始化滑动菜单

private SlidingMenu sm;

// [start]初始化函数

private
void initSlidingMenu() {

//设置滑动菜单的布局文件

setBehindContentView(R.layout.behind_slidingmenu);

// 获取滑动菜单对象并设置外观属性customize the SlidingMenu

sm =
getSlidingMenu();

sm.setShadowWidthRes(R.dimen.shadow_width);

sm.setBehindOffsetRes(R.dimen.slidingmenu_offset);

// sm.setFadeDegree(0.35f);

sm.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);

sm.setShadowDrawable(R.drawable.slidingmenu_shadow);

//sm.setShadowWidth(20);

sm.setBehindScrollScale(0);

}

3. 显示菜单：

（1）单击主界面左上角的LinearLayout控件

// fromabove_title.xml -- > pop up slidingmenu (showMenu() )

llGoHome = (LinearLayout) findViewById(R.id.Linear_above_toHome);

@Override

public
void onClick(View v) {

// TODO Auto-generated method stub

switch (v.getId()) {

case R.id.Linear_above_toHome:

showMenu();

break;

}

}

（2）单击手机的菜单选项

@Override

public
boolean onKeyDown(int keyCode, KeyEventevent) {

else
if (keyCode == KeyEvent.KEYCODE_MENU) {

if (sm.isMenuShowing()) {

toggle();

} else {

showMenu();

}

}

}

4. 设置填充滑动菜单中列表项数据的适配器

4.1 behind_list_show.xml (每个列表项的布局)

每个列表项(子菜单选项)由一个ImageView(子菜单图标)和TextView(子菜单名称)组成

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="@dimen/behind_list_height"

android:orientation="horizontal"

android:background="@drawable/back_behind_listitem_style">

<ImageView

android:id="@+id/imageview_behind_icon"

android:layout_width="wrap_content"

android:layout_height="match_parent"

android:src="@drawable/dis_menu_blog"

android:scaleType="fitCenter"

android:layout_marginLeft="10dp"

android:layout_marginRight="10dp"/>

<TextView

android:id="@+id/textview_behind_title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center_vertical"

android:textColor="#666"

android:textSize="@dimen/behind_list_text_size"/>

</LinearLayout>

4.2定义getData函数获取填充列表项的数据List

private List<Map<String, Object>> getData() {

List<Map<String, Object>>list = new ArrayList<Map<String, Object>>();

//社区精选

Map<String, Object> map = new HashMap<String,Object>();

map.put(LIST_TEXT, getResources().getString(R.string.menuGood));

map.put(LIST_IMAGEVIEW, R.drawable.dis_menu_handpick);

list.add(map);

//新闻资讯

map = new HashMap<String, Object>();

map.put(LIST_TEXT, getResources().getString(R.string.menuNews));

map.put(LIST_IMAGEVIEW, R.drawable.dis_menu_news);

list.add(map);

//学习教程

map = new HashMap<String, Object>();

map.put(LIST_TEXT, getResources().getString(R.string.menuStudio));

map.put(LIST_IMAGEVIEW, R.drawable.dis_menu_studio);

list.add(map);

//社区博客

map = new HashMap<String, Object>();

map.put(LIST_TEXT, getResources().getString(R.string.menuBlog));

map.put(LIST_IMAGEVIEW, R.drawable.dis_menu_blog);

list.add(map);

return list;

}

4.3定义列表项数据填充适配器

SimpleAdapter lvAdapter =
new SimpleAdapter(this, getData(),

R.layout.behind_list_show,new String[]{LIST_TEXT,

LIST_IMAGEVIEW},

new
int[]{R.id.textview_behind_title,

R.id.imageview_behind_icon}) {

@Override

publicView getView(int position, View convertView, ViewGroupparent) {

View view = super.getView(position,convertView, parent);

//假设是当前选中的子菜单项

if (position ==mTag) {

//设置新的背景图片 标识该菜单选项被选中

view.setBackgroundResource(R.drawable.back_behind_list);

lvTitle.setTag(view);//绑定当前选中的子菜单选项到lvTitle上

} else {

view.setBackgroundColor(Color.TRANSPARENT);

}

return view;

}

};

5. 单击滑动菜单中的列表项 启动不同的ViewPager

（1）NavigationModel 类的定义

package cn.eoe.app.entity;

public
class NavigationModel {

private Stringname;

//作为唯一标识符 newsblog wiki
方便于每一个页面请求相相应的地址

private Stringtags;

public NavigationModel(String name1,String tags1){

this.name = name1;

this.tags = tags1;

}

}

（2）创建NavigationModel 对象，并加入四个子菜单相应的数据（name,tag）

private List<NavigationModel> navs;

private
void initNav() {

navs = new ArrayList<NavigationModel>();

NavigationModel nav1 =new
NavigationModel(getResources().getString(

R.string.menuGood),"");

NavigationModel nav2 =new
NavigationModel(getResources().getString(

R.string.menuNews), Constants.TAGS.NEWS_TAG);

NavigationModel nav3 =new
NavigationModel(getResources().getString(

R.string.menuStudio),Constants.TAGS.WIKI_TAG);

NavigationModel nav4 =new
NavigationModel(getResources().getString(

R.string.menuBlog),Constants.TAGS.BLOG_TAG);

Collections.addAll(navs, nav1, nav2, nav3, nav4);

}

（3）初始化列表项数据

MainActivity.java

initialListView(){}

lvAdapter = new SimpleAdapter(this, getData(),

R.layout.behind_list_show,new String[]{LIST_TEXT,

LIST_IMAGEVIEW},

new
int[]{R.id.textview_behind_title,

R.id.imageview_behind_icon})；

lvTitle.setAdapter(lvAdapter);

（4）列表项单击事件监听函数

lvTitle.setOnItemClickListener(new OnItemClickListener() {

@Override

public
void onItemClick(AdapterView<?> parent,View view,

int position,long id) {

NavigationModel navModel =
navs.get(position);

mAboveTitle.setText(navModel.getName());

current_page = navModel.getTags();

if (lvTitle.getTag() !=null) {

if (lvTitle.getTag() == view) {

//假设本次单击的子菜单选项(view)和上一次选择的子菜单选项（lvTitle.getTag()）同样，则直接显示当前子菜单项相应的内容

MainActivity.this.showContent();

return;

}

//若果不同样，又一次将原来菜单选项的背景色改为透明

((View) lvTitle.getTag())

.setBackgroundColor(Color.TRANSPARENT);

}

lvTitle.setTag(view);//又一次绑定新的子菜单选项到lvTitle上

//设置新的背景图片 标识该菜单选项被选中

view.setBackgroundResource(R.drawable.back_behind_list);

imgQuery.setVisibility(View.VISIBLE);

//依据选择的不同子菜单选项运行不同的异步任务，显示相应的数据内容

switch (position) {

case 0:

imgQuery.setVisibility(View.GONE);

newMyTask().execute(topDao);

break;

case 1:

newMyTask().execute(newsDao);

break;

case 2:

newMyTask().execute(wikiDao);

break;

case 3:

new MyTask().execute(blogsDao);

break;

}

}

});

6. 分离出来的模板样例

在MainActivity中显示选中的滑动菜单选项的名称

(1) main.xml (MainActivity)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/sso_topbar"
>
<ImageButton
android:layout_marginLeft="5dip"
android:layout_centerVertical="true"
android:id="@+id/imgbtn_top_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/v5_0_1_flipper_head_flip"/>
<TextView
android:layout_toRightOf="@id/imgbtn_top_left"
android:id="@+id/tv_top_center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/tv_top_center"
android:textColor="@color/whilte"
android:layout_centerVertical="true"
android:layout_marginLeft="25dip"

/>
<ImageButton
android:id="@+id/imgbtn_top_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/feed_refresh_arrow_pressed"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dip"/>
</RelativeLayout>

<TextView
android:id="@+id/show_submenu_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>

</LinearLayout>

(2)fragment_left_bottom.xml (滑动菜单的布局文件)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/renren_news_first_image_bg"
android:orientation="vertical" >
<!-- 顶部头像，姓名。标签 -->
<include layout="@layout/left_bottom_top" />
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- 经常使用 -->
<TextView
android:id="@+id/left_tv_commom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="3dip"
android:paddingLeft="20dip"
android:paddingTop="3dip"
android:text="@string/left_bottom_commom"
android:textColor="@color/whilte" />

<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/v5_0_1_divider_new"/>
<!-- 经常使用列表 --><!-- 经常使用列表与很多其它列表使用同一个item布局 自己定义适配器 -->
<com.pps.myrenren.custom.MyListView
android:id="@+id/listview_common"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000"
android:divider="@drawable/v5_0_1_divider_line_new"/>
<TextView
android:id="@+id/left_tv_more"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="3dip"
android:paddingLeft="20dip"
android:paddingTop="3dip"
android:text="@string/left_bottom_more"
android:textColor="@color/whilte" />
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/v5_0_1_divider_new"/>
<!-- 很多其它列表 -->
<com.pps.myrenren.custom.MyListView
android:id="@+id/listview_more"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000"
android:divider="@drawable/v5_0_1_divider_line_new"/>
<!--     <TextView
android:id="@+id/left_tv_recommend"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="3dip"
android:paddingLeft="20dip"
android:paddingTop="3dip"
android:text="@string/left_bottom_recommend"
android:textColor="@color/whilte" />
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/v5_0_1_divider_line_new"/>

<ListView
android:id="@+id/listview_recommend"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000"
android:divider="@drawable/v5_0_1_divider_new"/>
<TextView
android:id="@+id/left_tv_app"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="3dip"
android:paddingLeft="20dip"
android:paddingTop="3dip"
android:text="@string/left_bottom_app"
android:textColor="@color/whilte" />

<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/v5_0_1_divider_line_new"/>

<ListView
android:id="@+id/listview_app"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000"
android:divider="@drawable/v5_0_1_divider_new"/>  -->
<TextView
android:id="@+id/left_tv_setting"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="3dip"
android:paddingLeft="20dip"
android:paddingTop="3dip"
android:text="@string/left_bottom_setting"
android:textColor="@color/whilte" />
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/v5_0_1_divider_new"/>
<com.pps.myrenren.custom.MyListView
android:id="@+id/listview_setting"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000"
android:divider="@drawable/v5_0_1_divider_line_new"/>
</LinearLayout>
</ScrollView>

</LinearLayout>

(3) menu_frame.xml 滑动菜单布局文件（装载Fragment的FrameLayout容器）

<?

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

(4) MainActivity.java
Key:在Activtiy中实如今(5)中[LeftBottomFragment.java]定义的回调方法

package com.pps.myrenren.activity;

import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.ImageButton;
import android.widget.TextView;

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

public class MainActivity extends SlidingFragmentActivity implements LeftBottomFragment.SLMenuListOnItemClickListener{
private ImageButton imgbtn_top_left;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.main);

imgbtn_top_left=(ImageButton)this.findViewById(R.id.imgbtn_top_left);
imgbtn_top_left.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
/*Tip1:	Toggle the SlidingMenu. If it is open, it will be closed, and vice versa.*/
toggle();
}
});
//Initial Sliding Menu
initSlidingMenu(savedInstanceState);
}

//0628
@Override
public void selectItem(int position,String title){

//toggle();
showContent();//hide the menu
TextView tv = (TextView)findViewById(R.id.show_submenu_content);
tv.setText(title);
}
/**
* Initial Sliding Menu
*/
private void initSlidingMenu(Bundle savedInstanceState) {
// 设置滑动菜单的视图
setBehindContentView(R.layout.menu_frame);
getSupportFragmentManager().beginTransaction().replace(R.id.menu_frame, new LeftBottomFragment()).commit();
// 实例化滑动菜单对象
SlidingMenu sm = getSlidingMenu();
// 设置滑动阴影的宽度
sm.setShadowWidthRes(R.dimen.shadow_width);
// 设置滑动阴影的图像资源
sm.setShadowDrawable(R.drawable.shadow);
// 设置滑动菜单视图的宽度
sm.setBehindOffsetRes(R.dimen.slidingmenu_offset);
// 设置渐入渐出效果的值
sm.setFadeDegree(0.35f);
// 设置触摸屏幕的模式
sm.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
}
}

(5)LeftBottomFragment.java

Key:在菜单Fragment中定义回调函数 将Fragment的信息传递到Activity

package com.pps.myrenren.activity;

import java.util.ArrayList;
import java.util.List;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;

import com.pps.myrenren.adapter.CommonOrMoreAdapter;
import com.pps.myrenren.adapter.SettingAdapter;
import com.pps.myrenren.model.ItemComOrMoreModel;
import com.pps.myrenren.model.ItemSettingModel;

public class LeftBottomFragment extends Fragment{
private View mView;
private Context mContext;

private ListView listview_common;
private ListView listview_more;
private ListView listview_setting;

private List<ItemComOrMoreModel> commonModels;  //经常使用列表的Item集合
private List<ItemComOrMoreModel> moreModels;    //很多其它列表的item集合
private List<ItemSettingModel> settingModels;   //设置列表的item集合

private SLMenuListOnItemClickListener mCallbacks;//0628

//Key:
public void onAttach(Activity activity){
super.onAttach(activity);
//假设该Acitivity没有实现Callbacks接口
if(!(activity instanceof SLMenuListOnItemClickListener)){
try {
throw new Exception("LeftBottomFragment所在的Activity" +
"必须实现Callbacks接口");
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
//定义回调函数的接口对象的实例化---
//把该Activity当成Callbacks对象
mCallbacks = (SLMenuListOnItemClickListener) activity;
}

public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {

if (null == mView) {
mView = inflater.inflate(R.layout.fragment_left_bottom, container,
false);
initView();
initValidata();
bindData();
initialClickListener();
//
}
return mView;
}
/**
* 初始化界面元素
*/
private void initView() {
//---mView.findViewById()  not .findViewById()
listview_common = (ListView) mView.findViewById(R.id.listview_common);

listview_more = (ListView) mView.findViewById(R.id.listview_more);
listview_setting = (ListView) mView.findViewById(R.id.listview_setting);

}
/**
* 初始化变量
*/
private void initValidata() {
mContext = mView.getContext();
commonModels=new ArrayList<ItemComOrMoreModel>();
moreModels=new ArrayList<ItemComOrMoreModel>();
settingModels=new ArrayList<ItemSettingModel>();
//1:进行构造经常使用列表中的数据,图标,名称,数量
Integer[] common_icon_id = new Integer[] {
R.drawable.v5_2_1_desktop_list_newsfeed,
R.drawable.v5_2_1_desktop_list_message,
R.drawable.v5_2_1_desktop_list_chat,
R.drawable.v5_2_1_desktop_list_friends,
R.drawable.v5_2_1_desktop_list_search,
R.drawable.v5_9_3_desktop_list_barcode };
String[] arrays_commom=mContext.getResources().getStringArray(R.array.arrays_commom);
int[] common_number=new int[]{0,1,2,3,4,1};
for(int i=0;i<common_icon_id.length;i++)
{
ItemComOrMoreModel commcon=new ItemComOrMoreModel(common_icon_id[i], arrays_commom[i], common_number[i]);
commonModels.add(commcon);
}

//2：进行构造很多其它列表中的数据,图标,名称,数量
Integer[] more_icon_id=new Integer[]
{R.drawable.v5_2_1_desktop_list_location,R.drawable.v5_2_1_desktop_list_page,R.drawable.v5_2_0_desktop_list_hot,R.drawable.v5_2_1_desktop_list_apps_center};
String[] arrays_more=mContext.getResources().getStringArray(R.array.arrays_more);
int[] more_number=new int[]{0,0,0,0};
for(int i=0;i<more_icon_id.length;i++)
{
ItemComOrMoreModel more=new ItemComOrMoreModel(more_icon_id[i],arrays_more[i],more_number[i]);
moreModels.add(more);
}

//3:进行构造设置列表中的数据,图标,名称
Integer[] setting_icon_id=new Integer[]{R.drawable.v_5_8day_mode_unselected,R.drawable.v5_2_1_desktop_list_settings,R.drawable.v5_2_1_desktop_list_log_out};
String[] arrays_setting=mContext.getResources().getStringArray(R.array.arrays_setting);
for(int i=0;i<setting_icon_id.length;i++)
{
ItemSettingModel setting=new ItemSettingModel(setting_icon_id[i],arrays_setting[i]);
settingModels.add(setting);
}
}

/**
* 绑定数据
*/
private void bindData() {
//创建适配器而且进行绑定数据到listview中
listview_common.setAdapter(new CommonOrMoreAdapter(mContext, commonModels));
listview_more.setAdapter(new CommonOrMoreAdapter(mContext, moreModels));
listview_setting.setAdapter(new SettingAdapter(mContext, settingModels));
}

//0628：点击滑动菜单子选项的回调接口
public interface SLMenuListOnItemClickListener{

public void selectItem(int position,String title);
}

/*菜单选项单击响应事件的监听函数*/
public void initialClickListener(){

//
listview_common.setOnItemClickListener(new OnItemClickListener(){
@Override
public void onItemClick(AdapterView<?

> parent, View view, int position,
long id) {
//激发mCallbacks的selectItem方法
mCallbacks.selectItem(position, commonModels.get(position).getName());
}
});

listview_more.setOnItemClickListener(new OnItemClickListener(){

@Override
public void onItemClick(AdapterView<?

> parent, View view, int position,
long id) {
mCallbacks.selectItem(position, moreModels.get(position).getName());

}
});

listview_setting.setOnItemClickListener(new OnItemClickListener(){

@Override
public void onItemClick(AdapterView<?

> parent, View view, int position,
long id) {
// TODO Auto-generated method stub
mCallbacks.selectItem(position, settingModels.get(position).getName());
}

});

}

}

(6)其它文件 省略