Android imitates iphone list Data View Refresh animation detailed _android

Source: Internet
Author: User

Because I personally like to jump between different pages to add some fun animation, today accidentally saw an animation effect feel good, several effect chart is as follows: Since the fun is written in the blog, directly said: The effect is similar to the iphone view of the switch animation effect, today is only to introduce the effect of the above show.

Nonsense not to say, first on the effect, and then look at the code!!

Effect One:

Effect Two:

Effect Three:

Effect Four: (The effect of error):

Effect Five (Swing effect one):

Effect VI (Maneuver Effect II):

The effect is finished, just look at the implementation of the above effect of the specific code, the middle will be my own test, make mistakes are written down in the form of annotations, we use the time not to go wrong on the line! First look at the layout of the use of the file, very simple layout:

xml/html Code

<?xml version= "1.0" encoding= "Utf-8"?> <linearlayout xmlns:android= 
"http://schemas.android.com/apk/" Res/android " 
 android:layout_width=" fill_parent " 
 android:layout_height=" fill_parent " 
 android:o" rientation= "vertical" > 
 <listview 
 android:id= "@+id/firstpage" android:layout_width= "Fill_" 
 Parent " 
 android:layout_weight=" 1.0 " 
 android:layout_height=" 0dip "/> 
 <listview 
 android: Id= "@+id/secondpage" 
 android:layout_width= "fill_parent" 
 android:layout_weight= "1.0" 
 android: layout_height= "0dip" 
 android:visibility= "Gone"/> 
 <button android:id= 
 "@+id/startnext" 
 android:layout_width= "fill_parent" 
 android:layout_height= "wrap_content" 
 android:text= "@string Next " 
 
 /> 
 

xml/html Code

<strong> below to see the implementation of the above effect of the specific code, the order in the code and the above display of the effect of the picture consistent:</strong>

Java code

Package com.xiaoma.www; 
Import Android.animation.Animator; 
Import Android.animation.AnimatorListenerAdapter; 
Import Android.animation.ObjectAnimator; 
Import android.app.Activity; 
Import Android.os.Bundle; 
Import Android.view.View; 
Import Android.view.View.OnClickListener; 
Import Android.view.animation.AccelerateInterpolator; 
Import Android.view.animation.CycleInterpolator; 
Import Android.view.animation.DecelerateInterpolator; 
Import Android.view.animation.Interpolator; 
Import Android.view.animation.OvershootInterpolator; 
Import Android.widget.ArrayAdapter; 
Import Android.widget.Button; 
 
