Basic Animation

Animation 4 options – Animated.gif – Frame by Frame animation – Tweened animation This is our focus – OpenGL ES Graphics API for more robust animation – Popular for mobile game programming – Supports 3D

Animation Pre-3.0 (Honeycomb) – View animation – anim folder within resources folder – Animation, AnimationUtils, AnimationListener, and AnimationSet are 4 of the primary classes – The View itself is animated View animation is still supported

Animation Since 3.0 (Honeycomb) – Property animation – animator folder within resources folder – ObjectAnimator and AnimatorSet are the 2 of the primary classes AnimatorInflator is used to inflate the.xml file if needed AnimatorListenerAdaptor is used to respond to end, start, repeat, and cancel if needed – A property of the View is animated One of the 4 traditional properties – scale, alpha, translate, rotate Other – text, background color, etc.

Tweened animation Components of tweened animation – Drawable image file (.png,.jpg,.gif) xml file ShapeDrawable instance – animator resource animator folder within the res folder must be created contains xml describing the animation – Java code ObjectAnimator class AnimatorSet class AnimatorListenerAdapter class (and AnimatorListener class) AnimatorInflater class

Animation examples

Tweened animation Types of tweened animation – rotate (spin) – translate (move) – alpha (fade) – scale (shrink/stretch)

Rotate animation – in xml Rotate.xml example (within res/animator folder) <objectAnimator xmlns:android=" android:propertyName="rotationY" android:duration="1000" android:valueTo="360" android:valueType="floatType" /> Loading the.xml file ObjectAnimator oa = (ObjectAnimator)AnimatorInflater.loadAnimator(this, R.animator.my_rotate_xml_filename); oa.setTarget(my_imageview); oa.start();

Rotate animation – in Java code Rotate example – animation created in Java code ObjectAnimator oa1 = ObjectAnimator.ofFloat(my_image_view, "rotationY", 0f, 360f); oa1.setDuration(1000); oa1.start();

Translate animation – in xml Translate.xml example (within res/animator folder) <objectAnimator xmlns:android=" android:propertyName="translationX" android:duration="1000" android:valueFrom="0" android:valueTo="100" android:valueType="floatType" /> Loading the.xml file ObjectAnimator oa = (ObjectAnimator)AnimatorInflater.loadAnimator(this, R.animator.my_translate_xml_filename); oa.setTarget(my_imageview); oa.start();

Translate animation – in Java code Translate example – animation created in Java code ObjectAnimator oa1 = ObjectAnimator.ofFloat(my_image_view, " translationX", 0f, 100f); oa1.setDuration(1000); oa1.start();

Alpha animation – in xml Alpha.xml example (within res/animator folder) <objectAnimator xmlns:android=" android:propertyName= "alpha" android:duration="1000" android:valueFrom=“1" android:valueTo= ".25" android:valueType="floatType" /> Loading the.xml file ObjectAnimator oa = (ObjectAnimator)AnimatorInflater.loadAnimator(this, R.animator.my_alpha_xml_filename); oa.setTarget(my_imageview); oa.start();

Alpha animation – in Java code Alpha example – animation created in Java code ObjectAnimator oa1 = ObjectAnimator.ofFloat(my_image_view, "alpha", 1f,.25f); oa1.setDuration(1000); oa1.start();

Scale animation – in xml Scale.xml example (within res/animator folder) <objectAnimator xmlns:android=" android:propertyName="scaleX" android:duration="1000" android:valueFrom="1" android:valueTo=".25" android:valueType="floatType" /> Loading the.xml file ObjectAnimator oa = (ObjectAnimator)AnimatorInflater.loadAnimator(this, R.animator.my_scale_xml_filename); oa.setTarget(my_imageview); oa.start();

Scale animation – in Java code Scale example – animation created in Java code ObjectAnimator oa1 = ObjectAnimator.ofFloat(my_image_view, "scaleX", 1f,.25f); oa1.setDuration(1000); oa1.start();

Additional functionality setRepeatCount(int) – sets the number of times an animation should be repeated 0 is the default ObjectAnimator.INFINITE will continue indefinitely setRepeatMode(int) – ObjectAnimator.REVERSE will run the animation backward after running it forward Example: if repeatMode is 3 and mode is reverse, animation will run forward twice, then in reverse twice

Combining Animations

AnimatorSet class – Combine animations or sets – Play sequentially or together

AnimatorSet – in xml AnimatorSet.xml example (within res/animator folder) <set xmlns:android=" android:ordering="together"> <objectAnimator android:propertyName="scaleX" android:duration="1000" android:valueTo=".25" android:valueType="floatType" /> <objectAnimator android:propertyName="scaleY" android:duration="1000" android:valueTo=".25" android:valueType="floatType" /> Loading the.xml file AnimatorSet as = (AnimatorSet)AnimatorInflater.loadAnimator(this, R.animator.my_set_xml_filename); as.setTarget(my_imageview); as.start();

AnimatorSet – in Java code AnimatorSet example – animation created in Java code AnimatorSet as = new AnimatorSet(); ObjectAnimator oa1 = ObjectAnimator.ofFloat(image, "scaleX", 1f,.25f); ObjectAnimator oa2 = ObjectAnimator.ofFloat(image, "scaleY", 1f,.25f); as.setDuration(1000); as.play(oa1).with(oa2); as.start(); Options – with(), before(), after() – One AnimatorSet can play other AnimatorSets (can be defined in.xml or in Java) – An AnimatorSet does not respond to repeatCount() or repeatMode()

Listening for events associated with animations

Listening with Animators AnimatorListener interface is implemented, or AnimatorListenerAdapter class is subclassed – AnimatorListener interface onAnimationCancel() onAnimationEnd() onAnimationRepeat() onAnimationStart() – AnimatorListenerAdapter provides empty implementations of the 4 methods above often used if only 1, 2, or 3 of methods above are needed

AnimatorListenerAdapter example AnimatorSet mySet = new AnimatorSet() //Load animations into the set (the adapter can also be applied to an ObjectAnimator object) mySet.addListener(new AnimatorListenerAdapter () public void onAnimationStart(Animator animation) { super.onAnimationStart(animation); //Code to execute when animation starts is put here public void onAnimationRepeat(Animator animation) { super.onAnimationRepeat(animation); //Code to execute when animation repeats is put here } });

AnimatorListener example AnimatorSet mySet = new AnimatorSet() //Load animations into the set (the adapter can also be applied to an //ObjectAnimator object) mySet.addListener(new AnimatorListener () { //Code here is similar to last slide, but all 4 methods must be implemented });