Propertyanimation Property Animation in Android (I.)

Source: Internet
Author: User

In the previous article has already said the frame animation frame-by-frame Animation and the motion tween tweened animation, actually these two kinds of animation principle is very simple, all is according to the pre-fixed animation mode to play, frame animation will be a separate picture, and then to play them together, the animation effect is formed, tweened animation can be a series of animation of the view object, including fade, zoom, pan, rotate four kinds, but these are completely in accordance with our pre-set effect to execute, Cannot be changed dynamically, so, After Android3.0 introduced the attribute animation propertyanimation to meet some specific requirements, basically, the function of the property animation is far more powerful than the first two animation functions, because it can both operate on the View object, but also on the non-view object operation, so that its function is very powerful, well, Now let's introduce the property animation in detail.

The newly introduced property animation mechanism is no longer designed for view, and is not limited to moving, zooming, rotating, and fading, but is no longer just a visual animation effect. It is actually a mechanism for constantly manipulating values and assigning values to the specified properties of a specified object, which can be any property of any object. So we can still move or scale a view, but we can also animate the point object in the custom view. We just need to tell the system how long the animation is running, which type of animation to perform, and the initial and end values of the animation, OK.

Since the implementation mechanism of the property animation is achieved by assigning the target object and modifying its "properties", how does this make sense? If we move a button through the property animation, then this button is really moving, and no longer just in another position to draw, that is, the control of the real position of the movement, and the motion tween is in another place to draw an identical, the real position is in the original place.

OK, here's a code to see how to implement the property animation.

Valueanimator

Valueanimator is the most central class of the entire property animation mechanism, as we have already mentioned, the mechanism of property animation is implemented by constantly manipulating values, and the animation transitions between the initial and end values are computed by the Valueanimator class. It internally uses a mechanism of time loops to calculate the animation transitions between values and values, and we only need to provide the initial and end values to Valueanimator, and tell it how long the animation needs to run, Then Valueanimator will automatically help us with the effect of smoothing the transition from the initial value to the end value. In addition, Valueanimator is also responsible for managing animation playback times, playback modes, and setting listeners for animations, which is really a very important class.

But the usage of valueanimator is not complicated at all, let's start with the simplest function, for example, if you want to transition a value from 1 to 0, for 300 milliseconds, you can write:

