Android animation explanation-Tween animation

Source: Internet
Author: User

A Tween animation will perform a series of simple conversions on the content of the View object. In animation, there are four common classes for Tween animation, AlphaAnimation (Transparency gradient ), rotateAnimation, ScaleAnimation, TranslateAnimation, and AnimationSet ), the following describes the functions and parameters of the construction methods of common animation special effect classes.

(1) AlphaAnimation

Public AlphaAnimation (float fromAlpha, float toAlpha)


FromAlpha-transparency at the beginning, where 1 indicates completely opaque, 0 indicates completely transparent


Transparency at the end of toAlpha


SetDuration (long durationMillis) sets the animation execution time


When setFillAfter (boolean fillAfter) is set to true, the animation stops after execution. By default, the animation returns to the initial effect after execution.


SetRepeatCount (int repeatCount) sets the number of animation repetitions. The default value of repeatCount is 0, that is, once, 1, that is, twice


SetRepeatMode (int repeatMode) sets the Animation repetition mode, which has Animation. REVERSE and Animation. RESTART method. The default value is Animation. RESTART, Animation. RESTART indicates that, for example, you set the number of retries to 1. After the first Animation is executed, you can return to the Animation and then execute the second Animation. in REVERSE, for example, if your animation is not transparent -----> transparent, after the first animation is executed, it becomes opaque. Then, after the second animation is executed, the animation is never transparent to transparency, do you understand what I mean?


I will introduce several common methods, and other animations also have the above methods. Then I will introduce the setInterpolator (Interpolator) method.

(2) RotateAnimation


Public RotateAnimation (float fromDegrees, float toDegrees, int limit txtype, float limit txvalue, int limit tytype, float limit tyvalue)


FromDegrees animation start angle


ToDegrees animation end angle


Returns the X and Y coordinates of txvalue and tyvalue around the center of the rotation.


Relative txtype, relative tytype indicates the relative link type of the rotation center. Three animation types are available. absolute, animation. relative_to_self, or animation. relative_to_parent, animation. absolute coordinate type, that is, the position relative to the O point, animation. relative_to_self is relative to itself, and the point in the upper left corner of the view is the O point position, animation. the value of relative_to_parent is the O point in the upper left corner of the parent View, that is, the position of the ViewGroup in which the View is located.


(3) ScaleAnimation

Public ScaleAnimation (float fromX, float toX, float fromY, float toY, int limit txtype, float limit txvalue, int limit tytype, float limit tyvalue)


Float fromX, float toX X axis from the start size to the end size


Float fromY, float toY the size from the start to the end of the Y axis

 

PivotXValue and pivotYValue are the X and Y coordinates of the scaled center.


The relative link type of the zoomed txtype and tytype zoom center. There are three types of animations. absolute, animation. relative_to_self, or animation. relative_to_parent, animation. absolute coordinate type, that is, the position relative to the O point, animation. relative_to_self is relative to itself, and the point in the upper left corner of the view is the O point position, animation. the value of relative_to_parent is the O point in the upper left corner of the parent View, that is, the position of the ViewGroup in which the View is located.

(4) TranslateAnimation


Public TranslateAnimation (int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue)

FromXType relative type of start point on the X axis


FromXValue start point value


Relative type of end point on the X axis of toXType


ToXValue, end point value


Same as Y axis

(5) AnimationSet


This is an animation collection class. You can set multiple animations to execute together. This is simple and I will not introduce it much.


Explanation of interpolator

Interpolator defines the rate of change of an animation ). This allows the basic animation effects (alpha, scale, translate, and rotate) to accelerate, slow down, and repeat.


Interpolator defines the speed at which an animation changes, including constant speed, positive acceleration, negative acceleration, and irregular acceleration. Interpolator is a base class that encapsulates all the common methods of Interpolator. It has only one method, that is, getInterpolation (float input ), this method maps a point on the timeline to a multiplier to be applied to the transformations of an animation. Android provides several Interpolator subclasses to achieve different speed curves, as shown below:


AccelerateDecelerateInterpolator is slow at the beginning of the animation and the speed of the introduced place. It is accelerated in the middle.
AccelerateInterpolator changes slowly at the beginning of the animation, and then starts acceleration.
CycleInterpolator: specifies the number of times the animation is played cyclically, and the speed changes along the sine curve.
DecelerateInterpolator speed changes slowly at the beginning of the animation, and then starts to slow down
LinearInterpolator changes at an even rate in the animation
The above is an animation constructed by code. Of course, we can also write an animation through an XML file. I personally recommend using an XML file.
The animation is placed in anim under res. The following describes how to generate code and XML files.

AlphaAnimation code implementation


