《Android应用程序开发》教案

教案课程名称：《Android应用程序开发》课程性质：■必修课□限选课□任选课学时学分：学分4学时68开课部门：设计与艺术分院课程从属专业(学科)：计算机应用技术专业开课学期：2017-2018学年第一学期教师姓名：教师职称：讲师授课对象：15计算机应用技术教案设计规范要求教案是教师为有效开展教学活动，根据培养方案、课程标准、学生学情等具体情况，以一次课或一个教学单元（含：一个课题、一个项目、一个任务、一个案例等）为对象，进行教学设计的重要教学文件。一个完整的教案应包括：教学目标、教学内容（含重难点）、教学方法、教学媒介、教学过程及学生课外任务等设计，并包括授课对象的学情分析及教师课后教学反思等要素。教案设计应注重科学性、有效性、针对性、创新性和可操作性，并体现规范性。（存档时，封面及本页请正反面打印）

教案序号：.课题SideMenu授课形式□理论■理实一体□实训(验)□其它：学时安排本单元总学时：4（其中：理论2学时、实践2学时）教学内容及目标掌握SideMenu的使用；与Fragment、动画的配合；教学重点及难点重点和难点：掌握与Fragment、动画的配合使用。授课对象学情分析Fragment课时比较多，掌握情况会相对好一点，但动画课时较少，实用起来有点困难。教学媒介多媒体教学场所机房。3414课后任务：完成课堂案例。教学后记：Android——SideMenu侧滑菜单的实现新课导入：前面学习了Android的Fragment，今天让我们在来学习一个在实战中使用广泛的控件，SideMenu侧滑菜单。课程实施：SideMenu侧滑菜单的实现，自定义的Animation效果，先看看实现的效果。

总体来说也并不复杂，下面给大家看下整个项目的结构：

以下是实现的源码及详细步骤：

新建androidstudio项目我这边就不讲述了，说一下androidstudio关联library项目，很简单，我贴几张图片大家就知道了，File->

然后

这样就可以了。

首先看下ViewAnimationUtils类

