An analysis of Android animation

Source: Internet
Author: User

Objective

In the development of the application, animation is an essential part, otherwise many visual effects will appear particularly abrupt. Today we'll look at the animation library in Android.

Classification of animationsThe Android platform provides us with two types of animations, Tween (motion tween) animations and frame (frame) animations. Tween animations are animated by constantly performing image transformations (panning, zooming, rotating, etc.) on the objects in the scene; frame animation is the sequential playback of each frame of the image in advance, similar to a quick slide. Motion Tweenstween animation is by pre-defining an animation , this animation specifies the type of graphic transformation (rotation, panning, zooming, and so on), start time, duration, and start value, which are modified along the timeline when the view is drawn, to animate the effect. Animations can be defined by code, or by XML. If the animation is defined in XML, then use animationutils.loadanimation ( context , r.anim.your_anim); to load. Alpha: Transparency AnimationThe animation is to modify the transparency of the view over a specified period of time, from 0.3 to 1.0f transparency animation examples are as follows: Code Definition animations:
  Alphaanimation alphaanimation = new Alphaanimation (0.3f, 1.0f);        Alphaanimation.setduration (1000);
XML definition animations:
<?xml version= "1.0" encoding= "Utf-8"?>      <!--transparency--      <alpha  xmlns:android= "/http Schemas.android.com/apk/res/android "        android:fromalpha=" 1 "          android:toalpha=" 0 "           android:duration=" "          />  
Then perform the animation by setting the Setanimation or startanimation of the view.
scale: Zoom animationfor the zoom animation of the view, you need to specify the respective scaling values on the x and Y axes. The example is to scale the view to half the size of the original in one second, and the center point of the Zoom is the center of the view. Code Definition animations:
        Scaleanimation scaleanimation = new Scaleanimation (1.0f, 0.5f, 1.0f, 0.5f,0.5f, 0.5f);        Scaleanimation.setduration (1000);
XML definition animations:
<?xml version= "1.0" encoding= "Utf-8"?>       <!--Zoom--      <scale  xmlns:android= "/http Schemas.android.com/apk/res/android "        android:fromxscale=" 1 "           android:fromyscale=" 1 "           android: toxscale= "0.5"           android:toyscale= "0.5"           android:pivotx= "0.5"          android:pivoty= "0.5"          android: Duration= "3000"           

Translate: Displacement animationDisplacement animation is an animation that moves a view from one point to a point. For example, move the view from the (0,0) position to the (100, 100) position in one second. Code Definition:
        Translateanimation translateanimation = new Translateanimation (0, 0, +);        Translateanimation.setduration (1000);

XML definition animations:
<?xml version= "1.0" encoding= "Utf-8"?> <!--Move--      <translate   xmlns:android= "/http Schemas.android.com/apk/res/android "        android:fromxdelta=" 0 "          android:fromydelta=" 0 "          android: Toxdelta= "Android:toydelta=" "           android:duration="           />  
Rotate: Rotate animationThe rotation animation is responsible for adjusting the view angle, such as rotating the view 360 degrees from the current angle. Code Definition:
  Rotateanimation rotateanimation = new Rotateanimation (0, N);        Rotateanimation.setduration (1000);
XML definition:
<?xml version= "1.0" encoding= "Utf-8"?>      <!--rotate--      <rotate  xmlns:android= "/http Schemas.android.com/apk/res/android "        android:fromdegrees=" 0 "          android:todegrees="          android: pivotx= "50%"          android:pivoty= "50%"           android:duration= "1000"           


Frame animation

Frame animation can be imagined as a very short movie, composed of a limited number of keyframes, when the frame animation these keyframes quickly switch, so as to achieve the effect of animation.

<?xml version= "1.0" encoding= "Utf-8"? ><animation-list xmlns:android= "http://schemas.android.com/apk/res/ Android "android:oneshot=" false "> <item android:drawable=" @drawable/p1 "android:duration=" $ "/> <item android:drawable= "@drawable/p2" android:duration= "/> <item android:drawable=" @drawable/p3 "Android: duration= "/> <item android:drawable=" @drawable/p4 "android:duration=" $ "/> <item android:drawable = "@drawable/p5" android:duration= "/> <item android:drawable=" @drawable/p6 "android:duration="/> " Lt;item android:drawable= "@drawable/p7" android:duration= "/> <item android:drawable=" @drawable/p8 " android:duration= "/> <item android:drawable=" @drawable/p9 "android:duration="/> <item android: drawable= "@drawable/p10" android:duration= "/> <item android:drawable=" @drawable/p11 "android:duration=" "/></animation-list>
Using frame animations is not the same as motion tweens, as shown in the following example:

