I got some text views and I want to make the buzz effect of MSN.
My plan is:
- take the view, let say 10dip to the left,
- take it back to its start position
- after that take it 10dip up
- then back
- down back
- left... and so on.
My point is, I have some sequence of movements that I want to set to one view and that needs to execute one after another.
How can I do that?
Use an AnimationSet:
AnimationSet set = new AnimationSet(true);
Animation animation = new AlphaAnimation(0.0f, 1.0f);
animation.setDuration(100);
set.addAnimation(animation);
animation = new TranslateAnimation(
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, -1.0f, Animation.RELATIVE_TO_SELF, 0.0f
);
animation.setDuration(500);
set.addAnimation(animation);
view.startAnimation( set );
You probably mean AnimatorSet (not AnimationSet). As written in documentation:
This class plays a set of Animator
objects in the specified order. Animations can be set up to play together, in sequence, or after a specified delay.
There are two different approaches to adding animations to a AnimatorSet: either the playTogether()
or playSequentially()
methods can be called to add a set of animations all at once, or the play(Animator)
can be used in conjunction with methods in the Builder
class to add animations one by one.
Animation which moves view
by -100px
for 700ms
and then disappears during 300ms
:
final View view = findViewById(R.id.my_view);
final Animator translationAnimator = ObjectAnimator
.ofFloat(view, View.TRANSLATION_Y, 0f, -100f)
.setDuration(700);
final Animator alphaAnimator = ObjectAnimator
.ofFloat(view, View.ALPHA, 1f, 0f)
.setDuration(300);
final AnimatorSet animatorSet = new AnimatorSet();
animatorSet.playSequentially(
translationAnimator,
alphaAnimator
);
I have the beginnings of an sdk 15 compatible class that can be used to build complex animation chains hope it helps someone. You should be able to follow the design pattern to add your own methods. If you do please comment them here and I will update the answer, Cheers!
package com.stuartclark45.magicmatt.util;
import java.util.LinkedList;
import java.util.List;
import android.animation.Animator;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.view.View;
/**
* Used to build complex animations for a view. Example usage bellow makes view move out to the
* right whilst rotating 45 degrees, then move out to the left.
*
* {@code
* int rotateDuration = 200;
* int rotation = 45;
* new AnimationBuilder(view)
* .translationX(100, rotateDuration)
* .rotateTo(rotation, rotateDuration)
* .then()
* .translationX(-200, rotateDuration)
* .start();
* }
*
* @author Stuart Clark
*/
public class AnimationBuilder {
private View view;
private List<Animator> setsList;
private List<Animator> buildingList;
public AnimationBuilder(View view) {
this.view = view;
this.setsList = new LinkedList<>();
this.buildingList = new LinkedList<>();
}
public AnimationBuilder rotateTo(float deg, long duration) {
buildingList.add(ObjectAnimator.ofFloat(view, "rotation", deg).setDuration(duration));
return this;
}
public AnimationBuilder translationX(int deltaX, long duration) {
buildingList.add(ObjectAnimator.ofFloat(view, "translationX", deltaX).setDuration(duration));
return this;
}
public AnimationBuilder translationY(int deltaX, long duration) {
buildingList.add(ObjectAnimator.ofFloat(view, "translationY", deltaX).setDuration(duration));
return this;
}
public AnimationBuilder then() {
createAniSet();
// Reset the building list
buildingList = new LinkedList<>();
return this;
}
public void start() {
createAniSet();
AnimatorSet metaSet = new AnimatorSet();
metaSet.playSequentially(setsList);
metaSet.start();
}
private void createAniSet() {
AnimatorSet aniSet = new AnimatorSet();
aniSet.playTogether(buildingList);
setsList.add(aniSet);
}
}