Objective:
The previous two shows the Android tween Animation (tweened animation) Android animation effect Tween Animation (motion tween), frame Animation (frame-by-frames animation) frame of the Android animation effect Animation (per-frame animation) (b), in fact, the basic purpose of summing up the first two is to learn today's protagonist Property Animation (attribute animation). In fact, in the early days of Android only provided the first two animations, in Android 3.0 to introduce the property animation, why Google to introduce property animation it? Today we will summarize and study.
Property Animation generated Background:
Since tween Animation (motion tween) can only achieve simple four animations (alpha, scale, rotate, translate), it is difficult to meet the requirements for more complex animations, and the motion tween only changes the location of the View object drawing. Instead of changing the view object itself, such as the view shape of the transformation, such as the size of the zoom, transparency, change in position, in fact, it has not changed, for example, like the Sun Wukong soul out of the body, although already heaven, in fact, the flesh still there motionless, We often meet in the development process is translate after the incident is still in situ. If you want to achieve both animation effect and make the view itself really change, it is necessary to use property animation, which is the reason for the introduction of property animation. It can be more flexible to achieve a variety of effects, not limited to similar to the implementation of the motion tween what kind of effect.
Property Animation related Classes
Property animation, which can be animated by modifying the property values of an object by literal comprehension.
Class name |
Use |
Valueanimator |
Property animation The main timer, also calculates the value of the animated property after the animation of the execution class |
Objectanimator |
A subclass of Valueanimator that allows you to animate the properties of a target object and an object, and animate the execution class |
Animatorset |
Provides a structure for organizing animations so that they can be associated to run, to control the execution of a set of animations |
Animatorinflater |
XML file for user-loaded property animations |
Evaluators |
Property Animation calculator that tells the property animation system how to calculate the value of a given property |
Interpolators |
Animation Insert, defining the rate of change in animation |
The relationships between the above several important classes are as follows:
Learn the summary today with the simplest and easiest to understand objectanimator.
Objectanimator:
A subclass of Valueanimator that allows you to animate the properties of a target object and an object. When this class calculates a new value for the good one animation, its properties are updated accordingly. Most of the time you'll want to use objectanimator because it makes it easier to manipulate the animation value to the target object.
1.) To achieve a view transparency gradient effect as an example to illustrate
XML Implementation Method:
It's important to note that the property animation file holds the directory as Res/animator
<?XML version= "1.0" encoding= "Utf-8"?><Objectanimatorxmlns:android= "Http://schemas.android.com/apk/res/android"android:duration= "$"Android:propertyname= "Alpha"Android:repeatcount= "1"Android:repeatmode= "Reverse"Android:startoffset= "$"Android:valuefrom= "0.0"Android:valueto= "1.0"Android:valuetype= "Floattype" />
Duration indicates when the animation was executed
PropertyName indicates which property value of the modified object, here is the transparency
Valuefrom indicates which state value starts the animation
Valueto indicates which state value ends the animation
ValueType type valuation, primarily used to set the value of an animation Action property
Repeatmode represents a repeating pattern reverse
RepeatCount Animation repeats the count, the animation will execute the value + 1 times
Repeatmode animation repeats the pattern, reverse is reversed, and when the first even executes, the animation will be in the opposite direction. Restart for re-execution, direction unchanged
Startoffset, the interval of time that the animation executes more than once, which pauses the time before execution, in milliseconds
Interpolator Specifying an animation insert
The XML property above shows that it is basically consistent with the tweened animation and then loads the animation in the XML via Animatorinflater
Animator anim = animatorinflater.loadanimator (this, R.animator.animator_alpha); Anim.settarget ( ImageView); Anim.start ();
Of course, it can be implemented in plain Java code.
Objectanimator alphaanimation = objectanimator.offloat (ImageView, "alpha", 0f, 1f); Alphaanimation.setduration (+); Alphaanimation.setrepeatcount (0); Alphaanimation.setrepeatmode (valueanimator.reverse); Alphaanimation.setstartdelay ($); Alphaanimation.setinterpolator (new acceleratedecelerateinterpolator ()); Alphaanimation.start ();
For Java code implementations, Objectanimator provides the following methods: Offloat (), Ofint (), Ofobject (), Ofargb (), Ofpropertyvaluesholder () These are the elements that animate, the properties of the action, the start of an animation, the end, and any attribute values in the middle.
Other examples:
To scale an animation:
Xml:
< objectanimator xmlns:android = "http://schemas.android.com/apk/res/android" android:duration = " Android: PropertyName = "ScaleX" Android: RepeatCount = "1" Android:repeatmode = "reverse" Android:valuefrom Span style= "color: #0000ff;" >= "1.0" Android:valueto = "1.5" Span style= "color: #ff0000;" > Android:valuetype = "Floattype" />
Java code:
Objectanimator scalexanimator = objectanimator.offloat (ImageView, "ScaleX", 1f, 1.5f); Scalexanimator.setduration (+); Scalexanimator.setrepeatcount (1); Scalexanimator.setrepeatmode (valueanimator.reverse); Scalexanimator.start ();
Rotate Animation:
Xml:
<?XML version= "1.0" encoding= "Utf-8"?><Objectanimatorxmlns:android= "Http://schemas.android.com/apk/res/android"android:duration= "$"Android:interpolator= "@android: Anim/accelerate_decelerate_interpolator"Android:propertyname= "Rotation"Android:repeatcount= "1"Android:repeatmode= "Reverse"Android:valuefrom= "0"Android:valueto= " the"Android:valuetype= "Floattype" />
Java code:
Objectanimator objectanimator = objectanimator.offloat (ImageView, "Rotation", 0f, 360f); Objectanimator.setduration (+); Objectanimator.setrepeatcount (1); Objectanimator.setrepeatmode (valueanimator.reverse); Objectanimator.start ();
Panning Animations:
Xml:
<?XML version= "1.0" encoding= "Utf-8"?><Objectanimatorxmlns:android= "Http://schemas.android.com/apk/res/android"android:duration= "$"Android:propertyname= "Translationx"Android:repeatcount= "1"Android:repeatmode= "Reverse"Android:valuefrom= "0"Android:valueto= "+"Android:valuetype= "Floattype" />
Java code:
Objectanimator objectanimator = objectanimator.offloat (ImageView, "Translationx", 0f, 100f); Objectanimator.setduration (+); Objectanimator.setrepeatcount (1); Objectanimator.setrepeatmode (valueanimator.reverse); Objectanimator.start ();
2.) How to implement a combined animation
For example, we scale a control at a height of two dimensions
Mode one: Use
AnimatorSet
<?XML version= "1.0" encoding= "Utf-8"?><Setxmlns:android= "Http://schemas.android.com/apk/res/android"android:ordering= "Together"> <Objectanimatorandroid:duration= "$"Android:propertyname= "ScaleX"Android:repeatcount= "1"Android:repeatmode= "Reverse"Android:valuefrom= "1.0"Android:valueto= "1.5"Android:valuetype= "Floattype" /> <Objectanimatorandroid:duration= "$"Android:propertyname= "ScaleY"Android:repeatcount= "1"Android:repeatmode= "Reverse"Android:valuefrom= "1.0"Android:valueto= "1.5"Android:valuetype= "Floattype" /></Set>
Loading XML animations
Animator anim = animatorinflater.loadanimator (this, R.animator.animator_scale); Anim.settarget (ImageView); Anim.start ();
Pure Java Code Implementation:
animatorset animatorset = Animatorset ( ); Objectanimator scalexanimator = objectanimator.offloat (ImageView, "ScaleX", 1f, 1.5f ); Scalexanimator.setduration ( 500); Scalexanimator.setrepeatcount ( 1); Scalexanimator.setrepeatmode (Valueanimator.reverse); Scalexanimator.start (); Objectanimator scaleyanimator = objectanimator.offloat (ImageView, "ScaleY", 1f, 1.5f ); Scaleyanimator.setduration ( 500); Scaleyanimator.setrepeatcount ( 1); Scaleyanimator.setrepeatmode (Valueanimator.reverse); Animatorset.playtogether (Scalexanimator, scaleyanimator); Animatorset.start ();
上述代码通过
The Playtogether function implements two animations at the same time, and if you do not want to execute simultaneously, you can call the play function to return to the Animatorset.builder instance, Animatorset.builder provides several functions to implement the animation combination:
- After (Animator anim) inserts an existing animation into the incoming animation after it executes
- After (long delay) The existing animation is delayed by a specified millisecond after execution
- Before (Animator Anim) executes an existing animation before inserting it into an incoming animation
- With (Animator Anim) performs both existing and incoming animations
You can also call the Playsequentially function to implement the distribution execution animation.
Mode two: Use
PropertyValuesHolder
Propertyvaluesholder Scalexvaluesholder = propertyvaluesholder.offloat ("ScaleX", 1.0f, 1.5f= Propertyvaluesholder.offloat ("ScaleY", 1.0f, 1.5f= Objectanimator.ofpropertyvaluesholder (ImageView, Scalexvaluesholder, Scaleyvaluesholder); Objectanimator.setduration (+); Objectanimator.setrepeatcount (1); Objectanimator.setrepeatmode (valueanimator.reverse); Objectanimator.start ();
In this way can only achieve simultaneous execution of the animation composition is not so rich compared to Animatorset, Propertyvaluesholder provides the following function methods: Ofint (), Offloat (), Ofobject (), Ofkeyframe ().
Method Three: Use
ViewPropertyAnimator
Viewpropertyanimator viewpropertyanimator=imageview.animate (); Viewpropertyanimator.scalexby (1.0f). ScaleX (1.5f). Scaleyby (1.0f). ScaleY (1.5f). Setduration (+). Start ();
Multi-attribute animation, used for view, can achieve a relatively single animation, can only achieve such as zoom, transparency, translation, rotation, etc., the specific function name:平移 translationX,translationY, X,Y,缩放 scaleX,scaleY, 旋转 rotationX, rotationY,
透明度 alpha
3.) Set the animation listener
Sometimes we may want to do some other things before an animation is executed or after the end of the animation, this time with the help of an animation listener.
Objectanimator.addlistener (NewAnimator.animatorlistener () {@Override Public voidOnanimationstart (Animator animation) {//TODO Animation Before the start of the action} @Override Public voidonanimationend (Animator animation) {//TODO animation end of Action} @Override Public voidOnanimationcancel (Animator animation) {//TODO Animation canceled action} @Override Public voidonanimationrepeat (Animator animation) {//TODO Animations Repeat actions } });
If we need a simple animation to perform the changes during the process can be used Animatorupdatelistener
Objectanimator.addupdatelistener (new Valueanimator.animatorupdatelistener () { @Override publicvoid onanimationupdate (valueanimator animation) { float value = ( float ) Animation.getanimatedvalue (); // you can get the animated update values according to your needs. log.e ("Animatorupdatelistener", "The animation value is" + value); } );
Summarize:
This article mainly first to understand the property animation, and the use of property animation to achieve motion tweens. Further learning of property animations will follow.
Android animation effect of the first known property Animation (attribute animation) (three)