Android Animation (view animation, frame animation, property animation) Detailed Introduction _android

Source: Internet
Author: User
Tags static class

0. Foreword

Android Animation is a frequently asked topic during an interview. We all know that Android animations fall into three categories: view animations, frame animations, and property animations.

Make an overview of these three animations first:

View Animation is a kind of progressive animation, through the image of the translation, scaling, rotation and transparency of various incremental transformations to complete the animation effect.

Frame animation is achieved by constantly switching pictures to achieve animation effects.

Property Animation is a constant change of object properties to achieve animation effect. This article original, reprint please indicate the source:

http://blog.csdn.net/seu_calvin/article/details/52724655

1. View Animation

1.1 System-provided four view animations (motion Tween)

View animation can be configured in the Res/anim/name.xml file, four view animation of the gradient transformation of <translate>, <scale>, <rotate>, <alpha > Four tags, animation collection can use <set> tags. The individual animation properties of XML are simpler, and the instance code is no longer attached here. Just notice how you can apply the configured XML file to start the animation:

View.startanimation (Animationutils.loadanimation (this,r.anim.myanimation));

These, of course, can also be configured in Java code, and it's simpler to write a sample code here:

Splash = (relativelayout) Findviewbyid (R.id.splash); Rotating animation Rotateanimation rotateanimation = new Rotateanimation (0,360, Animation.relative_to_self,0.5f,animation.re 
lative_to_self,0.5f); 
Rotateanimation.setduration (2000); 
Rotateanimation.setfillafter (TRUE); Zoom animation Scaleanimation scaleanimation = new Scaleanimation (0,1,0,1, Animation.relative_to_self,0.5f,animation.rel 
ative_to_self,0.5f); 
Scaleanimation.setduration (2000); 
Scaleanimation.setfillafter (TRUE); 
Gradient animation alphaanimation alphaanimation = new Alphaanimation (0.2f,1.0f); 
Alphaanimation.setduration (2000); 
Alphaanimation.setfillafter (TRUE); 
Translation animation Translateanimation translateanimation = Newtranslateanimation (0,0,100,100); 
Translateanimation.setduration (2000); 
Translateanimation.setfillafter (TRUE); 
Animation set Animationset Animationset = new Animationset (true); 
Animationset.addanimation (rotateanimation); 
Animationset.addanimation (scaleanimation); 
Animationset.addanimation (alphaanimation); AnimationseT.addanimation (translateanimation); 

 Start animation plash.startanimation (Animationset);

1.2 Custom View Animation

Custom animations are rarely used in practical applications, so here's a simple introduction.

Completing a custom animation requires inheriting the animation class and overriding its initialize () and applytransformation ().

The former is used for some initialization operations, and the latter is used for matrix transformations.

1.3 Animate all child elements of ViewGroup

The above 1.1,1.2 are animated for view, and Android also provides viewgroup settings

android:layoutanimation= "@anim/layout_anim" to animate all child elements in ViewGroup. Here's the code:

Res/anim/anim/layout_anim.xml 
<layoutanimation xmlns:android= "http://schemas.android.com/apk/res/ Android " 
android:delay= 0.1"//Animation latency is 0.1*t, this example is 100ms 
android:animationorder= "normal"//child elements in order of the animation order, There are also reverse and random 
android:animation= "@anim/layout_anim_item"/> 
 
//res/anim/anim/layout_anim_item.xml 
<?xml version= "1.0" encoding= "Utf-8"?> <set xmlns:android= 
"http://schemas.android.com/apk/res/" Android " 
 animation:duration=" 200 "//animation cycle of each child element T 
 animation:interpolator=" @android: Anim/accelerate_ Interpolator "//specifies 
that the animation:shareinterpolator=" true ">//indicates that all child elements share the interpolation 
<alpha android: Fromalpha= "0.2" Android:toalpha = "1.0"/> <translate android:fromxdelta= "Android:toxdelta" 
= "0"/>< C13/></set> 

1.4 Animation for activity switching

