Tween animation of "Android animation" (Gradient, zoom, shift, rotate)

The Android platform offers two types of animations. One is the tween animation, that is, the object in the scene constantly changing the image to produce animation effects (rotation, translation, indentation and gradient).

The second type is frame animation, that is, the sequential playback of the pre-made image, and GIF image principle similar.

Let's talk about the Tweene animations.

Main classes:

Animation Animation

Alphaanimation Gradient Transparency

Rotateanimation Screen Rotation

Scaleanimation Gradient Size scaling

Translateanimation Position Movement

Animationset Animation Set

With these classes, how do we animate them?

Take your own definition of view as an example, the view is very easy, there is only one picture on the screen. Now we're going to do a variety of tween animations for the entire view, respectively.

Alphaanimation

Implement alphaanimation through code, such as the following:

//Initialize animation alphaanimation = new Alphaanimation (0.1f, 1.0f);//Set Animation time Alphaanimation.setduration (3000); This.startanimation (alphaanimation);

The first parameter of the Alphaanimation class Fromalpha represents the transparency at the beginning of the animation, and the second parameter toalpha indicates the transparency at the end of the animation.

The setduration is used to set the duration of the animation.

Rotateanimation

Code:

Animation rotateanimation = new Rotateanimation (0f, 360f); rotateanimation.setduration (+); this.startanimation (rotateanimation);

The first parameter of the Rotateanimation class Fromdegrees represents the angle at which the animation starts, and the second parameter todegrees represents the angle at the end of the animation.

In addition, it is possible to set the scaling mode Pivotxtype, Pivotytype, scaling animation relative to the starting position of x, y coordinates pivotxvalue, pivotyvalue, etc.

Scaleanimation

Code:

//Initialize animation scaleanimation = new Scaleanimation (0.1f, 1.0f,0.1f,1.0f);//Set Animation time Scaleanimation.setduration (500 ); This.startanimation (scaleanimation);

In the Scaleanimation class

The first parameter is FROMX, and the second parameter tox: Each is a scaling dimension on the x-coordinate of the start and end of an animation.

The third parameter is fromy, and the fourth parameter toy: Each is a scaling dimension on the y-coordinate of the start and end of an animation.

In addition, it is possible to set the scaling mode Pivotxtype, Pivotytype, scaling animation relative to the starting position of x, y coordinates pivotxvalue, pivotyvalue, etc.

Translateanimation

Code:

//Initialize animation translateanimation = new Translateanimation (0.1f, 100.0f,0.1f,100.0f);// Set animation time translateanimation.setduration (+); this.startanimation (translateanimation);

Translateanimation class

The first parameter Fromxdelta, the second parameter toxdelta: Each is the start of the animation, the end of the x-coordinate.

The third parameter Fromydelta, the fourth parameter Toydelta: Each is the start of the animation, the end of the y-coordinate.

The specific description of the parameters:

Table II
XML node		Function description
Alpha		Gradient Transparency Animation effect
<alpha Android:fromalpha= "0.1″ Android:toalpha= "1.0″ Android:duration= "3000″/>
Fromalpha	property is the transparency at the beginning of the animation	0.0 is completely transparent. 1.0 means totally opaque. The above values take a number of float data types between 0.0-1.0
Toalpha	property is the transparency at the end of the animation

Table III
Scale		Gradient Dimension Stretch animation effect
<scale Android:interpolator= "@android: Anim/accelerate_decelerate_interpolator" Android:fromxscale= "0.0″ Android:toxscale= "1.4″ Android:fromyscale= "0.0″ Android:toyscale= "1.4″ android:pivotx= "50%" Android:pivoty= "50%" Android:fillafter= "false" Android:startoffset= "700" Android:duration= "700″ Android:repeatcount= "10″/>
Fromxscale[float] Fromyscale[float]	The scaling dimensions on the X and y coordinates when the animation starts		0.0 means shrink to No 1.0 indicates normal no scaling Values less than 1.0 indicate shrinkage Values greater than 1.0 indicate magnification
Toxscale [float] Toyscale[float]	When the animation ends, the scaling dimensions on the X and y coordinates
Pivotx[float] Pivoty[float]	The start position of the x and Y coordinates of the animation relative to the object		Property value Description: From 0%-100%, 50% is the midpoint position on the x or Y coordinate of the object

table four
translate		picture conversion position Move animation effect
<translate android:fromxdelta= "30″ Android:toxdelta=" -80″ Android: Fromydelta= "30″ android:toydelta=" 300″ android:duration= "2000″/>
fromxdelta Toxdelta		&NBSP;
fromydelta Toydelta			&NBSP;
	&NBSP;	&NBSP;	&NBSP;

