- Demand
An animation similar to a imageview to a card
- Solve
A combination of various animator
First Step Animation:
Animation code file 1,card_flip_left_out.xml
<?xml version= "1.0" encoding= "Utf-8"?> <set xmlns:android="Http://schemas.android.com/apk/res/android" > <!--Zoom Out first -- <objectanimatorandroid:duration="android:propertyname" =" ScaleX "android:valuefrom=" 1.0 "android:valueto=" 0.8 " /> <objectanimatorandroid:duration="android:propertyname" = "ScaleY" android:valuefrom="1.0"android:valueto="0.8" /> <!--and rotate -- <objectanimatorandroid:duration="@integer/card_flip_time_full"android: Interpolator="@android: Interpolator/accelerate_decelerate"android:propertyname=" RotationY "android:startoffset="android:valuefrom"="0 " Android:valueto=" /> " <!--transparency changes at the same time - <objectanimatorandroid:duration="@integer/card_flip_time_full"android: PropertyName="Alpha"android:startoffset="android:valuefrom" =" 1.0 "android:valueto=" 0.0 " /> </Set>
Step two animation
Animation file 2:card_flip_left_out
<?xml version= "1.0" encoding= "Utf-8"?><set xmlns:android="Http://schemas.android.com/apk/res/android" > <!--immediately set to transparent-- <objectanimatorandroid:duration="0"android:propertyname="Alpha "android:valuefrom="1.0 "android:valueto=" 0.0 " /> <!--rotate -- <objectanimatorandroid:duration="@integer/card_flip_time_full"android: Interpolator="@android: Interpolator/accelerate_decelerate"android:propertyname=" RotationY "android:valuefrom=" -90 "android:valueto=" 0 " /> <!--rotate half the time and gradually show- <objectanimatorandroid:duration="1"android:propertyname="Alpha" Android:startoffset= "@integer/card_flip_time_half"android:valuefrom="0.0" Android:valueto="1.0" /> <!--Last zoom -- <objectanimator android: Duration = "$" android:propertyname = "ScaleX" android:startoffset = "@integer/card_flip_time_full " android:valuefrom =" 0.8 " android:valueto = "1.0" /> <objectanimatorandroid:duration="android:propertyname" =" ScaleY "android:startoffset=" @integer/card_flip_time_full "android:valuefrom= "0.8" Android:valueto="1.0" /> </Set>
Here is the Java code to write, at the end of the first animation, change the diagram.
PackageCom.example.android.animationsdemo;ImportAndroid.animation.Animator;ImportAndroid.animation.AnimatorInflater;ImportAndroid.animation.AnimatorListenerAdapter;ImportAndroid.animation.AnimatorSet;Importandroid.app.Activity;ImportAndroid.os.Bundle;ImportAndroid.view.View;ImportAndroid.view.View.OnClickListener;ImportAndroid.widget.ImageView;/** * @date March 18, 2015 PM 2:28:33 * @author Zheng haibo * @Description: Flip Animation of pictures */ Public class imageflipactivity extends Activity { PrivateImageView ImageView;Private intClickcount =0;@Override protected void onCreate(Bundle savedinstancestate) {Super. OnCreate (Savedinstancestate); Setcontentview (R.layout.activity_image_flip); ImageView = (ImageView) Findviewbyid (r.id.iv_show); Imageview.setonclicklistener (NewOnclicklistener () {@Override Public void OnClick(View v) {PlayFlipAnimation2 (); } }); }Private void PlayFlipAnimation2() {clickcount++; Animatorset animatorsetout = (animatorset) animatorinflater. Loadanimator ( This, r.animator.card_flip_left_out);FinalAnimatorset Animatorsetin = (animatorset) animatorinflater. Loadanimator ( This, r.animator.card_flip_left_in); Animatorsetout.settarget (ImageView); Animatorsetin.settarget (ImageView); Animatorsetout.addlistener (NewAnimatorlisteneradapter () {@Override Public void Onanimationend(Animator animation) {//Flip 90 degrees, change image if(Clickcount%2==0) {Imageview.setimageresource (r.drawable.image1); }Else{Imageview.setimageresource (r.drawable.image2); } animatorsetin.start (); } }); Animatorsetin.addlistener (NewAnimatorlisteneradapter () {@Override Public void Onanimationend(Animator animation) {//TODO} }); Animatorsetout.start (); }}
Android Development Alliance QQ Group: 272209595
Android:3d Vertical Flip Animation-flipanimation