Valueanimator Anim = valueanimator.offloat (1f, 0f);  Anim.setduration (+);  Anim.addupdatelistener (New Valueanimator.animatorupdatelistener () {      @Override public      Void Onanimationupdate (Valueanimator animation) {          float value = (float) animation.getanimatedvalue ();//property values for animated changes         log.d ("Zxy", "" + value);      }  );  
It 's easy to call Valueanimator's Offloat () method to build an instance of Valueanimator, and the Offloat () method allows you to pass in multiple types of float parameters. Passing in 1 and 0 here means smoothing the value from 1 to 0, then calling Valueanimator's Setduration () method to set the length of time the animation will run, and finally invoking the start () method to start the animation.

The usage is so simple, now if you run the code above, the animation will be executed. But this is just a transition from 0 to 1 of the animation, and do not see any interface effects, how can we know that the animation is really running it? This requires the content of the print listener to look at the effect:


From the print log value we can see that the valueanimator is really working, the value in 300 milliseconds from 1 smooth transition to 0, and this calculation work is done by Valueanimator to help us. In addition the Offloat () method can be passed in any number of parameters, so we can also build more complex animation logic, such as a value in 5 seconds from 0 to 5, then transition to 3, and then transition to 10, you can write:

valueanimator anim  = valueanimator.offloat (0f, 5f, 3f, 10f); Then you can start the drawing again. Of course Valueanimtor also has two common methods, namely: valueanimator.ofint (), Span style= "Font-family:consolas, ' Courier New ', Courier,mono,serif; line-height:18px ">valueanimator.ofobject (), Besides, we can also call the Setstartdelay () method to set the time for the animation to delay playback, call Setrepeatcount () and Setrepeatmode () method to set the number of times the animation loops and the mode of loop playback, including restart and reverse two, respectively, indicating the meaning of replay and reverse playback.

Objectanimator

The class that we are most exposed to is probably the same as Valueanimator,objectanimator, because Valueanimator is just a smooth animation transition to a value, but we don't seem to have much of a scene that actually uses this functionality. And Objectanimator is different, it can be directly to any object of arbitrary properties of animation operations, such as the view of the Alpha property.

However, although Objectanimator will be more commonly used, but it is actually inherited from the Valueanimator, the underlying animation implementation mechanism is based on valueanimator to complete, So Valueanimator is still the most central class in the entire property animation. Then, since it is an inheritance relationship, the methods that can be used in valueanimator can be used normally in objectanimator, and they are very similar in usage, just look at the code below:

private void Startpropertyanimone () {//Set transparency change from 1-->0.1-->1-->0.5-->1, meaning that the object undergoes a four-time gradient of transparency Objectanimator Anim = Objectanimator.offloat (Mtvtext, "Alpha", 1f,0.1f, 1f, 0.5f, 1f);//The first parameter is passed to an arbitrary object, and the second parameter is passed in to animate which property of the object. The third parameter is a mutable array that describes the initial and end values of the animation, and the gradient effect of the animation is achieved by the Valueanimator internal algorithm mechanism anim.setduration (5000); Duration Anim.addupdatelistener (new Animatorupdatelistener () {//Add an animation listener that keeps callback @overridepublic void during the execution of the animation Onanimationupdate (Valueanimator animation) {Float value = (float) animation.getanimatedvalue ();//The property value that gets animated changes log.v (" Zxy ", value+" ");//from which you can see that the transparency value changes from 1.0 to 0.1 and then to 1.0 to 0.5 to 1.0}}); Anim.start ();}
The effect is as follows:


private void Startpropertyanimtwo () {//Set rotation 360 degrees Objectanimator anim = Objectanimator.offloat (Mtvtext, "rotation", 0f, 360f); anim.setduration (Anim.start);
Then look at the rotation effect:


private void Startpropertyanimthree () {//Set offset toward x-axis and back to original position float Translationx = Mtvtext.gettranslationx ();// Gets the coordinates of the x-axis direction before the control is moved objectanimator Anim = objectanimator.offloat (Mtvtext, "Translationx", translationx,-500f, Translationx);//move 500 pixels to the right, then move to the original position anim.setduration (Anim.start);}
Post-move effects are as follows:


private void Startpropertyanimfour () {//TextView to zoom in vertically 3 times times and then restore objectanimator anim = objectanimator.offloat (Mtvtext, " ScaleY ", 1f, 3f, 1f);  Anim.setduration (the);  Anim.start ();  }
The scaling effect is as follows:



OK, here are some basic transformation animation simple through the code to explain a bit, then, this time someone has doubts? In this code: Objectanimator.offloat (Mtvtext, "Alpha", 1f,0.1f, 1f); How do you know that the previous object has the Alpha attribute? So what parameters can be passed to the second parameter? So in response to this question, the answer is that the second argument can be any value, is it doubtful? Because Objectanimator is designed for objects and not only for view objects, the second parameter is an attribute in an object that determines the performance of the animation based on the assigned property value.

So is there a value for the alpha attribute in the TextView object? No, not only does the TextView not have this attribute, even all of its parent classes do not have this attribute! It's strange that there is no alpha attribute in TextView and how does Objectanimator work? How can you achieve animation effects? In fact, objectanimator internal working mechanism is not directly to our incoming property name operation, but will go to find the property name corresponding to the get and set method, but TextView there is no Setalpha and Getalpha method ah? But TextView is inherited from view, and we find these two methods by looking at the methods in the view, and the other rotation, Translationx, and other get and set methods also have, then the answer is, Any class that inherits from view has these methods, and this property value is set to the object through the set method, so the Alpha property has the effect.



So what if we're going to use a composite animation?

The realization of the compound animation function mainly requires the help of the Animatorset class, which provides a play () method, if we pass a animator object (Valueanimator or Objectanimator) to this method An instance of Animatorset.builder will be returned, and the following four methods are included in the Animatorset.builder:

    • After (Animator anim) inserts an existing animation into the incoming animation (that is, anim) after execution
    • 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 the incoming animation (that is, anim)
    • With (Animator Anim) performs both existing and incoming animations

Well, with these four methods, we can implement a composite animation, such as we want to let the font stretch and then rotate and change the transparency, you can do this:

Composite animation private void Animatorset () {Objectanimator anim1 = objectanimator.offloat (Mtvtext, "Alpha", 1f,0.1f, 1f, 0.5f, 1f) ; Objectanimator anim2 = Objectanimator.offloat (Mtvtext, "rotation", 0f,360f); Objectanimator anim3 = Objectanimator.offloat (Mtvtext, "ScaleY", 1f, 3f, 1f);  Animatorset animset = new Animatorset ();//define a Animatorset object Animset.play (ANIM1). with (ANIM2). After (ANIM3);//ANIM3 executes first , and then synchronously perform anim1, anim2. "Note" The first ANIM3 animation executes 6s, and then Anim1 and ANIM2 also perform 6sanimset.setduration (6000); Animset.addlistener (new Animatorlisteneradapter () {//Set an animation listener to listen for the start, stop, cancel, end, etc. of the animation, we will often use the Animtorlistener adapter class to implement only the methods we need @overridepublic void Onanimationend (Animator animation) {super.onanimationend (animation);//animation start, do sthing ...} @Overridepublic void Onanimationstart (Animator animation) {Super.onanimationstart (animation);//end of animation, do sthing ...}); Animset.start ();}

The effect is as follows:




In many cases, we want to be able to hear the various events of the animation, such as when the animation starts, when it ends, and then performs some logical processing at the beginning or the end. This feature is fully achievable, and the animator class provides a AddListener () method that takes a animatorlistener, and we only need to implement this animatorlistener to listen to the various events of the animation.

As you already know, Objectanimator is inherited from Valueanimator, and Valueanimator is inherited from animator, So either Valueanimator or objectanimator can use the AddListener () method. In addition Animatorset is also inherited from the animator, so AddListener () This method is a common method.


OK, the basic use of property animation is these, set property animation is also a way to set up through XML files, which is not much to say, of course, there is a core usage, then the next time!!!







Propertyanimation Property Animation in Android (I.)

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.