Get the animationdrawable example    animationdrawable Frameanim = (animationdrawable) getresources () by framing the resource file by frame animation. Getdrawable (R.drawable.my_frame_anim);//Set animationdrawable to MyView background myview.setbackgrounddrawable (FrameAnim);

Animated Interpolator (Interpolator)

In motion tweens, we typically define only the first and the trailing frames, and then the system automatically generates intermediate frames, and the process of generating the intermediate frames can be "interpolated." The role of the interpolator is to tell the animation how a property (such as the color gradient) changes over time, and the corresponding attribute value for each moment within the duration period. Here are a few common interpolator:


The Android system supports Acceleratedecelerateinterpolator, Accelerateinterpolator, Anticipateinterpolator, Anticipateovershootinterpolator, Bounceinterpolator, Cycleinterpolator, Decelerateinerpolator, LinearInterpolator, Overshootinterpolator a total of 9 types of interpolator (you can customize the Interpolator if the interpolator does not meet your requirements).

For example, an Alpha animation is transformed from 0.0f to 1.0f in one second, and linear interpolator animations are performed at a constant speed. However, accelerating the interpolation animation will increase with time and faster.

The interpolator obtains the interpolation factor through the Getinterpolation method, and the calculation of the interpolation factor is also done in this function. For example, a linear interpolator, whose animation is uniform motion, so that in its getinterpolation function, the interpolation factor is only time-dependent, independent of other factors. the parameters in the getinterpolation (int inpput) function are percentages of the animation's execution and can also be considered as percentages of the animation's execution time and animation period. The value is 0.0f to 1.0f, which is the start-to-end of the animation.

/** * An interpolator where the rate of change is constant * */public class Linearinterpolator implements Interpolator {
   public Linearinterpolator () {    } public        Linearinterpolator (context context, AttributeSet attrs) {    } Public        float getinterpolation (float input) {        return input;    }}
Look at the accelerated interpolator, which means that the speed of the animation becomes faster and quicker over time. Let's see it.getinterpolation Implementation:

    public float getinterpolation (float input) {        if (mfactor = = 1.0f) {            return input * input;        } else {            return (float) Math.pow (input, mdoublefactor);        }    }
By default, Mfactor will be 1.0f, and as the animation executes, input slowly increases,The size of the numeric values returned by the Getinterpolation function will change in a larger range, causing the animation to become faster.

customizing animations using matrix matrices

When customizing animations, we mostly overwrite applytransformation(float interpolatedtime, Transformation T) method, in which the method is called when the animation is executed to implement the animation operation, where we need to implement the modified alpha, Zoom, pan, and other animations. Interpolatedtime is a factor calculated by the interpolator, calculated from the execution percent of the animation and the interpolation strategy, with a value of 0.0f to 1.0f. The parameter T is a wrapper class for matrix transformations. Here we discuss only custom animations that are implemented using matrices. For example, we need to customize an animation that enables the rotation of the y-axis in a system lower than the API 11 version, and the Rorateanimation animation in Android only supports rotational animation on the z-axis, which is what we can do with matrices. For information on matrices, please step in, Android Image transform matrix principle, code validation and application (i),Android matrix theory and application ,Android--matrix image Transformation Processing .


/** * @author mrsimple */public class Rotateyanimation extends Animation {private int halfwidth;    private int halfheight;    3D rotation camera using camera Mcamera = new camera ();    protected float Mrotatey = 0.0f; /** * Width,height is the width and height of the view that performs the animation.            The following two parameters are the width, height,/@Override public void Initialize (int width, int height, int parentwidth) of the parent of the view performing the animation.        int parentheight) {super.initialize (width, height, parentwidth, parentheight);        Setduration (2000);        Setfillafter (TRUE);        Halfwidth = WIDTH/2;        Halfheight = HEIGHT/2;    Setinterpolator (New Linearinterpolator ());    }//Set rotation angle public void Setrotatey (float roratey) {mrotatey = Roratey; } @Override protected void applytransformation (float interpolatedtime, transformation t) {final Matrix Matri        x = T.getmatrix ();        Mcamera.save ();        Use camera to set the rotation angle Mcamera.rotatey (Mrotatey * interpolatedtime); Apply a rotation transformationTo Matrix on Mcamera.getmatrix (matrix);                Mcamera.restore ();        Before the transformation, move the center point of the animation from the default (0,0) (0,-halfheight) matrix.pretranslate (0,-halfheight);        The transformation then moves from (-halfwidth,-halfheight) to Halfwidth,halfheight again (0,0) matrix.posttranslate (0, halfheight);    View view; }}

Using code:

               Button btn = New button (mainactivity.this);                Btn.settext ("Rotatey");                myanimation animation = new Myanimation ();                Animation.setrotatey (45f);                Animation.setduration (2000);  //Start animation                btn.startanimation (animation);  
The effect (the view in is not a button, is the view in my other example):



An analysis of Android animation

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.