Reference to Android Animations
http://developer.android.com/training/animation/index.html
- Displaying card flip animations
- Animation layout change
- Using ViewPager for screen slides
- Crossfading two views
- Zooming a view
Tutorial: Fade-in/Rotate/Zoom/Shake/Move guidelines
- Under resources create Animator folder. Each XML will contain a separate animation.
Fade.XML
<?xml version=”1.0″ encoding=”utf-8″?>
<alpha xmlns:android=”http://schemas.android.com/apk/res/android”
android:interpolator=”@android:anim/accelerate_interpolator”
android:fromAlpha=”0.0”
android:toAlpha=”1.0”
android:duration=”3000” >
</alpha>
Move.XML
<?xml version=”1.0″ encoding=”utf-8″?>
<set xmlns:android=”http://schemas.android.com/apk/res/android”
android:interpolator=”@android:anim/accelerate_interpolator” >
<translate xmlns:android=”http://schemas.android.com/apk/res/android”
android:fromXDelta=”-75%p”
android:toXDelta=”75%p”
android:duration=”2000″ >
</translate>
<translate xmlns:android=”http://schemas.android.com/apk/res/android”
android:startOffset=”800″
android:fromXDelta=”75%p”
android:toXDelta=”-75%p”
android:duration=”2000″ >
</translate>
</set>
Rotate.XML
<?xml version=”1.0″ encoding=”utf-8″?>
<set xmlns:android=”http://schemas.android.com/apk/res/android”>
<rotate xmlns:android=”http://schemas.android.com/apk/res/android”
android:fromDegrees=”0″
android:toDegrees=”360″
android:pivotX=”50%”
android:pivotY=”50%”
android:duration=”1000″ >
</rotate>
<rotate xmlns:android=”http://schemas.android.com/apk/res/android”
android:startOffset=”1500″
android:fromDegrees=”360″
android:toDegrees=”0″
android:pivotX=”50%”
android:pivotY=”50%”
android:duration=”1000″ >
</rotate>
</set>
Zoom.XML
<?xml version=”1.0″ encoding=”utf-8″?>
<set xmlns:android=”http://schemas.android.com/apk/res/android”>
<scale xmlns:android=”http://schemas.android.com/apk/res/android”
android:fromXScale=”0.5″
android:toXScale=”2.5″
android:fromYScale=”0.5″
android:toYScale=”2.5″
android:duration=”3000″
android:pivotX=”50%”
android:pivotY=”50%” >
</scale>
<scale xmlns:android=”http://schemas.android.com/apk/res/android”
android:startOffset=”5000″
android:fromXScale=”2.5″
android:toXScale=”0.5″
android:fromYScale=”2.5″
android:toYScale=”0.5″
android:duration=”3000″
android:pivotX=”50%”
android:pivotY=”50%” >
</scale>
</set>
Shake.XML
<?xml version=”1.0″ encoding=”utf-8″?>
<rotate xmlns:android=”http://schemas.android.com/apk/res/android”
android:duration=”100″
android:fromDegrees=”-5″
android:pivotX=”50%”
android:pivotY=”50%”
android:repeatCount=”10″
android:repeatMode=”reverse”
android:toDegrees=”5″ />
- In order to execute the animation apply it like this (i.e. fade, zoom):
Animation animationFade = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.fade); mytext.startAnimation(animationFade);
Animation animationZoom = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.zoom);
myimage.startAnimation(animation)Zoom;
- In order to have an event related to the animation (here on move) you need to set a listener. If you implement on this make sure your class implements AnimationListener :
animation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.move); animation.setAnimationListener(this);
@Override
public void onAnimationEnd(Animation an) {
// when animation ends
if (an == animation) {
Toast.makeText(getApplicationContext(),"Animation Stopped" ,Toast.LENGTH_SHORT).show();}
}
@Override
public void onAnimationRepeat(Animation an) {
// if the animation repeats
if (an == animation) {
Toast.makeText(getApplicationContext(),"Animation Repeated" ,Toast.LENGTH_SHORT).show();}
}
@Override
public void onAnimationStart(Animation an) {
// when the animation is started
if (an == animation) {
Toast.makeText(getApplicationContext(),"Animation Started"
,Toast.LENGTH_SHORT).show();}
}
itay hauptman 