Android: Animate between views

One of the strengths of the iPhone user interface is that things gel together very well. If you click into something, it'll slide or move about to give you an idea of what the app is doing.

Android can do it too, so don't let your app be thought of as an inferior product because of something like that.

To animate between views, you'll need to be using a layout on your Activity. This layout will remain on your activity as the base on which every other view will sit upon.

public class YourActivity extends Activity {
@Override public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

Animation animation;
View viewLoading = new NowLoadingView();

// Set up the view animator
m_viewAnimator = new ViewAnimator(this);
m_viewAnimator.setAnimateFirstView(true);

animation = new AlphaAnimation(0.0f, 1.0f);
animation.setDuration(2000);
m_viewAnimator.setInAnimation(animation);

animation = new AlphaAnimation(1.0f, 0.0f);
animation.setDuration(2000);
m_viewAnimator.setOutAnimation(animation);

this.setContentView(m_viewAnimator);

m_viewAnimator.removeAllViews();
m_viewAnimator.addView(viewLoading);

This will now fade in your "loading" view. When its time to change the view, simply remove everything and then add the next one. This will automatically fade out the old and fade in the new.

m_viewAnimator.removeAllViews();
m_viewAnimator.addView(new TitleScreenView());

You can use any transition you wish, just take a look through the docs for animations which suit your use case.

An example of using the TranslateAnimation to slide in from the right is below:

Animation animation;

animation = new TranslateAnimation(
Animation.RELATIVE_TO_SELF, 1.0f, Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 0.0f
);

animation.setDuration(400);

Have fun!

 
Copyright © Twig's Tech Tips
Theme by BloggerThemes & TopWPThemes Sponsored by iBlogtoBlog