[Java] // construct a transparent Animation
Animation alphaAnimation = new AlphaAnimation (1.0f, 0.0f );
// Set the animation execution time
AlphaAnimation. setDuration (2000 );
// Set the animation repetition Mode
AlphaAnimation. setRepeatMode (Animation. REVERSE );
// Set the number of animation repetitions
AlphaAnimation. setRepeatCount (5 );
// Set the animation Change Rate
AlphaAnimation. setInterpolator (new AccelerateInterpolator ());

// Construct a transparent Animation
Animation alphaAnimation = new AlphaAnimation (1.0f, 0.0f );
// Set the animation execution time
AlphaAnimation. setDuration (2000 );
// Set the animation repetition Mode
AlphaAnimation. setRepeatMode (Animation. REVERSE );
// Set the number of animation repetitions
AlphaAnimation. setRepeatCount (5 );
// Set the animation Change Rate
AlphaAnimation. setInterpolator (new AccelerateInterpolator (); AlphaAnimation XML implementation


[Html] <? Xml version = "1.0" encoding = "UTF-8"?>
<Alpha xmlns: android = "http://schemas.android.com/apk/res/android"
Android: fromalphi = "1.0"
Android: toAlpha = "0.0"
Android: duration= "2000"
Android: repeatCount = "5"
Android: repeatMode = "reverse"
Android: interpolator = "@ android: anim/accelerate_interpolator"/>

<? Xml version = "1.0" encoding = "UTF-8"?>
<Alpha xmlns: android = "http://schemas.android.com/apk/res/android"
Android: fromalphi = "1.0"
Android: toAlpha = "0.0"
Android: duration= "2000"
Android: repeatCount = "5"
Android: repeatMode = "reverse"
Android: interpolator = "@ android: anim/accelerate_interpolator"/> you can get the animation through AnimationUtils. loadAnimation (this, R. anim. alpha ).


RotateAnimation code implementation


[Java] Animation rotateAnimation = new RotateAnimation (0,360, Animation. RELATIVE_TO_SELF, 0.5f, Animation. RELATIVE_TO_SELF, 0.5f );
RotateAnimation. setDuration (2000 );
RotateAnimation. setRepeatMode (Animation. RESTART );
RotateAnimation. setRepeatCount (5 );
RotateAnimation. setInterpolator (new LinearInterpolator ());

Animation rotateAnimation = new RotateAnimation (0,360, Animation. RELATIVE_TO_SELF, 0.5f, Animation. RELATIVE_TO_SELF, 0.5f );
RotateAnimation. setDuration (2000 );
RotateAnimation. setRepeatMode (Animation. RESTART );
RotateAnimation. setRepeatCount (5 );
RotateAnimation. setInterpolator (new LinearInterpolator (); RotateAnimation XML implementation


[Html] <? Xml version = "1.0" encoding = "UTF-8"?>
<Rotate xmlns: android = "http://schemas.android.com/apk/res/android"
Android: fromDegrees = "0"
Android: toDegrees = "360"
Android: Required Tx = "50%"
Android: Ty = "50%"
Android: duration= "2000"
Android: repeatCount = "5"
Android: repeatMode = "reverse"
Android: interpolator = "@ android: anim/linear_interpolator">
</Rotate>

<? Xml version = "1.0" encoding = "UTF-8"?>
<Rotate xmlns: android = "http://schemas.android.com/apk/res/android"
Android: fromDegrees = "0"
Android: toDegrees = "360"
Android: Required Tx = "50%"
Android: Ty = "50%"
Android: duration= "2000"
Android: repeatCount = "5"
Android: repeatMode = "reverse"
Android: interpolator = "@ android: anim/linear_interpolator">
</Rotate>
It is worth noting that android: Release Tx = "50%", android: Release ty = "50%" should be added "% ", do not add "%" to the parent container. This is important here.

 


The RotateAnimation animation can customize the circular progress bar. For example, it is defined in an XML file.

[Html] <? Xml version = "1.0" encoding = "UTF-8"?>
<Rotate xmlns: android = "http://schemas.android.com/apk/res/android"
Android: drawable = "@ drawable/loading"
Android: duration= "1000"
Android: interpolator = "@ android: anim/linear_interpolator"
Android: Required Tx = "50.0%"
Android: Ty = "50.0%"
Android: repeatCount = "infinite"/>

<? Xml version = "1.0" encoding = "UTF-8"?>
<Rotate xmlns: android = "http://schemas.android.com/apk/res/android"
Android: drawable = "@ drawable/loading"
Android: duration= "1000"
Android: interpolator = "@ android: anim/linear_interpolator"
Android: Required Tx = "50.0%"
Android: Ty = "50.0%"
Android: repeatCount = "infinite"/>

Let's implement the other two types by yourself. I believe you have read the introduction and it is not very difficult to implement the other two types. Here we will introduce the Tween animation, Which is messy, thank you for your valuable comments and suggestions! Don't talk about it. I went to dinner!

 


 

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.