It is estimated that all have been used, after startactivity (), to enable the activity to switch to achieve a translation animation effect:

Overridependingtransition (r.anim.tran_in,r.anim.tran_out);

res/anim/tran_in 
<?xml version= "1.0" encoding= "Utf-8"?> <translate "xmlns:android=" http:// 
Schemas.android.com/apk/res/android " 
android:duration=" 
//represents starting from the position of screen 100%, so tran_out of course is toxdelta= "- 100%p ", other invariant 
android:fromxdelta=" 100%p " 
android:fromydelta=" 0 " 
  android:toxdelta=" 0 " 
  android: Toydelta= "0" > 
</translate> 

2. Frame animation

Also mentioned above, frame animation is a non-stop picture to achieve animation effect. Obviously easy to oom, so use frame animation to pay attention to picture size.
The use of frame animations is also simple, using the following example:

Res/drawable/myanimation.xml 
<?xml version= "1.0" encoding= "Utf-8"?> 
xmlns: Android= "http://schemas.android.com/apk/res/android" 
 animation:oneshot= "false" >//false for loop playback, True to setfillafter effects similar to view animations 
<item android:drawable = "@ drawable/drawable 1" android:duration= ">" 
<item android:drawable = "@ drawable/drawable 2" android:duration= "> 
</animation-list> 
 
Download the animation settings in the code and start the animation 
View.setbackgroundresource (r.drawable.myanimation.xml); 

3. Property Animation

The four effects of the view animation have obvious drawbacks, and the rendering effect does not actually change the properties of the view, that is, the left, top, right, and bottom values, just the result of the system being temporarily drawn. The view's click position has not changed. In response to this problem, starting with the Android3.0 attribute animation came into being.

The nature of the property animation is to animate by changing the new properties (such as panning translationx/y, scaling scalex/y, rotating rotationx/y, etc.) and refreshing the screen to achieve real-time changes in the click position. However, the property animation still does not modify the original top or bottom four values. The last thing to note is that the property animation is not just for view, it can also be used for any object.

The following describes the classes and methods associated with property animations:

3.1 Settranslationx method

This method directly changes the method of the View property, because it is sometimes not necessary to use an animation effect.

View.settranslationx (x);//3.0 after 

3.2 Valueanimator Class

Valueanimator only defines and executes the animation flow, and does not have the logic to directly manipulate the property value, you need to add the monitoring of the animated update and execute the Custom animation logic in Onanimationupdate ().
[Java] View plain copy on the code to see a piece of coding derived from my Code slice
Valueanimator animator = valueanimator.ofint (1, 100); Define animation, equivalent to 100 digits in 1 seconds 
Animator.addupdatelistener (new Animatorupdatelistener () { 
  @Override public 
  Void Onanimationupdate (Valueanimator animation) { 
    float fraction = animation.getanimatedfraction ();//Animation progress Value 0-1 
    // The integer estimator calculates the start+ (End-strat) *fraction and sets the width of the control to 
    view.getlayoutparams (). width = new Intevaluator (). Evaluate ( Fraction,start,end)//does not require a set method 
    view.requestlayout (); 
  } 
}); 
Animator.setduration (1000). Start (); 

3.3 Objectanimator Class

Objectanimator inherits from Valueanimator, which allows you to directly change the properties of the view, as described in the following example.

X-Axis Scaling Example 
objectanimator animator = objectanimator.offloat (view, "ScaleX", 2.0f); 
Animator.setduration (1000); 
Animator.setstartdelay (1000); 
Animator.start (); 

Most situations use Objectanimator, because it doesn't have to write the logic of animation updates like Valueanimator, but there's a certain limit to objectanimator It requires the target attribute to provide the specified processing method, such as providing the Get/set method, because the principle of objectanimator is to call the Set method to update the value of the property, and if we do not pass the initial value, the system will call the GET method directly to fetch the value . The valueanimator described in above 3.2 does not directly manipulate attribute values, so you can modify any property by using the current animation calculation to manipulate the object's properties without the need for a se/get method.