Table V
Rotate			Picture Transfer rotation animation effect
<rotate Android:interpolator= "@android: Anim/accelerate_decelerate_interpolator" Android:fromdegrees= "0″ Android:todegrees= "+350″ android:pivotx= "50%" Android:pivoty= "50%" Android:duration= "3000″/>
Fromdegrees	The angle of the object at the beginning of the animation	Description When the angle is negative--indicates counterclockwise rotation When the angle is positive--Indicates clockwise rotation (Negative from--to positive: clockwise rotation) (Negative from--to negative: counterclockwise rotation) (Positive from--to positive: clockwise rotation) (Positive from--to negative: counterclockwise rotation)
Todegrees	property is the angle at which the object rotates at the end of the animation to be greater than 360 degrees
Pivotx Pivoty	The start of the X-and y-coordinates of the animation relative to the object	Note: The above two attribute values are taken from the 0%-100% value 50% is the midpoint position on the x or Y coordinate of the object

Each of these is a separate animation, so how do you make multiple animations work at the same time?

The answer is Animationset.

First look at the whole class name, but also thought is only used to store a set of animation, see only to find that the class is also inherited from the animation.

Here we implement an animation that will let the picture move the same time, the picture transparency gradient, look directly at the code bar.

//Initialize translate animation translateanimation = new Translateanimation (0.1f, 100.0f,0.1f,100.0f);//initialization Alpha Animation alphaanimation = new Alphaanimation (0.1f, 1.0f);//animation set Animationset set = new Animationset (true); set.addanimation (translateanimation); set.addanimation (alphaanimation);//Set animation time (action to every animation) set.setduration (1000); This.startanimation (set);

Do you think it's very easy?

Enclose the code for the entire view class.

