经过上一篇文章的学习，相信大家对开源项目SlidingMenu的用法已经有了一个非常深入的了解，那么这一章博

主就来教大家滑动菜单栏滑动时动画效果的实现。博主这里用了三个不同动画效果的基础示例来教大家如何去实现，

等大家弄懂了之后完全可以做到举一反三，去实现更多不同的动画效果，让你的应用软件给用户带来眼前一亮的效

果。

一、SlidingMenu动画效果示例一

1、示例一效果图

该示例实现了滑动时缩放的效果，看左边的效果图可以明显的感觉到，滑动菜单栏刚刚打开时的图片比右边的效

果图滑动菜单栏打开一大半的图片要小。这里用到的是比例缩放的动画效果。

2、示例一项目结构图

3、示例一代码讲解

关于项目中资源文件的部分我就不详细讲解了，在上篇文章中已经详细的介绍过了，这地方我就着重的讲解一下MainActivity类，也是主程序入口类，滑动菜单栏和滑动的效果都是在此类中实现。

[java] view plain copy

1. packagecom.example.myslidingmenudemo08;
3. importandroid.graphics.Canvas;
4. importandroid.os.Bundle;
5. importandroid.view.MenuItem;
7. importcom.jeremyfeinstein.slidingmenu.lib.SlidingMenu;
8. importcom.jeremyfeinstein.slidingmenu.lib.SlidingMenu.CanvasTransformer;
9. importcom.jeremyfeinstein.slidingmenu.lib.app.SlidingFragmentActivity;
11. publicclassMainActivityextendsSlidingFragmentActivity{
12. privateCanvasTransformermTransformer;
14. @Override
15. publicvoidonCreate(BundlesavedInstanceState){
16. super.onCreate(savedInstanceState);
18. setTitle("Zoom");
20. initAnimation();
22. initSlidingMenu();
24. getActionBar().setDisplayHomeAsUpEnabled(true);
25. }
27. /**
28. *初始化滑动菜单
29. */
30. privatevoidinitSlidingMenu(){
31. //设置主界面视图
32. setContentView(R.layout.content_frame);
33. getSupportFragmentManager().beginTransaction().replace(R.id.content_frame,newSampleListFragment()).commit();
35. //设置滑动菜单视图
36. setBehindContentView(R.layout.menu_frame);
37. getSupportFragmentManager().beginTransaction().replace(R.id.menu_frame,newSampleListFragment()).commit();
39. //设置滑动菜单的属性值
40. SlidingMenusm=getSlidingMenu();
41. sm.setShadowWidthRes(R.dimen.shadow_width);
42. sm.setShadowDrawable(R.drawable.shadow);
43. sm.setBehindOffsetRes(R.dimen.slidingmenu_offset);
44. sm.setFadeDegree(0.35f);
45. sm.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
46. sm.setBehindScrollScale(0.0f);
47. sm.setBehindCanvasTransformer(mTransformer);
49. setSlidingActionBarEnabled(true);
50. }
52. /**
53. *初始化动画效果
54. */
55. privatevoidinitAnimation(){
56. mTransformer=newCanvasTransformer(){
57. @Override
58. publicvoidtransformCanvas(Canvascanvas,floatpercentOpen){
59. floatscale=(float)(percentOpen*0.25+0.75);
60. canvas.scale(scale,scale,canvas.getWidth()/2,canvas.getHeight()/2);
61. }
63. };
64. }
66. @Override
67. publicbooleanonOptionsItemSelected(MenuItemitem){
68. switch(item.getItemId()){
69. caseandroid.R.id.home:
70. toggle();
71. returntrue;
72. }
73. returnsuper.onOptionsItemSelected(item);
74. }
76. }

大家可以先看一遍上面的这段代码，要想实现动画效果主要有三个步骤：

<1> 先定义一个CanvasTransformer接口对象，这个接口是在slidingmenu_library类库中封装好的，所以要想运行此项目还要导入slidingmenu_library类库，这个导入的方法已经在前面详细的介绍过了，不清楚的同学可以参考：

【Android UI设计与开发】第16期：滑动菜单栏（一）开源项目SlidingMenu的使用

[java] view plain copy

1. privateCanvasTransformermTransformer;

<2> 然后再实例化此接口，重写接口中的方法：

[java] view plain copy

1. mTransformer=newCanvasTransformer(){
2. @Override
3. publicvoidtransformCanvas(Canvascanvas,floatpercentOpen){
4. floatscale=(float)(percentOpen*0.25+0.75);
5. canvas.scale(scale,scale,canvas.getWidth()/2,canvas.getHeight()/2);
6. }
8. };

我们可以看到在transformCanvas(Canvas canvas, float percentOpen)方法中，有两个参数：