In response to this issue, the official recommended that we use a class to wrap the original object, to provide the Get/set method indirectly, the implementation is simple, examples are as follows:

Viewwrapper wrapper = new Viewwrapper (view); 
Objectanimator.ofint (view, "width"). Setduration (1000). Start (); 
 private static class viewwrapper{ 
  private View myview; 
 Public Viewwrapper (view view) { 
  myview = view; 
 } 
 public int getwidth () {return 
  myview.getlayoutparams (). width; 
 public int setwidth (int width) { 
 myview.getlayoutparams (). width = width; 
 Myview.requestlayout (); 
 } 
 

3.4 Viewpropertyanimation Class

Viewpropertyanimation is a class in the Nineoldandroid library, simplifying the operations of the Objectanimator class, and Nineoldandroid library is compatible with the previous Android version of 3.0. The following is an example of this.

X-Axis Scaling example, the effect is the same as 3.3 
viewpropertyanimation.animate (view). ScaleX (2.0f). Setduration (1000). 
Setinterpolator (New Overshootinterpolator ()) 

3.5 Animationset Class

An animation collection that provides a mechanism for combining multiple animations into a single combination, and sets the timing relationship of the animation, such as simultaneous playback, sequential playback, or delayed playback. The specific use of the method is relatively simple, as follows:

Objectanimator objectanimator1= objectanimator.offloat (view, "Alpha", 1.0f, 0f);  
Objectanimator objectanimator2= objectanimator.offloat (view, "Translationy", 0f, 30f);  
Objectanimator objectanimator3= objectanimator.offloat (view, "Translationx", 0f, 30f);  
Animatorset animatorset = new Animatorset ();  
Animatorset.setduration (5000);  
Animatorset.setinterpolator (New Linearinterpolator ());   
Animatorset.playtogether (ObjectAnimator1, ObjectAnimator2. ObjectAnimator3); Three animations are executed at  
the same time//12 at the same time, 3 then execute  
animatorset.play (ObjectAnimator1). with (ObjectAnimator2);  
Animatorset.play (ObjectAnimator3). After (ObjectAnimator2);  
Animatorset.start (); 

4. Interpolation Summary

The 4.1 system has been provided to our interpolation device
All kinds of interpolation are implemented Interpolator interface, the following look at the system has been provided to us directly using the interpolation.

4.2 Custom Interpolation

Interpolator implements the Interpolator interface, and the Interpolator interface inherits from Timeinterpolator, The Timeinterpolator interface defines a getinterpolation (float input) method called by the system, where the parameter input represents the animation completion progress, between 0 and 1. Our custom interpolation only needs to implement the Interpolator interface and overwrite the Getinterpolation () method to achieve the custom animation effect.

The following is a acceleratedecelerateinterpolator interpolation device with slow speed and intermediate acceleration:

public class Acceleratedecelerateinterpolator extends Baseinterpolator 
    implements Nativeinterpolatorfactory { 
  ...... 
  public float getinterpolation (float input) {return 
    (float) (Math.Cos (input + 1) * Math.PI)/2.0f) + 0.5f; 
  } 
  ...... 
} 

5. Animation Listener

In our normal development process, we often listen to the timing of animation completion to continue the business logic, then we can set the animation set Animationlistener listener to achieve. You can listen for animation start, end, Cancel, and repeat playback, respectively.

Listening for animation completion 
Animationset.setanimationlistener (new Animation.animationlistener () { 
  @Override public 
  Void Onanimationstart (Animation Animation) {} 
  @Override public 
  void Onanimationend (Animation Animation) {} 
  @ Override public 
void Onanimationrepeat (Animation Animation) {} 
@Override the public 
  void Onanimationcancel ( Animation Animation) {} 
}); 

Finally, if you want to listen for each frame of the animation callback, we can set the Animatorupdatelistener listener and rewrite its onanimationupdate () method.

The knowledge of Android animation is summarized.

Thank you for reading, I hope to help you, thank you for your support for this site!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.