admin 管理员组

文章数量: 1184232

楚楚街开场动画(有彩蛋)

效果图


主要解决思路:

一个activity 二个fragment

首先,开启一个欢迎页面,此为fragment1,等待数秒,进入fragment2,在进入fragment2后,fragment1的图片设置为鹿岛社区(模糊图片),当刀子的滑动符合标准,会先显示fragment2的布局背景图片,点击一下,布局背景图片由不透明转变为透明,显示framgment1的背景图片(此时已经换为模糊的图片了),并且会弹出popWindow


主要代码:

StartActivity

package   com.lean.myapplication.activity;   import   android.content.Intent; import   android.os.Bundle; import   android.os.Handler; import   android.os.Message; import   android.support.v4.app.FragmentActivity; import   android.support.v4.app.FragmentManager; import   android.view.Gravity; import   android.view.MotionEvent; import   android.view.View; import   android.widget.FrameLayout; import   android.widget.ImageView; import   android.widget.PopupWindow; import   android.widget.RadioButton; import   android.widget.RadioGroup;     import   com.lean.myapplication.R; import   com.lean.myapplication.application.ChuChuJieApplication; import   com.lean.myapplication.fragment.BuyFragment_start_second; import   com.lean.myapplication.fragment.Buyfragment_start_first; import   com.lean.myapplication.utils.ShareUtils;   import   butterknife.InjectView;   /**   * <pre>   *    Author :  天府萧炎恋熏儿(WangShuJie)   *    Time   :  2016/10/28 9:04   *    Usage  :  StartActivity   *    desc   :   *    other  :   * </pre>   */ public   class   StartActivity  extends   FragmentActivity  implements   View.OnClickListener {            private   FragmentManager manager;             /** (WangShuJie)增加代码 usage:需传递到MainActivity的性别信息*/      private   String sex= "" ;        private   BuyFragment_start_second buyFragment_start_second;      private   Handler handle =  new   Handler() {          @Override          public   void   handleMessage(Message msg) {              super .handleMessage(msg);              switch   (msg.what) {                  case   1 :                      buyFragment_start_second =  new   BuyFragment_start_second();                                             /** (WangShuJie)增加代码 usage:添加第二个fragment*/                      manager.beginTransaction().add(R.id.activity_start_framlayout, buyFragment_start_second)mit();                                             /** (WangShuJie)增加代码 usage:跳转到第二个fragment的同时,设置第一个fragment的背景图为模糊图,以便第二次显示的时候图片已经发生更改*/                      mBuyfragment_start_first.getImg().setImageResource(R.mipmap.second_guide_social_blur);                      break ;                  case   2 :                        /** (WangShuJie)增加代码 usage:弹出选择男女性别的popWindows*/                      getWindowsex();                      break ;                  case   3 :                        /** (WangShuJie)增加代码 usage:是否将触摸事件传递的判断*/                      setIsPager2( true );                      break ;                  case   4 :                        /** (WangShuJie)增加代码 usage:跳转到MainActivity*/                      getChanges();                      break ;              }            }      };      private   float   mYdown;      private   Buyfragment_start_first mBuyfragment_start_first;      private   View mView;      private   ImageView mIv_start_student;      private   ImageView mIv_start_freaky;      private   ImageView mIv_start_freejob;      private   ImageView mIv_start_freshman;      private   ImageView mIv_start_worker;      private   RadioGroup mRg_start;      private   View mViewsex;      private   ImageView mIv_start_boysex;      private   ImageView mIv_start_girlsex;      private   RadioButton mRb1;      private   RadioButton mRb2;        /** (WangShuJie)增加代码 usage:设置需不需要将触摸事件传递给fragment2,默认false=不需要       * (此类初始化的时候会判断是否是第一次登入       * 如果是第一次登陆设置为true=需要(因为测试需要,所以shardPreference中的start键一直是false))*/      private   boolean   isPager2 =  false ;        public   void   setIsPager2( boolean   isPager2) {          this .isPager2 = isPager2;      }          @Override      protected   void   onCreate(Bundle savedInstanceState) {          super .onCreate(savedInstanceState);          setContentView(R.layout.activity_start);          manager = getSupportFragmentManager();            /** (WangShuJie)增加代码 usage:首先运行欢迎界面(即第一个fragment)*/          mBuyfragment_start_first =  new   Buyfragment_start_first();          manager.beginTransaction().replace(R.id.activity_start_framlayout, mBuyfragment_start_first)mit();            /** (WangShuJie)增加代码 usage:判断键(start)对应的值是否true,*/          if   (ShareUtils.getBoolean( this ,  "start" ,  true )) {                /** (WangShuJie)增加代码 usage:如果是的true话(会将触摸事件传递到fragemnt2,3秒后跳转fragment2*/              Message msg = Message.obtain();              msg.what =  1 ;              handle.sendMessageDelayed(msg,  3000 );              initView();              initListen();          } else {                /** (WangShuJie)增加代码 usage:如果不是true的话,3秒后跳转页面*/              Message msg = Message.obtain();              msg.what =  4 ;              handle.sendMessageDelayed(msg,  3000 );          }          }          @Override      public   boolean   onTouchEvent(MotionEvent event) {            if   (isPager2) {              switch   (event.getAction()) {                  case   MotionEvent.ACTION_DOWN:                      mYdown = event.getY();                      buyFragment_start_second.getTouchdown();                      break ;                  case   MotionEvent.ACTION_UP:                      buyFragment_start_second.getTouchup();                        break ;                  case   MotionEvent.ACTION_MOVE:                      float   distanceY = event.getY() - mYdown;                        buyFragment_start_second.getTouchmove(distanceY);                        break ;              }          }          return   super .onTouchEvent(event);          }        public   Handler getHandle() {          return   handle;      }        public   void   getPopWidow() {            PopupWindow pw =  new   PopupWindow(mView, ChuChuJieApplication.screenWidth, ChuChuJieApplication.screenHight *  2   /  3 );          pw.setFocusable( true );          pw.setTouchable( true );              pw.setOutsideTouchable( false );          pw.showAtLocation( new   View( this ), Gravity.CENTER,  0 ,  0 );      }        public   void   getWindowsex() {          PopupWindow pwsex =  new   PopupWindow(mViewsex, ChuChuJieApplication.screenWidth, ChuChuJieApplication.screenHight /  2 );          pwsex.setFocusable( true );          pwsex.setTouchable( true );          pwsex.setOutsideTouchable( false );          pwsex.showAtLocation( new   View( this ), Gravity.CENTER,  0 ,  0 );      }        private   void   initView() {          mView = View.inflate( this , R.layout.start_second_pw,  null );          mViewsex = View.inflate( this , R.layout.start_second_pwsex,  null );          mIv_start_student = (ImageView) mView.findViewById(R.id.iv_start_student);          mIv_start_freaky = (ImageView) mView.findViewById(R.id.iv_start_freaky);          mIv_start_freejob = (ImageView) mView.findViewById(R.id.iv_start_freejob);          mIv_start_freshman = (ImageView) mView.findViewById(R.id.iv_start_freshman);          mIv_start_worker = (ImageView) mView.findViewById(R.id.iv_start_worker);          mRg_start = (RadioGroup) mView.findViewById(R.id.rg_start);          mIv_start_boysex = (ImageView) mViewsex.findViewById(R.id.iv_start_boysex);          mIv_start_girlsex = (ImageView) mViewsex.findViewById(R.id.iv_start_girlsex);      }        private   void   initListen() {          //对popwindow中的控件设置监听          mIv_start_freaky.setOnClickListener( this );          mIv_start_freejob.setOnClickListener( this );          mIv_start_freshman.setOnClickListener( this );          mIv_start_worker.setOnClickListener( this );          mIv_start_student.setOnClickListener( this );          mIv_start_girlsex.setOnClickListener( this );          mIv_start_boysex.setOnClickListener( this );            //对group进行监听          mRg_start.setOnCheckedChangeListener( new   RadioGroup.OnCheckedChangeListener() {              @Override              public   void   onCheckedChanged(RadioGroup group,  int   checkedId) {                  switch   (checkedId) {                      case   R.id.rb1:                          mIv_start_freejob.setVisibility(View.VISIBLE);                          mIv_start_freaky.setVisibility(View.GONE);                          break ;                      case   R.id.rb2:                          mIv_start_freejob.setVisibility(View.GONE);                          mIv_start_freaky.setVisibility(View.VISIBLE);                          break ;                  }              }          });        }        @Override      public   void   onClick(View v) {          switch   (v.getId()) {              case   R.id.iv_start_freaky:                  getChanges();                  break ;              case   R.id.iv_start_freejob:                  getChanges();                  break ;              case   R.id.iv_start_freshman:                  getChanges();                  break ;              case   R.id.iv_start_worker:                  getChanges();                  break ;              case   R.id.iv_start_student:                  getChanges();                  break ;              case   R.id.iv_start_boysex:                  sex= "boy" ;                  getPopWidow();                  mRb1 = (RadioButton) mRg_start.getChildAt( 0 );                  mRg_start.check(mRb1.getId());                  break ;              case   R.id.iv_start_girlsex:                  sex= "girl" ;                  getPopWidow();                  mRb2 = (RadioButton) mRg_start.getChildAt( 1 );                  mRg_start.check(mRb2.getId());                  mIv_start_freejob.setVisibility(View.GONE);                  mIv_start_freaky.setVisibility(View.VISIBLE);                  break ;          }        }      /** (WangShuJie)增加代码 usage:进行跳转操作,跳转到MainActivity页面(正常的话这个动画只运行一次,填写("false"),为了测试用,改为("false"))*/      private   void   getChanges() {          ShareUtils.saveBoolean( this ,  "start" ,  true );          Intent intent= new   Intent( this , MainActivity. class );          intent.putExtra( "sex" ,sex);          startActivity(intent);          finish();      } }

Fragment1

package  com.lean.myapplication.fragment; import  android.view.LayoutInflater; import  android.view.View; import  android.widget.ImageView; import  android.widget.RelativeLayout; import  com.lean.myapplication.R; import  butterknife.ButterKnife; import  butterknife.InjectView; /**   * <pre>   *    Author :  天府萧炎恋熏儿(WangShuJie)   *    Time   :  2016/10/28 9:04   *    Usage  :  fragment1   *    desc   :   *    other  :   * </pre>   */ public  class  Buyfragment_start_first  extends  BaseFragment {      @InjectView (R.id.activity_start_iv)      ImageView mActivityStartIv;      @InjectView (R.id.activity_start_relayout1)      RelativeLayout mActivityStartRelayout1;      @InjectView (R.id.activity_start_ivback)      ImageView mActivityStartIvback;      private  View mView;      @Override      public  View loadXml(LayoutInflater inflater) {          mView = inflater.inflate(R.layout.activity_start_first,  null );          ButterKnife.inject( this , mView);          return  mView;      }      @Override      protected  void  initView(View view) {      }      @Override      protected  void  initData() {      }      @Override      public  void  onResume() {          super .onResume();      }      @Override      public  void  onStop() {          super .onStop();      }      @Override      public  void  onDestroyView() {          super .onDestroyView();          ButterKnife.reset( this );      }      public  ImageView getImg() {          mActivityStartIv.setVisibility(View.INVISIBLE);          return  mActivityStartIvback;      } }
}

fragment2

package   com.lean.myapplication.fragment; import  android.animation.Animator; import  android.animation.ObjectAnimator; import  android.animation.ValueAnimator; import  android.os.Bundle; import  android.os.Message; import  android.view.LayoutInflater; import  android.view.View; import  android.view.ViewGroup; import  android.view.animation.Animation; import  android.view.animation.AnimationUtils; import  android.widget.ImageView; import  android.widget.RelativeLayout; import  com.lean.myapplication.R; import  com.lean.myapplication.activity.StartActivity; import  com.lean.myapplication.application.ChuChuJieApplication; import  com.lean.myapplication.utils.MyLogger; import  butterknife.ButterKnife; import  butterknife.InjectView; /**   * <pre>   *    Author :  天府萧炎恋熏儿(WangShuJie)   *    Time   :  2016/10/28 9:04   *    Usage  :  fragment2   *    desc   :   *    other  :   * </pre>   */ public  class  BuyFragment_start_second  extends  BaseFragment {      @InjectView (R.id.activity_startsecond_ivleft)      ImageView mActivityStartsecondIvleft;      @InjectView (R.id.activity_startsecond_ivright)      ImageView mActivityStartsecondIvright;      @InjectView (R.id.activity_startsecond_hand)      ImageView mActivityStartsecondhand;      @InjectView (R.id.activity_startsecond_knife)      ImageView mActivityStartsecondKnife;      @InjectView (R.id.activity_startsecond)      RelativeLayout mActivityStartsecond;      private  MyLogger log = MyLogger.tfLog();      private  Animation mMAni;      /** (WangShuJie)增加代码 usage:手指在屏幕上滑动的距离*/      private  float  mGetPosition;      /** (WangShuJie)增加代码 usage:设置大门是否被打开过,默认true=没有被打开过*/      private  boolean  isStart =  true ;      /** (WangShuJie)增加代码 usage:获取到StartActivity的实例*/      private  StartActivity mActivity;      @Override      public  View loadXml(LayoutInflater inflater) {          /** (WangShuJie)增加代码 usage:初始化布局*/          View rootView = inflater.inflate(R.layout.activity_start_second,  null );          ButterKnife.inject( this , rootView);          return  rootView;      }      @Override      protected  void  initView(View view) {          /** (WangShuJie)增加代码 usage:给手指(下滑有惊喜)添加动画,主要有透明效果和平移效果*/          mMAni = AnimationUtils.loadAnimation(getActivity(), R.anim.activity_start_secondhand);          /** (WangShuJie)增加代码 usage:将动画添加到image控件上*/          mActivityStartsecondhand.startAnimation(mMAni);      }      @Override      protected  void  initData() {      }      @Override      public  View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {          // TODO: inflate a fragment view          View rootView =  super .onCreateView(inflater, container, savedInstanceState);          ButterKnife.inject( this , rootView);          return  rootView;      }      @Override      public  void  onDestroyView() {          super .onDestroyView();          ButterKnife.reset( this );      }      /**       * 手指落下调用的方法       **/      public  void  getTouchdown() {          log.i( "getTouchdown" );          /** (WangShuJie)增加代码 usage:每次手指按下的时候,初始化手指在屏幕上滑动的距离为0*/          mGetPosition =  0 ;          /** (WangShuJie)增加代码 usage:给手指(下滑有惊喜)去除动画,并设置为不可见*/          mActivityStartsecondhand.clearAnimation();          mActivityStartsecondhand.setVisibility(View.INVISIBLE);          /** (WangShuJie)增加代码 usage:判断isStart,主要是为了解决当符合滑动条件的时候,(滑动的距离大于等于屏幕高度的1/3),此时大门已经打开,便会运行里面的方法*/          if  (!isStart) {              /** (WangShuJie)增加代码 usage:给当前页面设置动画(其实是此页面的背景图片),由不透明变为透明*/              ObjectAnimator.ofFloat(mActivityStartsecond,  "alpha" , 1f,0f).setDuration( 1500 ).start();              mActivity.setIsPager2( false );              /** (WangShuJie)增加代码 usage:通知StartActivity,运行里面的what=2(主要是弹出选择男女性别的popwindows),*/              Message msg=Message.obtain();              msg.what= 2 ;              mActivity.getHandle().sendMessageDelayed(msg, 1300 ); // //            /** (WangShuJie)增加代码 usage:给刀去除动画,并设置为不可见*/ //            mActivityStartsecondKnife.clearAnimation(); //            mActivityStartsecondKnife.setVisibility(View.INVISIBLE);          }      }      /**       * 手指抬起调用的方法       **/      public  void  getTouchup() {          /** (WangShuJie)增加代码 usage:判断下滑动距离是否大于屏幕高度的1/3而且大门没有被打开过*/          if  (mGetPosition >= ChuChuJieApplication.screenHight /  3  && isStart) {              /** (WangShuJie)增加代码 usage:大门被打开过了,所有设置isStart=false*/              isStart =  false ;              /** (WangShuJie)增加代码 usage:设置刀的自动向下平移动画*/              Animator tranY = ObjectAnimator.ofFloat(mActivityStartsecondKnife,  "translationY" , ChuChuJieApplication.screenHight);              tranY.start();              /** (WangShuJie)增加代码 usage:开启大门打开的动画*/              getAni(); // //            Message obtain = Message.obtain(); //            obtain.what=3; //            mActivity.getHandle().sendMessageDelayed(obtain,2000);              /** (WangShuJie)增加代码 usage:取消手指的显示*/              mActivityStartsecondhand.clearAnimation();              mActivityStartsecondhand.setVisibility(View.INVISIBLE);          }          /** (WangShuJie)增加代码 usage:如果大门没被打开运行此方法,若大门被打开,则不运行*/          if  (isStart) {              /** (WangShuJie)增加代码 usage:设置手指可见,并开启动画*/              mActivityStartsecondhand.setVisibility(View.VISIBLE);              mActivityStartsecondhand.startAnimation(mMAni);              /** (WangShuJie)增加代码 usage:设置刀初始化到原始状态,并添加了动画效果*/              Animator tranY = ObjectAnimator.ofFloat(mActivityStartsecondKnife,  "translationY" 0 );              tranY.setDuration( 500 );              tranY.start();          }      }      /** (WangShuJie)增加代码 usage:手指移动调用的方法*/      public  void  getTouchmove( float  distanceY) {          log.i( "==========天府萧炎恋熏儿==========手指移动的距离=" +distanceY);          /** (WangShuJie)增加代码 usage:手指向下移动的距离*/          if  (distanceY >  0 ) {              Animator tranY = ObjectAnimator.ofFloat(mActivityStartsecondKnife,  "translationY" , mGetPosition, distanceY);              tranY.start();          /** (WangShuJie)增加代码 usage:手指向上移动的距离(是负值)*/          else  if (distanceY< 0 ){              Animator tranY = ObjectAnimator.ofFloat(mActivityStartsecondKnife,  "translationY" , mGetPosition, distanceY);              tranY.start();          }          mGetPosition = distanceY;      }      /** (WangShuJie)增加代码 usage:打开大门的动画设置*/      public  void  getAni() { //        Animation animation = AnimationUtils.loadAnimation(getActivity(), R.anim.activity_start_secondleft); //        mActivityStartsecondIvleft.startAnimation(animation); //        mActivityStartsecondIvleft.setRotationY(100);          ObjectAnimator customleft = ObjectAnimator.ofFloat(mActivityStartsecondIvleft,  "rotateY" 0 90 );          customleft.setDuration( 2000 );          customleft.addUpdateListener( new  ValueAnimator.AnimatorUpdateListener() {              @Override              public  void  onAnimationUpdate(ValueAnimator animation) { //                mActivityStartsecondIvleft.setScaleX((Float) animation.getAnimatedValue() / 10); //                mActivityStartsecondIvleft.setScaleY((Float) animation.getAnimatedValue()); //                        iv.setTranslationZ((Float) animation.getAnimatedValue());                  mActivityStartsecondIvleft.setRotationY((Float) animation.getAnimatedValue());              }          });          customleft.start();          ObjectAnimator customright = ObjectAnimator.ofFloat(mActivityStartsecondIvright,  "rotateY" 0 , - 90 );          customright.setDuration( 2000 );          customright.addUpdateListener( new  ValueAnimator.AnimatorUpdateListener() {              @Override              public  void  onAnimationUpdate(ValueAnimator animation) { //                mActivityStartsecondIvleft.setScaleX((Float) animation.getAnimatedValue() / 10); //                mActivityStartsecondIvleft.setScaleY((Float) animation.getAnimatedValue()); //                        iv.setTranslationZ((Float) animation.getAnimatedValue());                  mActivityStartsecondIvright.setRotationY((Float) animation.getAnimatedValue());              }          });          customright.start();          /** (WangShuJie)增加代码 usage:大门关闭后,实际上显示的是第二个fragment背景图片(不要被表面迷惑了)*/      }      @Override      public  void  onStart() {          super .onStart();          mActivity = (StartActivity) getActivity();          mActivity.setIsPager2( true );      } }
此处为源码

本文标签: 楚楚街开场动画(有彩蛋)