① Canvas canvas：画布类；

② float percentOpen：滑动菜单栏打开时的百分比值。

<3> 最后在把实例化的接口对象赋给SlidingMenu类中的setBehindCanvasTransformer()方法：

[java] view plain copy

1. sm.setBehindCanvasTransformer(mTransformer);

这样，一个滑动菜单栏打开时的动画效果就配置好了，怎么样？还是很简单的吧。

二、SlidingMenu动画效果示例二

1、示例二效果图

该示例主要实现了当滑动菜单栏打开时滑动伸缩的效果，大家通过两站效果图的对比可以很清楚的看到。

2、示例二项目结构图

大家可以拿此图跟示例一的项目结构图做对比，会发现几乎都是一模一样的，不一样的只是MainActivity类中动画

的实现代码不一样，仅此而已。

3、示例二项目代码

MainActivity.java：

[java] view plain copy

1. packagecom.yangyu.myslidingmenudemo09;
3. importandroid.graphics.Canvas;
4. importandroid.os.Bundle;
5. importandroid.view.MenuItem;
7. importcom.jeremyfeinstein.slidingmenu.lib.SlidingMenu;
8. importcom.jeremyfeinstein.slidingmenu.lib.SlidingMenu.CanvasTransformer;
9. importcom.jeremyfeinstein.slidingmenu.lib.app.SlidingFragmentActivity;
11. publicclassMainActivityextendsSlidingFragmentActivity{
12. privateCanvasTransformermTransformer;
14. @Override
15. publicvoidonCreate(BundlesavedInstanceState){
16. super.onCreate(savedInstanceState);
18. setTitle("Scale");
20. initAnimation();
22. initSlidingMenu();
24. getActionBar().setDisplayHomeAsUpEnabled(true);
25. }
27. /**
28. *初始化滑动菜单
29. */
30. privatevoidinitSlidingMenu(){
31. //设置主界面视图
32. setContentView(R.layout.content_frame);
33. getSupportFragmentManager().beginTransaction().replace(R.id.content_frame,newSampleListFragment()).commit();
35. //设置滑动菜单视图
36. setBehindContentView(R.layout.menu_frame);
37. getSupportFragmentManager().beginTransaction().replace(R.id.menu_frame,newSampleListFragment()).commit();
39. //设置滑动菜单的属性值
40. SlidingMenusm=getSlidingMenu();
41. sm.setShadowWidthRes(R.dimen.shadow_width);
42. sm.setShadowDrawable(R.drawable.shadow);
43. sm.setBehindOffsetRes(R.dimen.slidingmenu_offset);
44. sm.setFadeDegree(0.35f);
45. sm.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
46. sm.setBehindScrollScale(0.0f);
47. sm.setBehindCanvasTransformer(mTransformer);
49. setSlidingActionBarEnabled(true);
50. }
52. /**
53. *初始化动画效果
54. */
55. privatevoidinitAnimation(){
56. mTransformer=newCanvasTransformer(){
57. @Override
58. publicvoidtransformCanvas(Canvascanvas,floatpercentOpen){
59. canvas.scale(percentOpen,1,0,0);
60. }
62. };
63. }
65. @Override
66. publicbooleanonOptionsItemSelected(MenuItemitem){
67. switch(item.getItemId()){
68. caseandroid.R.id.home:
69. toggle();
70. returntrue;
71. }
72. returnsuper.onOptionsItemSelected(item);
73. }
75. }

细心的读者会发现，整段代码中跟示例一的代码比起来，只是initAnimation()方法中的代码改变了一点点，正是

因为改变这一点点的代码，就可以实现了滑动伸缩的动画效果。

三、SlidingMenu动画效果示例三

1、示例三效果图

该示例效果实现了当滑动菜单栏刚刚打开时，滑动菜单栏的视图内容从下方渐渐的往上移动，等滑动菜单栏完全

打开时，该视图就会移动到最顶端。大家对比两张效果图就可以很清楚的看到此效果了。

2、示例三项目结构图

3、示例三项目代码

MainActivity.java：

[java] view plain copy