packagecom.lai.library.utils;importandroid.app.Activity;importandroid.os.Handler;importandroid.support.v4.widget.DrawerLayout;importandroid.view.View;importandroid.view.animation.AccelerateInterpolator;importandroid.view.animation.Animation;importandroid.widget.ImageView;importcom.lai.library.animations.FlipAnimation;importerfaces.Resourceble;importerfaces.ScreenShortable;importjava.util.ArrayList;importjava.util.List;importstaticcom.lai.sidemenu.R.layout;/***Createdbyhenryon2016/5/11.*自定义的动画效果*/publicclassViewAnimationUtils<TextendsResourceble>{/***切换隐藏与显示的效果*/privatefinalintANIMATION_DURATION=10;publicstaticfinalintCIRCULAR_REVEAL_ANIMATION_DURATION=20;privateActivityactivity;privateList<T>list;privateList<View>viewList=newArrayList<View>();//View集合privateScreenShortablescreenShortable;//获取图片privateDrawerLayoutdrawerLayout;privateViewAnimatorListenerviewAnimatorListener;//实现定义接口/***构造器*/publicViewAnimationUtils(Activityactivity,List<T>list,ScreenShortablescreenShortable,DrawerLayoutdrawerLayout,ViewAnimatorListenerviewAnimatorListener){this.activity=activity;this.list=list;this.screenShortable=screenShortable;this.drawerLayout=drawerLayout;this.viewAnimatorListener=viewAnimatorListener;}/***显示菜单的数量*/publicvoidshowMenuCount(){setViewsClickable(false);//刚显示个数时view是出于false的状态viewList.clear();//清空组件doublesize=list.size();for(inti=0;i<size;i++){ViewviewMenu=activity.getLayoutInflater().inflate(layout.menu_list_item,null);finalintfinalI=i;/***view的点击事件*/viewMenu.setOnClickListener(newView.OnClickListener(){@OverridepublicvoidonClick(Viewv){int[]localtion={0,0};//用数组坐标记录位置v.getLocationOnScreen(localtion);//垂直switchItem(list.get(finalI),localtion[1]+v.getHeight()/2);//点击后调用switchItem隐藏}});//得到资源并设置((ImageView)viewMenu.findViewById(com.lai.sidemenu.R.id.menu_item_image)).setImageResource(list.get(i).getImageRes());viewMenu.setVisibility(View.GONE);viewMenu.setEnabled(false);viewList.add(viewMenu);//添加list中viewAnimatorListener.addViewToContainer(viewMenu);//添加到动画接口中finaldoubleposition=i;finaldoubledelay=3*ANIMATION_DURATION*(position/size);/***耗时操作*/newHandler().postDelayed(newRunnable(){@Overridepublicvoidrun(){if(position<viewList.size()){animateView((int)position);}if(position==viewList.size()-1){screenShortable.takeScreenShort();setViewsClickable(true);}}},(long)delay);}}/***设置View*/privatevoidanimateView(intposition){finalViewview=viewList.get(position);view.setVisibility(View.VISIBLE);//可见FlipAnimationrotation=newFlipAnimation(90,0,0.0f,view.getHeight()/2.0f);//设置动画效果rotation.setDuration(ANIMATION_DURATION);rotation.setFillAfter(true);rotation.setInterpolator(newAccelerateInterpolator());//动画监听rotation.setAnimationListener(newAnimation.AnimationListener(){@OverridepublicvoidonAnimationStart(Animationanimation){}@OverridepublicvoidonAnimationEnd(Animationanimation){view.clearAnimation();//结束后清除动画效果}@OverridepublicvoidonAnimationRepeat(Animationanimation){}});}/***点击的Item*/privatevoidswitchItem(ResourcebleslideMenuItem,inttopPosition){this.screenShortable=viewAnimatorListener.onSwitch(slideMenuItem,screenShortable,topPosition);//点击后隐藏viewListhideMenuContent();}/***隐藏menu*/privatevoidhideMenuContent(){setViewsClickable(false);doublesize=list.size();//隐藏全部for(inti=list.size();i>=0;i--){finaldoubleposition=i;//记录在viewList中点击的position作为头部，添加动画效果finaldoubledelay=3*ANIMATION_DURATION*(position/size);//线程时间（其实这一步没必要，线程的时间可以直接写死）//耗时操作应放在handler里面操作newHandler().postDelayed(newRunnable(){@Overridepublicvoidrun(){if(position<viewList.size()){//设置隐藏时的动画animateHideView((int)position);}}},(long)delay);}}/***设置view隐藏时的动画*/privatevoidanimateHideView(finalintposition){finalViewview=viewList.get(position);//得到点击的view//0表示正在处于的状态为0°，90为操作后的度数，0.0f表示起始精确位置，centerY为view高度的二分之一FlipAnimationrotation=newFlipAnimation(0,90,0.0f,view.getHeight()/2.0f);//设置动画rotation.setDuration(ANIMATION_DURATION);//设置动画时间rotation.setFillAfter(true);rotation.setInterpolator(newAccelerateInterpolator());rotation.setAnimationListener(newAnimation.AnimationListener(){@OverridepublicvoidonAnimationStart(Animationanimation){}/***结束时*@paramanimation*/@OverridepublicvoidonAnimationEnd(Animationanimation){view.clearAnimation();view.setVisibility(View.INVISIBLE);//隐藏viewif(position==viewList.size()-1)//防止越界{viewAnimatorListener.enableHomeButton();drawerLayout.closeDrawers();//关闭drawers}}@OverridepublicvoidonAnimationRepeat(Animationanimation){}});view.startAnimation(rotation);//开始动画}/***设置控件是否可用*/privatevoidsetViewsClickable(booleanclickable){//点击以后view不可再重新点击viewAnimatorListener.disableHomeButton();/***点击第几个view*/for(Viewview:viewList){view.setEnabled(clickable);}}/***定义接口*/publicinterfaceViewAnimatorListener{//点击MenuItempublicScreenShortableonSwitch(ResourcebleslideMenuItem,ScreenShortablescreenShortable,intposition);publicvoiddisableHomeButton();publicvoidenableHomeButton();publicvoidaddViewToContainer(Viewview);}}上面的注释写的非常详细了，一目了然。下面是FlipAnimation类，自定义的动画效果，代码量很少，更容易理解！packagecom.lai.library.animations;/***Createdbyhenryon2016/5/11.*/importandroid.graphics.Camera;importandroid.graphics.Matrix;importandroid.view.animation.Animation;importandroid.view.animation.Transformation;/***自定义动画效果*/publicclassFlipAnimationextendsAnimation{privatefinalfloatmFromDegrees;//起始的度数privatefinalfloatmToDegrees;//要到达的度数privatefinalfloatmCenterX;//水平方向X轴的位置privatefinalfloatmCenterY;//Y轴的位置privateCameramCamera;/***构造器**@paramfromDegrees*@paramtoDegrees*@paramcenterX*@paramcenterY*/publicFlipAnimation(floatfromDegrees,floattoDegrees,floatcenterX,floatcenterY){this.mFromDegrees=fromDegrees;this.mToDegrees=toDegrees;this.mCenterX=centerX;this.mCenterY=centerY;}/***初始化屏幕宽度创建Camera**@paramwidth*@paramheight*@paramparentWidth*@paramparentHeight*/publicvoidinitialize(intwidth,intheight,intparentWidth,intparentHeight){super.initialize(width,height,parentWidth,parentHeight);mCamera=newCamera();}/***动画效果*/publicvoidapplyTransformation(floatinterpolatedTime,Transformationtransformation){finalfloatfromDegrees=mFromDegrees;floatdegrees=fromDegrees+((mToDegrees-fromDegrees)*interpolatedTime);//总度数/***获取值*/finalfloatcenterX=mCenterX;finalfloatcenterY=mCenterY;finalCameracamera=mCamera;/***对图片进行处理*Translate平移变换Rotate旋转变换Scale缩放变换Skew错切变换*/finalMatrixmatrix=transformation.getMatrix();camera.save();//保存当前状态，与restore是成对出现的camera.rotateY(degrees);//Y轴旋转camera.getMatrix(matrix);//得到设置后的matrixcamera.restore();//回复当前状态/***下面两句标识以动画中心点为中央部分*/matrix.preTranslate(-centerX,-centerY);matrix.postTranslate(centerX,centerY);}}写完关联的library以后，接下来就是我们实际操作的页面了。我们只需要在MainActivity里面嵌套一个Fragment就行了，然后再实现完ViewAnimationUtils的四个接口，马上开始。

第一步写一个Fragment类packagecom.lai.sidemenu.fragment;importandroid.app.Fragment;importandroid.graphics.Bitmap;importandroid.graphics.Canvas;importandroid.os.Bundle;importandroid.support.annotation.Nullable;importandroid.view.LayoutInflater;importandroid.view.View;importandroid.view.ViewGroup;importandroid.widget.ImageView;importerfaces.ScreenShortable;importcom.lai.sidemenu.R;/***Createdbyhenryon2016/5/11.*/publicclassContentFragmentextendsFragmentimplementsScreenShortable{/***点击图片需要切换的选项value*/publicstaticfinalStringCLOSE="关闭";publicstaticfinalStringBUILDING="创建";publicstaticfinalStringBOOK="书本";publicstaticfinalStringPAINT="交点";publicstaticfinalStringCASE="案例";publicstaticfinalStringSHOP="商品";publicstaticfinalStringPARTY="派对";publicstaticfinalStringMOVIE="电影";privateViewrootView;privateImageViewmImageView;privateintres;privateBitmapbitmap;publicstaticContentFragmentnewInstance(intresId){ContentFragmentcontentFragment=newContentFragment();Bundlebundle=newBundle();bundle.putInt(Integer.class.getName(),resId);contentFragment.setArguments(bundle);//设置ArgumentsreturncontentFragment;}@OverridepublicvoidonViewCreated(Viewview,BundlesavedInstanceState){super.onViewCreated(view,savedInstanceStat