利用ViewPager+Fragment+slidingmenu侧滑组件实现

OUCHMODE_MARGIN);

}

}

以上基本配置好了ViewPager组件，运行起来3个Fragment页面可以自由滑动了，但是下面的三个button还没有设置监听，所以viewpager切换的时候不会跟着切换，点击也不会有响应。接下来要做的就是在onCreate()里面初始化RadioButton，并给它设置OnClickListener监听点击事件：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

/**

* 初始化几个用来显示title的RadioButton

*/

private void initTitle() {

title.add((RadioButton) findViewById(R.id.title1));//三个title标签

title.add((RadioButton) findViewById(R.id.title2));

title.add((RadioButton) findViewById(R.id.title3));

title.get(0).setOnClickListener(new MyOnClickListener(0));//设置响应

title.get(1).setOnClickListener(new MyOnClickListener(1));

title.get(2).setOnClickListener(new MyOnClickListener(2));

}

/**

* 重写OnClickListener的响应函数，主要目的就是实现点击title时，pager会跟着响应切换

* @author llb

*/

private class MyOnClickListener implements OnClickListener{

private int index;

public MyOnClickListener(int index){

this.index=index;

}

@Override

public void onClick(View v) {

// TODO Auto-generated method stub

pager.setCurrentItem(index);//把viewpager的视图切过去，实现title跟pager的联动

title.get(index).setChecked(true);//设置被选中，否则布局里面的背景不会切换

}

}

最后就是实现侧滑出左边页面的效果，这里使用了开源组件SlidingMenu，具体的使用方法可百度or查看源代码。SlidingMenu组件重写了Activity、FragmentActivity、RelativeLayout等，要实现侧滑效果，可以把主函数继承的FragmentActivity改成SlidingFragmentActivity，也可以去在xml布局文件里面直接设置。这个demo里面采用的是继承SlidingFragmentActivity类，主要的初始化代码如下：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

/**

* 初始化开源组件SlidingMenu

*/

private void initSlidingMenu() {

// 实例化滑动菜单对象

SlidingMenu sm = getSlidingMenu();

setContentView(R.layout.activity_main);//设置当前的视图

setBehindContentView(R.layout.left);//设置左页视图

sm.setMode(SlidingMenu.LEFT);

// 设置滑动阴影的宽度

// 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_MARGIN);

// sm.setTouchModeBehind(SlidingMenu.TOUCHMODE_FULLSCREEN);//设置左页的响应范围

sm.setTouchmodeMarginThreshold(60);//这个设置的是隔屏幕边缘多远开始响应

// sm.setBehindOffset(50);//设置左页距离屏幕右边缘的距离，右页会补上

WindowManager wManager=(WindowManager) getSystemService(Context.WINDOW_SERVICE);

screenWidth=wManager.getDefaultDisplay().getWidth();//获取屏幕的宽度

sm.setBehindWidth((int) (screenWidth*0.8));//设置左页的宽度

}

最后附上其中一个Fragment的示例代码：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

public class ActivityFragment extends Fragment{

private View view;//缓存页面

@Override

public void onCreate(Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

}

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

if(view==null){

view=inflater.inflate(R.layout.activity_fragment,container, false);

}

ViewGroup parent = (ViewGroup) view.getParent();

if(parent!=null){

parent.removeView(view);//先移除

}

return view;

}

}