One of the Android animation series, magical interpolator quickly achieve pinball effect

Source: Internet
Author: User

Always want to write an animation series, the things I learned to sum up, but recently are looking at the source of busy. Now write an opening, and then continue to add animation related articles. As an interest, here the pinball effect as a small example, By the way, the animation animation should use Interpolator to icing on the cake.


This is a simple example, but complex things are not composed of many seemingly simple elements.

Online search already has a lot of articles about interpolator, here to borrow a great God's article as an introduction http://blog.csdn.net/jason0539/article/details/16370405

Interpolator's reference is mainly two ways, one is directly in the XML declaration, the second is to set in the code, if you feel that the system provides interpolator is not enough, you can also customize the parameters.

Pinball effect, with the implementation of the Interpolator interface Bounceinterpolator to complete. The following is a direct example:

Preparing the animation file Anim1.xml

<?xml version= "1.0" encoding= "Utf-8"? ><set xmlns:android= "Http://schemas.android.com/apk/res/android"     android:interpolator= "@android: Anim/bounce_interpolator"    >    <translate        android:duration= "Android:fromxdelta=" "        -100%p" Android:toxdelta= "        0"        />    <alpha        android:duration= " "        android:fromalpha=" 0.5 "        android:toalpha=" 1.0 "/>    <scale        android:fromxscale=" 0.5 "        android:toxscale= "1.5"        android:fromyscale= "0.5"        android:toyscale= "1.5" android:duration= "        "        />    </set>

In the above code, android:interpolator= "@android: Anim/bounce_interpolator" refers to the bounceinterpolator of the system, The effect is that it bounces when the animation ends. To make it easier to see the effect, set the time to 2000ms,

Mainactivity in main.xml layout file:

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android"    xmlns:tools= "http// Schemas.android.com/tools "    android:layout_width=" match_parent "    android:layout_height=" Match_parent " >        <imageview         android:id= "@+id/img_main"        android:layout_width= "40DP"    android:layout_ height= "40DP"        android:src= "@drawable/ic_launcher"        android:background= "#00000000"        android:layout_ Centerinparent= "true"        />        </RelativeLayout>

Finally, in Mainactivity's OnCreate () method, add the following code:

img = (ImageView) Findviewbyid (r.id.img_main);            Animation anim = animationutils.loadanimation (Mainactivity.this, r.anim.anim1);      Anim.setanimationlistener (New Animationlistener () {@Overridepublic void Onanimationstart (Animation Animation) {// Todo auto-generated method stub} @Overridepublic void Onanimationrepeat (Animation Animation) {//Todo auto-generated Method stub} @Overridepublic void Onanimationend (Animation Animation) {//TODO auto-generated method Stubimg.clearanimation (); Animation anim = animationutils.loadanimation (Mainactivity.this, r.anim.anim1);    Anim.setinterpolator (New Bounceinterpolator ());    Img.setanimation (Anim);}});          Img.setanimation (ANIM);

This is done, the code is very simple, so there is no comment, as long as the project to add code to see the effect. Because Animationlistener is set, the animation is emptied and set once again at the end of the first animation, Bounceinterpolator is also set in the code (this is the second way to set the Interolator), so the operation will see the image has two bounce effect.

The example is simple, but as long as the combination of good use, there will be wonderfully effect. Other subclasses Interpolator, you can use similar methods to debug different animations to achieve better results.

One of the Android animation series, magical interpolator quickly achieve pinball effect

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.