1. Classification of gap animation in Android
In Android, make-up animation is divided into four categories:
- Grayscale Animation: AlphaAnimation
- Pan Animation: TranslateAnimation
- Scale Animation: ScaleAnimation
- Rotation Animation: RotateAnimation
2. Four complementary animation parent classes and their common methods
The four gap animations in Android come from the common Animation class Animation. Here we talk about the common methods of Animation.
- setFillAfter: set whether to maintain the end screen. true means to stay in the end screen after the animation, and false means to return to the start screen after the animation.
- setRepeatMode: sets the repeat mode. Animation.RESTART means to start from scratch, animation Reverse means to start upside down. The default is animation RESTART.
- setRepeatCount: sets the number of replays. The default value is 0, which means it will be played only once.
- setDuration: sets the duration of the animation. In milliseconds.
- setInterpolator: animated interpolator.
- setAnimationListener: sets the listener for animated events. Three methods of the interface AnimationListener need to be implemented.
| onAnimationStart | Triggered at the beginning of the animation |
| onAnimationEnd | Triggered at the end of the animation |
| onAnimationRepeat | Triggered on animation replay |
3. Requirements for the host view of the make-up animation
The host View of the gap animation can be any View, as long as it is derived from the View class.
4. The host view turns on and off the make-up animation
Call the startAnimation method of the host object to command the host view to start animation, and call the clearAnimation method of the host object to require the host view to clear animation.
5. Comparison of initialization methods of inter repair animation
- Initialize grayscale Animation: specify the values before and after the view transparency in the constructor. The values are 0.0 ~ 1.0. 0 means completely opaque and 1 means completely transparent.
- Initialize translation Animation: specify the coordinate values of the upper left corner of the view before and after translation in the constructor. The first parameter is the abscissa before translation, the second parameter is the abscissa after translation, the third parameter is the ordinate before translation, and the fourth parameter is the ordinate after translation.
- Initialize zoom Animation: specify the fore-and-aft zoom scale of the view's abscissa and ordinate in the constructor. A scaling value of 0.5 means that it is reduced to one-half of the original, and a value of 2 means that it is enlarged to twice the original. The first parameter is the abscissa scale before scaling, the second parameter is the abscissa scale after scaling, the third parameter is the ordinate scale before scaling, and the fourth parameter is the ordinate scale after scaling.
- Initialize rotation Animation: specify the rotation angle of the view in the constructor. The first parameter is the angle before rotation, the second parameter is the angle after rotation, the third parameter is the abscissa type of the center, the fourth parameter is the numerical proportion of the abscissa of the center, the fifth parameter is the ordinate type of the center, and the sixth parameter is the numerical proportion of the ordinate of the center. The values of coordinate types are described in the following table
| The coordinate type of the Animation class | explain |
| ABSOLUTE | Absolute position |
| RELATIVE_TO_SELF | Relative position |
| RELATIVE_TO_PARENT | Relative superior position |
6. Code examples of four kinds of gap animation
Grayscale animation example
public class MainActivity extends AppCompatActivity{
private View view;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
view = findViewById(R.id.view);
//Create a grayscale animation
AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f,0.1f);
alphaAnimation.setDuration(3000);
alphaAnimation.setFillAfter(true);
view.startAnimation(alphaAnimation);
alphaAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
AlphaAnimation alphaAnimation = new AlphaAnimation(0.1f,1.0f);
alphaAnimation.setDuration(3000);
alphaAnimation.setFillAfter(true);
view.startAnimation(alphaAnimation);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
}
}Pan animation example
public class MainActivity extends AppCompatActivity{
private View view;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
view = findViewById(R.id.view);
//Create a pan animation
TranslateAnimation translateAnimation = new TranslateAnimation(1.0f,-100,1.0f,1.0f);
translateAnimation.setDuration(3000);
translateAnimation.setFillAfter(true);
view.startAnimation(translateAnimation);
translateAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
TranslateAnimation translateAnimation = new TranslateAnimation(-100,1.0f,1.0f,1.0f);
translateAnimation.setDuration(3000);
translateAnimation.setFillAfter(true);
view.startAnimation(translateAnimation);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
}
}Scale animation example
public class MainActivity extends AppCompatActivity{
private View view;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
view = findViewById(R.id.view);
//Create a pan animation
ScaleAnimation scaleAnimation = new ScaleAnimation(1.0f,1.0f,1.0f,0.5f);
scaleAnimation.setDuration(3000);
scaleAnimation.setFillAfter(true);
view.startAnimation(scaleAnimation);
scaleAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
ScaleAnimation scaleAnimation = new ScaleAnimation(1.0f,1.0f,0.5f,1.0f);
scaleAnimation.setDuration(3000);
scaleAnimation.setFillAfter(true);
view.startAnimation(scaleAnimation);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
}
}Rotation animation example
public class MainActivity extends AppCompatActivity{
private View view;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
view = findViewById(R.id.view);
//Create a pan animation
RotateAnimation rotateAnimation = new RotateAnimation(0f,360f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
rotateAnimation.setDuration(3000);
rotateAnimation.setFillAfter(true);
view.startAnimation(rotateAnimation);
rotateAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
RotateAnimation rotateAnimation = new RotateAnimation(0f,-360f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
rotateAnimation.setDuration(3000);
rotateAnimation.setFillAfter(true);
view.startAnimation(rotateAnimation);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
}
}