1. packagecom.yangyu.myslidingmenudemo10;
3. importandroid.graphics.Canvas;
4. importandroid.os.Bundle;
5. importandroid.view.MenuItem;
6. importandroid.view.animation.Interpolator;
8. importcom.jeremyfeinstein.slidingmenu.lib.SlidingMenu;
9. importcom.jeremyfeinstein.slidingmenu.lib.SlidingMenu.CanvasTransformer;
10. importcom.jeremyfeinstein.slidingmenu.lib.app.SlidingFragmentActivity;
12. publicclassMainActivityextendsSlidingFragmentActivity{
13. privateCanvasTransformermTransformer;
15. @Override
16. publicvoidonCreate(BundlesavedInstanceState){
17. super.onCreate(savedInstanceState);
19. setTitle("SlideUp");
21. initAnimation();
23. initSlidingMenu();
25. getActionBar().setDisplayHomeAsUpEnabled(true);
26. }
28. /**
29. *初始化滑动菜单
30. */
31. privatevoidinitSlidingMenu(){
32. //设置主界面视图
33. setContentView(R.layout.content_frame);
34. getSupportFragmentManager().beginTransaction().replace(R.id.content_frame,newSampleListFragment()).commit();
36. //设置滑动菜单视图
37. setBehindContentView(R.layout.menu_frame);
38. getSupportFragmentManager().beginTransaction().replace(R.id.menu_frame,newSampleListFragment()).commit();
40. //设置滑动菜单的属性值
41. SlidingMenusm=getSlidingMenu();
42. sm.setShadowWidthRes(R.dimen.shadow_width);
43. sm.setShadowDrawable(R.drawable.shadow);
44. sm.setBehindOffsetRes(R.dimen.slidingmenu_offset);
45. sm.setFadeDegree(0.35f);
46. sm.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
47. sm.setBehindScrollScale(0.0f);
48. sm.setBehindCanvasTransformer(mTransformer);
50. setSlidingActionBarEnabled(true);
51. }
53. privatestaticInterpolatorinterp=newInterpolator(){
54. @Override
55. publicfloatgetInterpolation(floatt){
56. t-=1.0f;
57. returnt*t*t+1.0f;
58. }
59. };
61. /**
62. *初始化动画效果
63. */
64. privatevoidinitAnimation(){
65. mTransformer=newCanvasTransformer(){
66. @Override
67. publicvoidtransformCanvas(Canvascanvas,floatpercentOpen){
68. canvas.translate(0,canvas.getHeight()*(1-interp.getInterpolation(percentOpen)));
69. }
70. };
71. }
73. @Override
74. publicbooleanonOptionsItemSelected(MenuItemitem){
75. switch(item.getItemId()){
76. caseandroid.R.id.home:
77. toggle();
78. returntrue;
79. }
80. returnsuper.onOptionsItemSelected(item);
81. }
83. }

在这段代码中，我们将会使用到一个动画插入器Interpolator接口，这个接口是干吗用的呢？

答：在Android的动画效果实现中，我们使用Interpolator来控制动画的进度。Interpolator 定义了动画的变化速度，可以实现匀速、正加速、负加速、无规则变加速等。所以要想实现缓慢往上移动的效果就要使用到此它，并且重写此接口中的getInterpolation(float t)方法。

好的，关于开源项目SlidingMenu最基础的使用方法差不多讲解到这里就要结束

了，大家会发现这个开源项目直接拿过来还是非常好用的，里面的各种方法都已经被封

装的非常好了。关于后面的滑动菜单栏专题，博主还是会从实战出发，模仿几个当前非

常优秀的应用软件的滑动菜单栏的效果，如唱吧、网易新闻、印象笔记等等。希望大家

能继续关注！

示例项目下载地址

压缩包中包含所有的项目示例：

每个示例项目中都包含了源码、实现的效果图、项目结构图以及可直接安装运行的APK：

特别注意：大家运行项目的时候千万别忘了导入slidingmenu_library项目，使用方法请参照上一篇文章。

更多相关文章

1. Android(安卓)菜单开发自定义效果
2. Android绘图机制与处理技巧——Android图像处理之色彩特效处理
3. Android(安卓)实现书籍翻页效果----升级篇----->>>>>>>最终版
4. android TextView文字跟随seekBar滑动条滑块的位置移动
5. Android实现竖着的滑动刻度尺效果，选择身高（竖向的）Android实现滑动
6. Android简单、高性能的高斯模糊（毛玻璃）效果(附源码)
7. Android(安卓)快速实现 ViewPager 滑动页卡切换（可用作整个 app上
8. android 仿 ios 搜索界面跳转效果
9. Android(安卓)应用的动画实践--View Animation篇

随机推荐

1. 深入浅出Android(安卓)Gradle构建系统 (
2. linux 配置安装android sdk自动下载缺少
3. 去除listBView的抖动，判断textView中文本
4. 【Android(安卓)开发】：UI控件之 AlertDia
5. Android基于基于布局嵌套的页面导航实现
6. Android Studio http://schemas.android.
7. android string.xml中格式资源字符串
8. android intent.setType("type");的含义
9. [Android]免费帮你去广告，甚至是破解
10. Android(安卓)6.0 分析 （一位网友的分析，不