Ads

Android Animation Resource - Android Studio

Abanoub Hanna February 03, 2019

Animation Resource

An animation resource can define one of two types of animations:

1.Property Animation: Creates an animation by modifying an object's property values over a set period of time with an Animator.

2.View Animation: There are two types of animations that you can do with the view animation framework:

Tween animation: Creates an animation by performing a series of transformations on a single image with an Animation

Frame animation: or creates an animation by showing a sequence of images in order with an AnimationDrawable.

Property Animation:

An animation defined in XML that modifies properties of the target object, such as background color or alpha value, over a set amount of time.

FILE LOCATION:

res/animator/filename.xml
The filename will be used as the resource ID.

COMPILED RESOURCE DATATYPE:

Resource pointer to a ValueAnimator, ObjectAnimator, or AnimatorSet.

RESOURCE REFERENCE:

In Java: R.animator.filename
In XML: @[package:]animator/filename

SYNTAX:

<set
  android:ordering=["together" | "sequentially"]>
    <objectAnimator
        android:propertyName="string"
        android:duration="int"
        android:valueFrom="float | int | color"
        android:valueTo="float | int | color"
        android:startOffset="int"
        android:repeatCount="int"
        android:repeatMode=["repeat" | "reverse"]
        android:valueType=["intType" | "floatType"]/>
    <animator
        android:duration="int"
        android:valueFrom="float | int | color"
        android:valueTo="float | int | color"
        android:startOffset="int"
        android:repeatCount="int"
        android:repeatMode=["repeat" | "reverse"]
        android:valueType=["intType" | "floatType"]/>
    <set>
        ...
    </set>
</set>

ELEMENTS:

<set>: A container that holds other animation elements (<objectAnimator>, <valueAnimator>, or other <set> elements). Represents an AnimatorSet.
You can specify nested <set> tags to further group animations together. Each <set> can define its own ordering attribute.

<objectAnimator>: Animates a specific property of an object over a specific amount of time. Represents an ObjectAnimator.

<animator>: Performs an animation over a specified amount of time. Represents a ValueAnimator.

EXAMPLE:

<set android:ordering="sequentially">
    <set>
        <objectAnimator
            android:propertyName="x"
            android:duration="500"
            android:valueTo="400"
            android:valueType="intType"/>
        <objectAnimator
            android:propertyName="y"
            android:duration="500"
            android:valueTo="300"
            android:valueType="intType"/>
    </set>
    <objectAnimator
        android:propertyName="alpha"
        android:duration="500"
        android:valueTo="1f"/>
</set>
In order to run this animation, you must inflate the XML resources in your code to an AnimatorSet object, and then set the target objects for all of the animations before starting the animation set. Calling setTarget() sets a single target object for all children of the AnimatorSet as a convenience. The following code shows how to do this:

AnimatorSet set = (AnimatorSet) AnimatorInflater.loadAnimator(myContext,R.anim.property_animator);
set.setTarget(myObject);
set.start();

View Animation:

The view animation framework supports both tween and frame by frame animations, which can both be declared in XML. The following sections describe how to use both methods.

Tween animation:

An animation defined in XML that performs transitions such as rotating, fading, moving, and stretching on a graphic.

FILE LOCATION:

res/anim/filename.xml
The filename will be used as the resource ID.

COMPILED RESOURCE DATATYPE:

Resource pointer to an Animation.

RESOURCE REFERENCE:

In Java: R.anim.filename
In XML: @[package:]anim/filename

SYNTAX:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@[package:]anim/interpolator_resource"
    android:shareInterpolator=["true" | "false"] >
    <alpha
        android:fromAlpha="float"
        android:toAlpha="float" />
    <scale
        android:fromXScale="float"
        android:toXScale="float"
        android:fromYScale="float"
        android:toYScale="float"
        android:pivotX="float"
        android:pivotY="float" />
    <translate
        android:fromXDelta="float"
        android:toXDelta="float"
        android:fromYDelta="float"
        android:toYDelta="float" />
    <rotate
        android:fromDegrees="float"
        android:toDegrees="float"
        android:pivotX="float"
        android:pivotY="float" />
    <set>
        ...
    </set>
</set>

The file must have a single root element: either an <alpha>, <scale>, <translate>, <rotate>, or <set> element that holds a group (or groups) of other animation elements (even nested  elements).

ELEMENTS:

<set>: A container that holds other animation elements (<objectAnimator>,
<valueAnimator>, or other <set>) or other  elements. Represents an AnimationSet.

<alpha>: A fade-in or fade-out animation. Represents an AlphaAnimation.

<scale>: A resizing animation. You can specify the center point of the image from which it grows outward (or inward) by specifying pivotX and pivotY. For example, if these values are 0, 0 (top-left corner), all growth will be down and to the right. Represents a ScaleAnimation.

<translate>: A vertical and/or horizontal motion. Supports the following attributes in any of the following three formats: values from -100 to 100 ending with "%", indicating a percentage relative to itself; values from -100 to 100 ending in "%p", indicating a percentage relative to its parent; a float value with no suffix, indicating an absolute value. Represents a TranslateAnimation.

<rotate>: A rotation animation. Represents a RotateAnimation.

EXAMPLE:

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="1.0"
        android:toXScale="1.4"
        android:fromYScale="1.0"
        android:toYScale="0.6"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="700" />
    <set
        android:interpolator="@android:anim/accelerate_interpolator"
        android:startOffset="700">
        <scale
            android:fromXScale="1.4"
            android:toXScale="0.0"
            android:fromYScale="0.6"
            android:toYScale="0.0"
            android:pivotX="50%"
            android:pivotY="50%"
            android:duration="400" />
        <rotate
            android:fromDegrees="0"
            android:toDegrees="-45"
            android:toYScale="0.0"
            android:pivotX="50%"
            android:pivotY="50%"
            android:duration="400" />
    </set>
</set>

This application code will apply the animation to an ImageView and start the animation:

ImageView image = (ImageView) findViewById(R.id.image);
Animation hyperspaceJump = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
image.startAnimation(hyperspaceJump);

Frame animation

An animation defined in XML that shows a sequence of images in order (like a film).

FILE LOCATION:

res/drawable/filename.xml
The filename will be used as the resource ID.

COMPILED RESOURCE DATATYPE:

Resource pointer to an AnimationDrawable.

RESOURCE REFERENCE:

In Java: R.drawable.filename
In XML: @[package:]drawable.filename

SYNTAX:

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot=["true" | "false"]
    <item
        android:drawable="@[package:]drawable/drawable_resource_name"
        android:duration="integer" />
</animation-list>

ELEMENTS:

<animation-list>: Required. This must be the root element. Contains one or more <item> elements.

<item>: A single frame of animation. Must be a child of a <animation-list> element.

EXAMPLE:

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />
</animation-list>

This application code will set the animation as the background for a View, then play the animation:

ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
rocketAnimation = (AnimationDrawable) rocketImage.getBackground();
rocketAnimation.start();
I hope this programming note helps you! Thanks for being here! See you in the next programming post. 
Tags: