Analysis of Animation Animation Compilation Points in Android

View in API Demo- > Four Demo of Animation can be found under Animation, and the first 3D Translate is more complicated. Finally, let's talk about the second Interpolator first. The Activity corresponds to Animation3.java in the view packet and animation_3. xml of layout.

The layout of the interface is not explained, just one Spinner and one TextView. Is not the content of this article.

Mainly explain the next few key statements.

Initialize Animation, from the name of the class can be seen is a transformation of the position of View animation, parameters starting point abscissa, end point abscissa, starting point ordinate, end point ordinate.

Animation a = new TranslateAnimation(0.0f, 
        targetParent.getWidth() - target.getWidth() - targetParent.getPaddingLeft() - 
        targetParent.getPaddingRight(), 0.0f, 0.0f); 

The following is the parameter setting of animation, and I added comments

a.setDuration(1000);// Time to set animation  
    a.setStartOffset(300);// Set the delay of animation start  
    // Set the repeat mode, RESTART To start over after the end, REVERSE To return backwards to the original trajectory  
    a.setRepeatMode(Animation.RESTART); 
    // Set the number of repetitions, INFINITE For infinity  
    a.setRepeatCount(Animation.INFINITE); 
    // According to the user's Spinner Selection settings of target The way of entering  
    switch (position) { 
      case 0: 
        // Accelerated entry  
        a.setInterpolator(AnimationUtils.loadInterpolator(this.R.anim.accelerate_interpolator)); 
        break; 
      case 1: 
        // Decelerate entry  
        a.setInterpolator(AnimationUtils.loadInterpolator(this, 
            android.R.anim.decelerate_interpolator)); 
        break; 
      case 2: 
        // Accelerated entry . And 1 The difference is when repeatMode For reverse Hour , Still accelerating back to the origin  
        a.setInterpolator(AnimationUtils.loadInterpolator(this, 
            android.R.anim.accelerate_decelerate_interpolator)); 
        break; 
      case 3: 
        // Step back first 1 Point and then accelerate forward  
        a.setInterpolator(AnimationUtils.loadInterpolator(this, 
            android.R.anim.anticipate_interpolator)); 
        break; 
      case 4: 
        // Slow down and advance , Back before crossing the finish line  
        a.setInterpolator(AnimationUtils.loadInterpolator(this, 
            android.R.anim.overshoot_interpolator)); 
        break; 
      case 5: 
        //case 3,4 The combination of  
        a.setInterpolator(AnimationUtils.loadInterpolator(this, 
            android.R.anim.anticipate_overshoot_interpolator)); 
        break; 
      case 6: 
        // Vibrate back a few times before stopping  
        a.setInterpolator(AnimationUtils.loadInterpolator(this, 
            android.R.anim.bounce_interpolator)); 
        break; 
    } 
    // Jean target Start executing this animation  
    target.startAnimation(a); 
  } 

Here is the use of Android has been preset 1 action, we can also customize XML to achieve better animation effect, this next 1.

In addition to TranslationAnimation, there are AlphaAnimation, RotateAnimation and ScaleAnimation. Using the combination of these matrix actions, a series of complex animation effects can be formed. Please see SDK for specific usage.

The whole is relatively simple, on the call of a function, still don't understand to see the comments of API and SDK documents, nothing difficult to understand.

Now let's look at the third Push, from View- > animation- > Push can start this Activity

Push This Demo mainly shows the switching effect between View.

The Java file corresponding to Push is Animation2.java in view package, and the corresponding XML layout file is layout/animation_2. xml.

Look at the layout file first. The most important thing used in this page is an ViewFlipper. Using ViewFlipper, you can realize dynamic switching between multiple View, and you can customize switching animation. What this example shows is how to define switching animation.

Only the key sentences will be selected below.

Let ViewFlipper start automatic switching.

mFlipper.startFlipping(); 

Change the entry and exit animation effect when clicking the options in Spinner.

public void onItemSelected(AdapterView parent, View v, int position, long id) { 
    switch (position) { 
    case 0: 
      mFlipper.setInAnimation(AnimationUtils.loadAnimation(this, 
          R.anim.push_up_in)); 
      mFlipper.setOutAnimation(AnimationUtils.loadAnimation(this, 
          R.anim.push_up_out)); 
      break; 
    case 1: 
      mFlipper.setInAnimation(AnimationUtils.loadAnimation(this, 
          R.anim.push_left_in)); 
      mFlipper.setOutAnimation(AnimationUtils.loadAnimation(this, 
          R.anim.push_left_out)); 
      break; 
    case 2: 
      mFlipper.setInAnimation(AnimationUtils.loadAnimation(this.R.anim.fade_in)); 
      mFlipper.setOutAnimation(AnimationUtils.loadAnimation(this, 
          android.R.anim.fade_out)); 
      break; 
    default: 
      mFlipper.setInAnimation(AnimationUtils.loadAnimation(this, 
          R.anim.hyperspace_in)); 
      mFlipper.setOutAnimation(AnimationUtils.loadAnimation(this, 
          R.anim.hyperspace_out)); 
      break; 
    } 
  } 

