Animations
1
Fall 2012 CS2302: Programming Principles
Animation Category
Tweened Animations
1.
–
–
–
–
2.
2
Scale animations
Rotate animations
Alpha animations
Translate animations
Frame-by-Frame Animations
Fall 2012 CS2302: Programming Principles
Procedure to create Tweened Animations
Create an object of AnimationSet
Create an object of Animation
1.
2.
3.
4.
5.
3
–
TranslateAnimation(int fromXType, float fromXValue, int toXType,
float toXValue, int fromYType, float fromYValue, int toYType, float
toYValue)
–
AlphaAnimation(float fromAlpha, float toAlpha)
–
ScaleAnimation(float fromX, float toX, float fromY, float toY, int
pivotXType, float pivotXValue, int pivotYType, float pivotYValue)
–
RotateAnimation(float fromDegrees, float toDegrees, int pivotXType,
float pivotXValue, int pivotYType, float pivotYValue)
Setting parameters for the object of Animation
Add the object of Animation to the object of AnimationSet
startAnimation(animationSet);
Fall 2012 CS2302: Programming Principles
Attributes of Animations
ANIMSTIO
N YPE
ATTRIBUTES
VALID VALUES
Alpha
fromAlpha / toAlpha
float from 0 to 1
Scale
fromXScale / toXScale
float from 0 to 1
fromYScale / toYScale
float from 0 to 1
pivotX / pivotY
String of the percentage of graphic
width/height from 0% to 100%
fromX / toX
float from 0 to 1
fromY / toY
float from 0 to 1
fromDegrees / toDegrees
float from 0 to 360
pivotX / pivotY
String of the percentage of graphic
width/height from 0% to 100%
Translate
Rotate
4
Fall 2012 CS2302: Programming Principles
Common Methods of Tweened Animations

setDuration(long durationMills)
–

setFillAfter(boolean fillAfter)
–

Set the delay in milliseconds before the animation runs.
setRepeatCount(int repeatCount)
–
5
If fillBefore is set to true, then the animation transformation is
applied before the animation has started.
setStartOffSet(long startOffset)
–

If fillAfter is set to true, then the animation transformation is
applied after the animation is over.
setFillBefore(boolean fillBefore)
–

set the amount of time (in milliseconds) for the animation to run
Defines how many times the animation should repeat.
Fall 2012 CS2302: Programming Principles
Create Tweened Animations by editing xml file


Create a folder called anim under res folder
Create new xml files in the anim folder. Add a set tag in the xml
files:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_interpolator">
</set>



6
Add rotate, alpha, scale, or translate tag in the set
tag.
Use AnimationUtils.loadAnimation to load the xml file,
and then create an object of Animation
startAnimation
Fall 2012 CS2302: Programming Principles
Alpha Animation’s xml file
<set
xmlns:android="http://schemas.android.com/apk/res/an
droid"
android:interpolator="@android:anim/accelerate
_interpolator">
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.0"
android:startOffset="500"
android:duration="500" />
</set>
7
Fall 2012 CS2302: Programming Principles
Rotate Animation’s xml file
<set
xmlns:android="http://schemas.android.com/apk/res/an
droid"
android:interpolator="@android:anim/accelerate
_interpolator">
<rotate android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="5000" />
</set>
8
Fall 2012 CS2302: Programming Principles
Translate Animation’s xml file
<set
xmlns:android="http://schemas.android.com/apk/res/an
droid"
android:interpolator="@android:anim/accelerate
_interpolator">
<translate
android:fromXDelta="50%"
android:toXDelta="100%"
android:fromYDelta="0%"
android:toYDelta="100%"
android:duration="2000" />
</set>
9
Fall 2012 CS2302: Programming Principles
Scale Animation’s xml file
<set
xmlns:android="http://schemas.android.com/apk/res/an
droid"
android:interpolator="@android:anim/accelerate
_interpolator">
<scale android:fromXScale="1.0"
android:toXScale="0.0"
android:fromYScale="1.0"
android:toYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="2000" />
</set>
10
Fall 2012 CS2302: Programming Principles
Load xml file

In the MainActivity.java file
–
–
11
Animation animation = (Animation)
AnimationUtils.loadAnimation(MainActivit
y.this, R.anim.translate);
imageView.startAnimation(animation);
Fall 2012 CS2302: Programming Principles
Frame-By-Frame Animations
 Create a xml file under res/drawable
<animation-list
xmlns:android="http://schemas.android.com/apk/res/an
droid"
android:oneshot="false">
<item android:drawable="@drawable/nv1"
android:duration="500" />
<item android:drawable="@drawable/nv2"
android:duration="500" />
<item android:drawable="@drawable/nv3"
android:duration="500" />
<item android:drawable="@drawable/nv4"
android:duration="500" />
</animation-list>
12
Fall 2012 CS2302: Programming Principles
Frame-By-Frame Animations

Load the xml file
–

13
imageView.setBackgroundResource(R.drawable.anim);
Get AnimationDrawable
–
AnimationDrawable animationDrawable =
(AnimationDrawable)imageView.getBackground();
–
Start the animation
–
animatinDrawable.start();
Fall 2012 CS2302: Programming Principles