Package Com.yfz.view;import Com.yfz.r;import Android.content.context;import android.graphics.canvas;import Android.graphics.drawable.bitmapdrawable;import Android.util.log;import Android.view.keyevent;import Android.view.view;import Android.view.animation.alphaanimation;import Android.view.animation.animation;import Android.view.animation.animationset;import Android.view.animation.rotateanimation;import Android.view.animation.scaleanimation;import Android.view.animation.translateanimation;public class TweenAnim Extends View {//alpha Animation-gradient transparency private Animation alphaanimation = null;//sacle Animation-Gradient size scaling private Animation scaleanimation = null;//translate Animation-position move private Animation translateanimation = null;//rotate Animation-screen rotation private Animation rotateanimation = Null;public Tweenanim (context context) {super (context);} @Overrideprotected void OnDraw (canvas canvas) {super.ondraw (canvas); LOG.E ("Tween", "OnDraw");//Load a picture Canvas.drawbitmap (((bitmapdrawable) getresources (). Getdrawable ( R.drawable.gallery_photo_5)). Getbitmap (), 0, 0, null);} @Overridepublic boolean onKeyDown (int keycode, keyevent event) {LOG.E ("Tween", "OnKeyDown"); return true;} @Overridepublic boolean onKeyUp (int keycode, keyevent event) {LOG.E ("Tween", "OnKeyDown"), switch (keycode) {case KEYEVENT.KEYCODE_DPAD_UP:LOG.E ("Tween", "onkeydown-keycode_dpad_up"); alphaanimation = new Alphaanimation (0.1f, 1.0f );//Set Animation time alphaanimation.setduration (+); this.startanimation (alphaanimation); Break;case Keyevent.keycode_dpad _DOWN:LOG.E ("Tween", "Onkeydown-keycode_dpad_down"); rotateanimation = new Rotateanimation (0f, 360f); Rotateanimation.setduration (+); this.startanimation (rotateanimation); Break;case keyevent.keycode_dpad_left: LOG.E ("Tween", "onkeydown-keycode_dpad_left");//Initialize scaleanimation = new Scaleanimation (0.1f, 1.0f,0.1f,1.0f);// Set animation time Scaleanimation.setduration ($); This.startanimation (scaleanimation); Break;case Keyevent.keycode_dpad_ RIGHT:LOG.E ("Tween", "onkeydown-keycode_dpad_right");//Initialize translateanimation = new TRanslateanimation (0.1f, 100.0f,0.1f,100.0f);//Set Animation time translateanimation.setduration (+); This.startanimation ( translateanimation); Break;case keyevent.keycode_dpad_center:log.e ("Tween", "onkeydown-keycode_dpad_center");// Initialize Translate animation translateanimation = new Translateanimation (0.1f, 100.0f,0.1f,100.0f);//Initialize alpha animation alphaanimation = new Alphaanimation (0.1f, 1.0f);//animation set Animationset set = new Animationset (true); Set.addanimation (translateanimation); Set.addanimation (alphaanimation);//Set animation time (action to each animation) set.setduration (); this.startanimation (set); break; Default:break;} return true;}}

When calling this class in activity, it is important to be aware of the setfocusable (true), otherwise the OnKeyUp method will not take effect if the focus is on the activity.

Code to invoke the view:

Tweenanim anim = new Tweenanim (lesson_11.this); anim.setfocusable (true); Setcontentview (Anim) ;

With Java code above, 4 different tween animations are implemented, in fact, in Android, it is completely possible to animate through an XML file. Such a way may be more concise, clear, and more conducive to reuse.

Here we are going to use XML for these kinds of animations respectively.

The first is alphaanimation.

Alpha_anim.xml:

<?xml version= "1.0" encoding= "Utf-8"? ><set xmlns:android= "Http://schemas.android.com/apk/res/android "><alphaandroid:fromalpha=" 0.1 "android:toalpha=" 1.0 "android:duration=" "/></set>"

You don't have to explain.

Rotateanimation

Rotate_anim.xml:

<?xml version= "1.0" encoding= "Utf-8"? ><set xmlns:android= "Http://schemas.android.com/apk/res/android "><rotateandroid:interpolator=" @android: Anim/accelerate_decelerate_interpolator "android:fromdegrees=" 0 " android:todegrees= "android:pivotx=" "50%" android:pivoty= " 50%" android:duration= "/></set>"

Scaleanimation

Scale_anim.xml:

<?xml version= "1.0" encoding= "Utf-8"? ><set xmlns:android= "Http://schemas.android.com/apk/res/android "><scaleandroid:interpolator=" @android: Anim/accelerate_decelerate_interpolator "android:fromxscale=" 0.0 " Android:toxscale= "1.0" android:fromyscale= "0.0" android:toyscale= "1.0" android:pivotx= "50%" android:pivoty= "50%" Android:fillafter= "false" android:duration= "/></set> "

Translateanimation

Translate_anim.xml:

<?xml version= "1.0" encoding= "Utf-8"? ><set xmlns:android= "Http://schemas.android.com/apk/res/android "><translateandroid:fromxdelta=" ten "Android:toxdelta=" Android:fromydelta= "android:toydelta=" 100 "/ ></set>

Once the layout files have been written, how do you use the files?

In fact also very easy, at this time need to use the Animationutils class. These layout files are loaded by the Loadanimation method in the class.

Such as:

rotateanimation = animationutils.loadanimation (This.getcontext (), R.anim.rotate_anim);

The code for this view class is as follows:

Package Com.yfz.view;import Com.yfz.r;import Android.content.context;import android.graphics.canvas;import Android.graphics.drawable.bitmapdrawable;import Android.util.log;import Android.view.keyevent;import Android.view.view;import Android.view.animation.alphaanimation;import Android.view.animation.animation;import Android.view.animation.animationset;import Android.view.animation.animationutils;import Android.view.animation.rotateanimation;import Android.view.animation.scaleanimation;import Android.view.animation.translateanimation;public class TweenAnim2 extends View {//alpha Animation-gradient Transparency private animation Alphaanimation = null;//sacle Animation-Gradient size zoom private Animation scaleanimation = null;//translate Animation-position move private Animation Tran Slateanimation = null;//rotate Animation-screen rotation private Animation rotateanimation = Null;public TweenAnim2 (context context) {Super (context);} @Overrideprotected void OnDraw (canvas canvas) {super.ondraw (canvas); LOG.E ("Tween", "OnDraw");//Load a picture Canvas.drawbitmap (((bitmapdrawable) getresources (). getdrawable (R.drawable.gallery_photo_5)). Getbitmap (), 0, 0, null);} @Overridepublic boolean onKeyDown (int keycode, keyevent event) {LOG.E ("Tween", "OnKeyDown"); return true;} @Overridepublic boolean onKeyUp (int keycode, keyevent event) {LOG.E ("Tween", "OnKeyDown"), switch (keycode) {case KEYEVENT.KEYCODE_DPAD_UP:LOG.E ("Tween", "onkeydown-keycode_dpad_up"); alphaanimation = Animationutils.loadanimation (This.getcontext (), R.anim.alpha_anim); This.startanimation (alphaAnimation); break; Case KEYEVENT.KEYCODE_DPAD_DOWN:LOG.E ("Tween", "Onkeydown-keycode_dpad_down"); rotateanimation = Animationutils.loadanimation (This.getcontext (), R.anim.rotate_anim); This.startanimation (rotateAnimation); break; Case KEYEVENT.KEYCODE_DPAD_LEFT:LOG.E ("Tween", "Onkeydown-keycode_dpad_left"); scaleanimation = Animationutils.loadanimation (This.getcontext (), R.anim.scale_anim); This.startanimation (scaleAnimation); break; Case KEYEVENT.KEYCODE_DPAD_RIGHT:LOG.E ("Tween", "onkeydown-keycode_dpad_right"); TranSlateanimation = Animationutils.loadanimation (This.getcontext (), R.anim.translate_anim); This.startAnimation ( translateanimation); Break;case keyevent.keycode_dpad_center:log.e ("Tween", "onkeydown-keycode_dpad_center");// Initialize Translate animation translateanimation = Animationutils.loadanimation (This.getcontext (), r.anim.translate_anim);//initialization Alpha Animation alphaanimation = Animationutils.loadanimation (This.getcontext (), r.anim.alpha_anim);//animation set Animationset set = New Animationset (TRUE); Set.addanimation (translateanimation); set.addanimation (alphaanimation);//Set animation time (action to every animation) Set.setduration (+); this.startanimation (set); break;default:break;} return true;}}

All right, so much for this time.

References: http://www.moandroid.com/?p=790