Import Android.widget.ListView; /** * @Title: Betweenanimationactivity.java * @Package com.xiaoma.www * @Description: Pony learns to imitate iphone list paging rotate refresh * @author X Iaoma/public class Betweenanimationactivity extends activity implements Onclicklistener {/** Resource statement * * Private B 
 Utton startnext = null; 
 Private ListView firstpage = null; 
 
 Private ListView secondpage = null; /** columnTable entry declaration/private static final String firstitem[] = {"Sea-wide Life", "Glorious Years", "Endless Emptiness", "Really Love You", "Years Silent", "gray trajectory", "Goodbye Ideal"}; 
 
 private static final String seconditem[] = {"Wash swish", "Love la La", "Like You", "Wahaha", "small horse Fruit", "Big Bad guy", "Cold Rainy Night"}; 
 /** List page Toggle animation interpolation declaration A/private Interpolator accelerator = new Accelerateinterpolator (); 
 
 Private Interpolator Decelerator = new Decelerateinterpolator (); 
 /** animation interpolation two: effect of five and the effect of Liudu for the following interpolation device * * Private interpolator accelerator1= new Cycleinterpolator (45f); 
 
 Private Interpolator decelerator1= new Overshootinterpolator (); /** called the activity is a. 
 * * @Override public void onCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); 
 
 Setcontentview (R.layout.main); 
  /** * This place to write, we try not to write too many operations in the OnCreate method, * If there are many configuration problems, some attribute settings must be written in the OnCreate () method, such as: Full screen, the screen must be in the Setcontentview () front, 
  * If you write too many things in the OnCreate () method, one word: too messy!! 
 * * */init (); /** * Initialization Implementation */private void init () {/** Resource Locator, add listener/Startnext = (Button) Findviewbyid (r.id.Startnext); 
 
 Startnext.setonclicklistener (this); 
 FirstPage = (ListView) Findviewbyid (r.id.firstpage); 
 
 Secondpage = (ListView) Findviewbyid (r.id.secondpage); arrayadapter<string> firstadapter = new Arrayadapter<string> (this, Android. 
 R.layout.simple_list_item_1,firstitem); arrayadapter<string> secondadapter = new Arrayadapter<string> (this, Android. 
 
 R.layout.simple_list_item_1, SecondItem); 
 Firstpage.setadapter (Firstadapter); 
 
 Secondpage.setadapter (Secondadapter); 
 @Override public void OnClick (View v) {changepage (); 
 //Implementation list page toggle private void Changepage () {final ListView visiable; 
 
 Final ListView invisiable; 
  if (firstpage.getvisibility () = = View.gone) {visiable = Secondpage; 
 invisiable = FirstPage; 
  }else{visiable = FirstPage; 
 invisiable = Secondpage; ///This place you may have seen objectanimator this class, at first I didn't know what it was, it was simple, check the official documents, the official documents in the interpretation of a pile of English, I//always said, my English rotten to death, but not afraid, as long as you want, you can certainly find out, we Just one sentence: The class is a subclass of valueanimator that can beSets the animation parameter//effect one for the target object based on the property name given//(here the effect order corresponds to effect figure one by one)//final objectanimator Invistovis = objectanimator.offloat (invisiable, 
 "RotationX", -90f, 0f); 
 
 Objectanimator Vistoinvis = objectanimator.offloat (visiable, "RotationX", 0f, 90f); 
  Effect two final objectanimator Invistovis = objectanimator.offloat (invisiable, "RotationY", -90f, 0f); 
 
 Objectanimator Vistoinvis = objectanimator.offloat (visiable, "RotationY", 0f, 90f); Effect three (this place's alpha attribute values are only one point: the larger the value, the less transparent it can be!!! 
 )//final Objectanimator Invistovis = objectanimator.offloat (invisiable, "Alpha", 0.0f, 1.0f); 
 
Objectanimator Vistoinvis = objectanimator.offloat (visiable, "Alpha", 1.0f, 0.0f); Effect four (this so I made a mistake, very naïve thought should also have RotationZ attribute name, is actually wrong, in the Offloat parameter does not have this attribute name, but everyone still//can see the list normal, in fact, the display effect is very abnormal because the background has been an error, But the application will still not stop, run as usual, but the effect is only two ListView direct//Replace, and no animation added to it, this place everyone notices: Objectanimator.offloat (invisiable, "RotationZ",- 
 
  90f, 0f); 
  Vistoinvis.setduration (500); 
  Vistoinvis.setinterpolator (accelerator); 
  Invistovis.setduration (500); InvistovIs.setinterpolator (Decelerator); 
  This place records, the following this listener pony first met, check the official document explained as follows: This monitoring to monitor the life cycle of the animation such as: Start, end, playing, follow/loop playback, here, remember: animation is not to monitor the animation, it is only responsible for the animation Vistoinvis.addlistener (New Animatorlisteneradapter () {@Override public void Onanimationend (animator Anim) {/ 
 
   * List of several animated monitors: * One: Anim.isrunning () {//todo} * Two: Anim.isstarted () {//todo} * Three: Anim.end () {//todo} * * 
   Visiable.setvisibility (View.gone); 
   Invistovis.start (); 
  Invisiable.setvisibility (view.visible); 
  } 
  }); 
 Vistoinvis.start ();
 } 
 
}

Finally, again, the title of the article is said to be a paging animation, in fact, these animations are not limited to the page above, if you put the interpolation, animation with a little flexibility, you can also make a very personalized with a lot of animation applications, coupled with the animation between the activity and above these combined words are more perfect , the activity between the animation you can refer to my previous writing this article (link below), I hope to help.

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.