S. Czop
S. Czop

Reputation: 630

How can I make an animation for a number counter in Android Studio?

I am working on a basic counter that will show a numbers ranging from 1 to 999,999. After a Button's onClick, the view should update, but I do not know how to make such an animation (see the Image).

Animation desired

I do not know anything about animations and all I could find about something similar was this:

You can use the ViewAnimator class to add animations to your counter. Its easy to use. You can extend it, add all the digit textviews in onCreate(). Implement a method increment that handles the increment operation. Just call showNext to flip to the next view.

Although what was described above seems to describe exactly what I need, I do not know how to make that as I have never coded any animations.

I have 6 TextView, one next to the other, each one displaying a single digit. The question itself is:

TextView Example

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="@dimen/activity_vertical_margin"
        android:paddingBottom="@dimen/activity_horizontal_margin"
        android:orientation="horizontal"
        android:gravity="center">

        //This is a sample, consider 5 identical TextViews
        <TextView
            android:id="@+id/digit0"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="4dp"
            android:text="@string/_0"
            android:textSize="64sp"
            android:textColor="#ffffff"
            android:background="@drawable/gradient_number"
            android:gravity="center"/>

</LinearLayout>

MainActivity Screenshot

MainActivity Screenshot

Upvotes: 6

Views: 9476

Answers (1)

Adrian Avram
Adrian Avram

Reputation: 957

private void startCountAnimation() {
    ValueAnimator animator = ValueAnimator.ofInt(0, 600); //0 is min number, 600 is max number
    animator.setDuration(5000); //Duration is in milliseconds
    animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        public void onAnimationUpdate(ValueAnimator animation) {
            textView.setText(animation.getAnimatedValue().toString());
        }
    });
    animator.start();
}

Sample code from: How to implement increasing number animation from 0 to 600 in 5 secs on TextVIew on android

Upvotes: 10

Related Questions