Search code examples
androidanimationtextcharacter

Android character by character display text animation


Anyone knows any efficient method of perform an animation that what is has to do is to display a text, character by character? Like:

T
Th
Thi
This
This i
This is
...

And so on.

Thanks!


Solution

  • This may not be the most elegant solution, but the simplest is probably a quick subclass of TextView with a Handler that updates the text every so often until the complete sequence is displayed:

    public class Typewriter extends TextView {
    
        private CharSequence mText;
        private int mIndex;
        private long mDelay = 500; //Default 500ms delay
        
        
        public Typewriter(Context context) {
            super(context);
        }
        
        public Typewriter(Context context, AttributeSet attrs) {
            super(context, attrs);
        }
        
        private Handler mHandler = new Handler();
        private Runnable characterAdder = new Runnable() {
            @Override
            public void run() {
                setText(mText.subSequence(0, mIndex++));
                if(mIndex <= mText.length()) {
                    mHandler.postDelayed(characterAdder, mDelay);
                }
            }
        };
        
        public void animateText(CharSequence text) {
            mText = text;
            mIndex = 0;
            
            setText("");
            mHandler.removeCallbacks(characterAdder);
            mHandler.postDelayed(characterAdder, mDelay);
        }
        
        public void setCharacterDelay(long millis) {
            mDelay = millis;
        }
    }
    

    You can then use this in an Activity like so:

    public class MyActivity extends Activity {
        @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            Typewriter writer = new Typewriter(this);
            setContentView(writer);
    
            //Add a character every 150ms
            writer.setCharacterDelay(150);
            writer.animateText("Sample String");
        }
    }
    

    If you want some animation effects with each letter added, perhaps look at subclassing TextSwitcher instead.