Use XML to define Tween Animation
The XML file of the animation is in the res/anim directory of the project. This file must contain a root element, you can set <alpha> <scale> <translate> <rotate> interpolation element or add all the above elements to the <set> element group. By default, therefore, all animation commands occur at the same time. To enable them to occur in sequence, you need to set a special attribute startOffset. Animation commands define what kind of conversions you want to perform. when they happen, how long should they be executed? The conversions can be continuous or at the same time. For example, if you want to move the text content from the left to the right, then rotate the text 180 degrees, or rotate the text content simultaneously during the movement, no conversion requires some special parameters (the size of the start and end sizes, the rotation angle of the start and end, and so on). You can also set some basic parameters (for example, if several conversions occur simultaneously, you can set the same Start Time for them. If the conversion is based on the sequence, the calculation Start Time plus the cycle.
Common node attributes of Tween Animation
Attribute [type] |
Function |
Remarks |
Duration [long] |
Attribute is animation duration |
Time in milliseconds |
FillAfter [boolean] |
If it is set to true, the animation will be applied after the animation ends. |
FillBefore [boolean] |
If this parameter is set to true, the animation is applied before the animation starts. |
Interpolator |
Specifies an animation insertor. |
There are some common plug-ins Accelerate_decelerate_interpolator Accelerator-slowdown animation inserter Accelerate_interpolator Acceleration-animation insertor Decelerate_interpolator Slowdown-animation inserter Other animation Effects |
RepeatCount [int] |
Number of animation repetitions |
RepeatMode [int] |
Define repeated Behaviors |
1: Start again 2: plays backward |
StartOffset [long] |
The time interval between the animation, starting from the time when the animation was stopped |
ZAdjustment [int] |
Changing the Z Order of an animation |
0: Keep Z Order unchanged 1: Keep at the top -1: Keep at the bottom layer |
Table 2 |
XML Node |
Function Description |
Alpha |
Gradient transparency animation effect |
<Alpha Android: fromAlpha = "0.1 ″ Android: toAlpha = "1.0 ″ Android: duration = "3000"/> |
FromAlpha |
Transparency when attribute is animation start |
0.0 indicates completely transparent 1.0 indicates completely opaque The above value is a float data type number between 0.0 and 1.0. Duration is the animation duration, in ms. |
ToAlpha
|
The property is the transparency when the animation ends. |
Table 3 |
Scale |
Gradient scaling 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: Required Tx = "50%" Android: Required ty = "50%" Android: fillAfter = "false" Android: startOffset = "700" Android: duration = "700 ″ Android: repeatCount = "10"/> |
FromXScale [float] fromYScale [float] |
It is the scaling size on the X and Y coordinates when the animation starts. |
0.0 indicates shrinking to none 1.0 indicates normal scaling-free A value smaller than 1.0 indicates contraction. Value greater than 1.0 indicates Amplification |
ToXScale [float] ToYScale [float] |
It is the scaling size on the X and Y coordinates when the animation ends. |
PivotX [float] Ty [float] |
It is the starting position of the animation relative to the X and Y coordinates of the object. |
Attribute value description: from 0%-100%, 50% is the midpoint position on the X or Y coordinate of the object. |
Table 4 |
Translate |
Animation Effect |
<Translate Android: fromXDelta = "30 ″ Android: toXDelta = "-80 ″ Android: fromYDelta = "30 ″ Android: toYDelta = "300 ″ Android: duration = "2000"/> |
FromXDelta ToXDelta |
It is the position on the X coordinate at the animation end and start. |
FromYDelta ToYDelta |
It is the position on the Y coordinate of the animation and the start point of the animation. |
Table 5 |
Rotate |
Animation effects of screen transfer and Rotation |
<Rotate Android: interpolator = "@ android: anim/accelerate_decelerate_interpolator" Android: fromDegrees = "0 ″ Android: toDegrees = "+ 350 ″ Android: Required Tx = "50%" Android: Required ty = "50%" Android: duration = "3000"/> |
FromDegrees |
It is the angle of the object when the animation starts. |
Description If the angle is negative, it indicates clockwise rotation. If the angle is positive, it indicates clockwise rotation. (Negative from -- to positive: clockwise rotation) (Negative from -- to negative: counter-clockwise rotation) (Positive from -- to positive: clockwise rotation) (Positive from -- to negative: clockwise rotation) |
ToDegrees |
The Rotation Angle of an object can be greater than 360 degrees when the animation ends. |
PivotX Ty |
It is the starting position of the animation relative to the X and Y coordinates of the object. |
Note: The preceding two attribute values are from 0% to 100%. 50% indicates the point position on the X or Y coordinate of the object. |
The following is a complete XML definition (provided by the SDK)Copy codeThe Code is as follows: <SPAN style = "FONT-SIZE: 18px"> <set android: Using interpolator = "false" xmlns: android = "http://schemas.android.com/apk/res/android">
<Scale
Android: interpolator = "@ android: anim/accelerate_decelerate_interpolator"
Android: fromXScale = "1.0"
Android: toXScale = "1.4"
Android: fromYScale = "1.0"
Android: toYScale = "0.6"
Android: Required Tx = "50%"
Android: Ty = "50%"
Android: fillAfter = "false"
Android: duration = "700"/>
<Set android: interpolator = "@ android: anim/decelerate_interpolator">
<Scale
Android: fromXScale = "1.4"
Android: toXScale = "0.0"
Android: fromYScale = "0.6"
Android: toYScale = "0.0"
Android: Required Tx = "50%"
Android: Ty = "50%"
Android: startOffset = "700"
Android: duration= "400"
Android: fillBefore = "false"/>
<Rotate
Android: fromDegrees = "0"
Android: toDegrees = "-45"
Android: toYScale = "0.0"
Android: Required Tx = "50%"
Android: Ty = "50%"
Android: startOffset = "700"
Android: duration = "400"/>
</Set>
</Set> </SPAN>
The following is an example of implementation:
Pic
The xml file used is as follows:
1. alphaCopy codeThe Code is as follows: <set xmlns: android = "http://schemas.android.com/apk/res/android">
<Alpha
Android: fromalphi = "1.0"
Android: toAlpha = "0.0"
Android: startOffset = "500"
Android: duration= "2000"
/>
</Set>
2. rotateCopy codeThe Code is as follows: <set xmlns: android = "http://schemas.android.com/apk/res/android">
<Rotate
Android: interpolator = "@ android: anim/accelerate_decelerate_interpolator"
Android: fromDegrees = "0"
Android: toDegrees = "360"
Android: Required Tx = "50%"
Android: Ty = "50%"
Android: duration= "2000"
/>
</Set>
3. scaleCopy codeThe Code is as follows: <set xmlns: android = "http://schemas.android.com/apk/res/android">
<Scale
Android: interpolator = "@ android: anim/accelerate_decelerate_interpolator"
Android: fromXScale = "0.0"
Android: toXScale = "1.0"
Android: fromYScale = "0.0"
Android: toYScale = "1.0"
Android: Required Tx = "50%"
Android: Ty = "50%"
Android: fillAfter = "false"
Android: duration= "2000"
/>
</Set>
4. translateCopy codeThe Code is as follows: <set xmlns: android = "http://schemas.android.com/apk/res/android">
<Translate
Android: fromXDelta = "10"
Android: toXDelta = "100"
Android: fromYDelta = "10"
Android: toYDelta = "100"
Android: duration= "2000"
/>
</Set>
The specific implementation source code is as follows:Copy codeThe Code is as follows: public class Animation_XML_Activity extends Activity {
Private Button button1;
Private Button button2;
Private Button button3;
Private Button button4;
Private ImageView imageView;
@ Override
Protected void onCreate (Bundle savedInstanceState ){
Super. onCreate (savedInstanceState );
SetContentView (R. layout. activity_animation _ xml _);
Button1 = (Button) findViewById (R. id. button_alpha );
Button2 = (Button) findViewById (R. id. button_rotate );
Button3 = (Button) findViewById (R. id. button_scale );
Button4 = (Button) findViewById (R. id. button_translate );
ImageView = (ImageView) findViewById (R. id. imageview );
Button1.setOnClickListener (new MyButton ());
Button2.setOnClickListener (new MyButton ());
Button3.setOnClickListener (new MyButton ());
Button4.setOnClickListener (new MyButton ());
}
Class MyButton implements OnClickListener {
@ Override
Public void onClick (View v ){
// TODO Auto-generated method stub
Switch (v. getId ()){
Case R. id. button_alpha:
Alpha ();
Break;
Case R. id. button_rotate:
Rotate ();
Break;
Case R. id. button_scale:
Scale ();
Break;
Case R. id. button_translate:
Translate ();
Break;
Default:
Break;
}
}
}
Public void Alpha (){
Animation animation = AnimationUtils. loadAnimation (Animation_XML_Activity.this, R. anim. alpha );
ImageView. startAnimation (animation );
}
Public void Rotate (){
Animation animation = AnimationUtils. loadAnimation (Animation_XML_Activity.this, R. anim. rotate );
ImageView. startAnimation (animation );
}
Public void Scale (){
Animation animation = AnimationUtils. loadAnimation (Animation_XML_Activity.this, R. anim. scale );
ImageView. startAnimation (animation );
}
Public void Translate (){
Animation animation = AnimationUtils. loadAnimation (Animation_XML_Activity.this, R. anim. translate );
ImageView. startAnimation (animation );
}
@ Override
Public boolean onCreateOptionsMenu (Menu menu ){
// Inflate the menu; this adds items to the action bar if it is present.
GetMenuInflater (). inflate (R. menu. activity_animation _ xml _, menu );
Return true;
}
}