.jpeg)
you’ll learn about animations. You’ll find different examples that
use a variety of APIs to add animations to your application widgets.
Snappy transitions with TextSwitcher and
ImageSwitcherImagine you need to cycle through information in a TextView or in an ImageView.
Some examples of this would be
Navigating through a list of dates with Left and Right buttons
Changing numbers in a date picker
Countdown clock
News headlines
Changing the contents of a view is a basic function of most applications, but it
doesn’t have to be boring. If we use the default TextView, you’ll notice there’s no
eye candy when we swap its content. It’d be nice to have a way to apply different
animations to content being swapped. So to make our transitions more visually
appealing, Android provides two classes called TextSwitcher and ImageSwitcher.
TextSwitcher replaces a TextView and ImageSwitcher replaces an ImageView.
TextView and TextSwitcher work in a similar way. Suppose we’re navigating
through a list of dates, as mentioned earlier. Every time the user clicks a button, we
need to change a TextView’s content with each date. If we use a TextView, we’re swap-
ping out some text in a view using mTextView.setText("something"). Our code
should look something like the following:
private TextView mTextView;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mTextView = (TextView) findViewById(R.id.your_textview);
...
mTextView.setText(“something”);
}
As you might’ve noticed, if we change the content of a TextView, it’ll change instantly;
TextSwitcher is what we need if we want to add an animation to avoid the hard swap.
A TextSwitcher is useful to animate a label onscreen. Whenever it’s called,
TextSwitcher animates the current text out and animates the new text in. We can get
a more pleasant transition by following these easy steps:
1 Get the view using findViewById(), or construct it in your code like any normal
Android view.
2 Set a factory using switcher.setFactory().
3 Set an in-animation using switcher.setInAnimation().
4 Set an out-animation using switcher.setOutAnimation().
Here’s how TextSwitcher works: it uses the factory to create new views, and whenever
we use setText(), it first removes the old view using an animation set with the set-
OutAnimation() method, and then places the new one using the animation set by the
setInAnimation() method. So let’s see how to use it:
private TextSwitcher mTextSwitcher;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
Animation in = AnimationUtils.loadAnimation(this,
android.R.anim.fade_in);
Animation out = AnimationUtils.loadAnimation(this,
android.R.anim.fade_out);
mTextSwitcher = (TextSwitcher) findViewById(R.id.your_textview);
mTextSwitcher.setFactory(new ViewFactory() {
@Override
public View makeView() {
TextView t = new TextView(YourActivity.this);
t.setGravity(Gravity.CENTER);
return t;
}
});
mTextSwitcher.setInAnimation(in);
mTextSwitcher.setOutAnimation(out);
}
That’s it. The user gets the new text, and we get some cool animations for free. The
new transition fades out the original text while the new text fades in to replace it.
Because we used android.R.anim.fade_in in our example, the effect was a fade-in.
This technique works equally well with other effects. Providing your own animation or
using one from android.R.anim. ImageSwitcher works in the same way, except with
images instead of text.
The bottom line
The TextSwitcher and ImageSwitcher methods give you a simple way to add ani-
mated transitions. Their role is to make these transitions less dull and more vibrant.
Don’t abuse them; you don’t want your application to look like a Christmas tree!
.png)
.jpeg)
.png)
.jpeg)