Animation here is a custom animation effect, and the corresponding XML file can be found in res/anim. The following uses push_up_in. xml to explain the general usage of the definition.

Because this animation is composed of several animations, the periphery is enclosed by an set tag to form an AnimationSet.

The change of position is mainly defined in the translate tag. fromYDelta= "100% p", which means that it starts from just below ViewFlipper, just one distance from the height of View, and 100% p is a relative value, with greater than 0 being below and less than 0 being above. toYDelta= "0" means to stop just at the original location of the layout file. android: duration= "300", which means that the whole action takes 300 milliseconds, and the system will automatically adjust the speed according to this time.

The alpha label defines transparency, 0 is full transparency, 1.0 is opaque, and the process is 300 milliseconds, so that View is a gradual process

<set xmlns:android="http://schemas.android.com/apk/res/android"> 
  <translate android:fromYDelta="100%p" android:toYDelta="0" android:duration="300"/> 
  <alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="300" /> 
</set> 

push_up_out. xml, and push_left are almost identical and should be well understood.

hyperspace_in. xml is simpler, with only one alpha, so there is no set tag on the outer layer. startOffset is set delay.

hyperspace_out. xml is relatively complex for 1 point, and set is also included in set, but it is still composed of several small moves, which can be understood by splitting them one point at a time.

The outermost layer is an set, in which an scale and an set are nested.

The first scale tag can be understood as taking the middle position of the current View as the axis point, and changing the transverse length and height of View to 1.4 times and 0.6 times in 700 milliseconds in an accelerated amplification manner. As for the label fillAfter, I can't understand this function. According to the explanation in SDK, View is kept in the last frame of animation in continuous animation, but according to my experiment, it seems that there is no effect. Please ask the master for advice. (Check some information on the Internet means that it must be set in the code. Is this Bug belonging to Android?) One animationSet can be used as a subset of another animationSet, which is easy to understand. rotate label according to the literal meaning should be easy to understand, not to repeat.

<set xmlns:android="http://schemas.android.com/apk/res/android" android:shareInterpolator="false"> 
  <scale  
    android:interpolator="@android:anim/accelerate_decelerate_interpolator" 
    android:fromXScale="1.0"  
    android:toXScale="1.4"  
    android:fromYScale="1.0"  
    android:toYScale="0.6"  
    android:pivotX="50%" 
    android:pivotY="50%" 
    android:fillAfter="false" 
    android:duration="700" /> 
  <set  
    android:interpolator="@android:anim/accelerate_interpolator" 
        android:startOffset="700"> 
     
    <scale 
      android:fromXScale="1.4"  
      android:toXScale="0.0" 
        android:fromYScale="0.6" 
      android:toYScale="0.0"  
      android:pivotX="50%"  
      android:pivotY="50%"  
      android:duration="400" /> 
     
    <rotate  
      android:fromDegrees="0"  
      android:toDegrees="-45" 
      android:toYScale="0.0"  
      android:pivotX="50%"  
      android:pivotY="50%" 
      android:duration="400" /> 
  </set> 
</set> 

Many animations are actually composed of basic actions such as alpha, scale, rotate and translate. These belong to Tween Animation. In addition, there is a kind of Frame Animation, which is similar to the effect of playing movies. Animation is played frame by frame, and we will talk about it later.

All properties set in XML can be found in JAVA corresponding to API function, Android SDK documentation can be found.

In fact, I think I am a little wordy in writing this way. The name definition of API of Android is very standard, and the function of this function can be judged from the name.

3D Transition is primarily defined in the animation package, which contains only two Java files.

3D flipping is not very complicated, the most important thing is a function rotation. setAnimationListener (new DisplayNextView (position); In line 99 of Transition3d. The main function of this function is through an Listener, set animation before, after, and repeated action to trigger events.

The flip effect of 3D is mainly composed of two rotato actions, and the second action is started by Listener after the first action is completed. When these two Animation are connected, it looks like the rotation effect of 3D.

At the same time, in Rotate3dAnimation. java, an Animation is redefined, and initialize and applyTransformation methods are overwritten. initialize is the initialization action, and applyTransformation defines the animation effect. This is the most important part. The current time is the percentage of the total time and the action. Here, the transformation matrix is used. I found that I forgot T_T in linear algebra, and I will read it again in the future. The main Camara do not quite understand, the comments also did not write this class what use, guessing from the code is to save the current interface.

This is easy to say, but difficult to do. .