Rotating Text Animation

Rotating Text Animation

This is a sample activity which shows how RotateAnimation works along with draw text in a path such as a circle.

Underlying Algorithm:

Basic description of algorithm in step by step form:
1.) Create a Project AnimationSample.
2.) To display text in circular path, use this code snippet inside onDraw() method:

Path circle = new Path();

int centerX = canvas.getWidth() / 2;
int centerY = canvas.getHeight() / 2;
int r = Math.min(centerX, centerY);

circle.addCircle(centerX, centerY, r, Direction.CW);
Paint paint = new Paint();
paint.setColor(Color.GREEN);
paint.setTextSize(30);
paint.setAntiAlias(true);

canvas.drawTextOnPath(AnimatedTxt, circle, 0, 30, paint);

3.) To Animate the text in Rotation create a method like createAnim() :

private void createAnim(Canvas canvas) {
        rotateAnim = new RotateAnimation(0, 360, canvas.getWidth() / 2, canvas.getHeight() / 2);
        rotateAnim.setRepeatMode(Animation.REVERSE);
        rotateAnim.setRepeatCount(Animation.INFINITE);
        rotateAnim.setDuration(10000L);
        rotateAnim.setInterpolator(new AccelerateDecelerateInterpolator());
        startAnimation(rotateAnim);
}

4.) Run the application.

Steps to Create:

1.) Open Eclipse. Use the New Project Wizard and select Android Project Give the respective project name i.e. AnimationSample. Enter following information:
Project name: AnimationSample
Build Target: Android 2.3
Application name: AnimationSample
Package name: com.anim.AnimationSample
Create Activity: AnimationSample

On Clicking Finish AnimationSample code structure is generated with the necessary Android Packages being imported along with AnimationSample.java. AnimationSample class will look like following:

package com.anim.AnimationSample;

import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Path.Direction;
import android.os.Bundle;
import android.view.View;
import android.view.animation.AccelerateDecelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.RotateAnimation;

public class AnimationSample extends Activity {
        @Override
        public void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
                setContentView(new GraphicsView(this));
        }
        private static class GraphicsView extends View {
                private static final String AnimatedTxt =
                        "This Sample Program Shows, Aniamtion Using Path. This is very simple and easy to understand.";

                private Animation rotateAnim;

                public GraphicsView(Context context) {
                        super(context);
                }
                private void createAnim(Canvas canvas) {
                        rotateAnim = new RotateAnimation(0, 360, canvas.getWidth() / 2, canvas.getHeight() / 2);
                        rotateAnim.setRepeatMode(Animation.REVERSE);
                        rotateAnim.setRepeatCount(Animation.INFINITE);
                        rotateAnim.setDuration(10000L);
                        rotateAnim.setInterpolator(newAccelerateDecelerateInterpolator());

                        startAnimation(rotateAnim);
                }
                @Override
                protected void onDraw(Canvas canvas) {
                        super.onDraw(canvas);

                        // creates the animation the first time
                        if (rotateAnim == null) {
                                createAnim(canvas);
                        }

                        Path circle = new Path();

                        int centerX = canvas.getWidth() / 2;
                        int centerY = canvas.getHeight() / 2;
                        int r = Math.min(centerX, centerY);

                        circle.addCircle(centerX, centerY, r, Direction.CW);
                        Paint paint = new Paint();
                        paint.setColor(Color.GREEN);
                        paint.setTextSize(30);
                        paint.setAntiAlias(true);

                        canvas.drawTextOnPath(AnimatedTxt, circle, 0, 30, paint);
                }
        }
}