I want to animate add View as a "slide Down" and remove View as "slide Up" in a ViewGroup. So i used LayoutTransition.class but its not supported for minSdk 8. So i found this NineOldAndroids, and was wondering if i can achieve what i want using this.
Something like this,
LayoutTransition layoutTransition = new LayoutTransition();
AnimatorSet set = (AnimatorSet) AnimatorInflater.loadAnimator(getApplicationContext(),
R.anim.slide);
layoutTransition.setAnimator(LayoutTransition.APPEARING, set);
Unfortunately NineOldAndroids does not support LayoutTransitions as it is not possible to implement in Gingerbread.
I also need to animate when adding a view without LayoutTransition.
I have no idea when to start the animation so I use LayoutAnimationController to do
:
// A fake AlphaAnimation so that we can know how to start the animation of adding view
Animation animation = new AlphaAnimation(0, 0);
animation.setDuration(1);
animation.setFillAfter(true);
animation.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// start the animation here
startAddingViewAnimation();
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
ViewGroup viewroot = findViewById(R.id.viewroot);
LayoutAnimationController layoutAnimationController = new LayoutAnimationController(animation);
viewRoot.setLayoutAnimation(layoutAnimationController);
viewRoot.addView(btn);
Set a LayoutAnimationController to notify me that the view was added and finished to draw. Then I can start the animation by nineoldanimator.
Related
This is a follow up to Animate ImageView from alpha 0 to 1.
I have an ImageButton that I want to animate into view when user does X and then animate out of view when user does Y. Animating into view is working fine. But animating out of view is kind of not working. In fact it is working, in that the animation happens. But after the button fades out of view, it pops back as VISIBLE. So I use this code
AlphaAnimation animation1 = new AlphaAnimation(0.9f, 0.0f);
animation1.setDuration(5000);
animation1.setStartOffset(1000);
animation1.setFillAfter(true);
animation1.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
GVLog.d(TAG,"MAKE INVISIBLE onAnimationStart: %s",tokenBtn.getVisibility());
}
#Override
public void onAnimationRepeat(Animation animation) {
GVLog.d(TAG,"MAKE INVISIBLE onAnimationRepeat: %s",tokenBtn.getVisibility());
}
#Override
public void onAnimationEnd(Animation animation) {
tokenBtn.setVisibility(View.INVISIBLE);
GVLog.d(TAG,"MAKE INVISIBLE onAnimationEnd: %s",tokenBtn.getVisibility());
}
});
tokenBtn.startAnimation(animation1);
but the call to make the ImageButton invisible is not taking effect. So how do I make it take effect so that the ImageButton remains invisible?
Try like this. These codes always work on my apps.
AlphaAnimation animation1 = new AlphaAnimation(1, 0);
animation1.setDuration(1000);
tokenBtn.startAnimation(animation1);
tokenBtn.setVisibility(View.INVISIBLE);
LayoutAnimationController is used to animate children of view group
I used LayoutAnimationController to show elements in LinearLayout with animation effect one by one using following code.
Animation fadeIn = AnimationUtils.loadAnimation(context, R.anim.anim_fade_in);
//lnrContactContainer is LinearLayout.
AnimationSet set = new AnimationSet(true);
set.addAnimation(fadeIn);
set.setDuration(500);
controller = new LayoutAnimationController(set, 1f);
lnrContactContainer.setLayoutAnimation(controller);
lnrContactContainer.setVisibility(View.VISIBLE);
But same approach does not work when I use it to show fadeout animation while hiding LinearLayout lnrContactContainer.setVisibility(View.GONE);
Instead of hiding children one by one it hides the parent.
Instead of hiding children one by one it hides the parent.
To hide the parent only after the Animation has been applied to all children, use an AnimationListener:
lnrContactContainer.setLayoutAnimationListener(new Animation.AnimationListener()
{
#Override
public void onAnimationStart(Animation animation){}
#Override
public void onAnimationEnd(Animation animation)
{
lnrContactContainer.setVisibility(View.GONE)
}
#Override
public void onAnimationRepeat(Animation animation){}
});
By the way, my fadeout animation needed
set.setFillAfter(true);
to keep the items from popping in again after fading although my animation xml file (in res/anim) already contained android:fillAfter="true".
I am moving the view via this code, but the actual position of view is not changed, why
TranslateAnimation ta = new TranslateAnimation(0, 0, Animation.RELATIVE_TO_SELF, -mbar4.getHeight());
ta.setDuration(1000);
ta.setFillAfter(true);
v4.startAnimation(ta);
up to version 3 (API 11) of android excluding , all animations don't really change the view , only the way it is shown . not only that, but i think they don't use the GPU at all.
in order to check it out , you can use a button and setOnClickListener for it , and see that no matter which animation you use , the click will work only on its original position and size.
here's a sample code of moving a view using the translateAnimation:
final int deltaXToMove=50;
TranslateAnimation translateAnimation=new TranslateAnimation(0,deltaXToMove,0,0);
int animationTime=1000;
translateAnimation.setDuration(animationTime);
translateAnimation.setFillEnabled(true);
translateAnimation.setFillAfter(true);
final Button b=(Button)findViewById(R.id.button);
translateAnimation.setAnimationListener(new AnimationListener()
{
#Override
public void onAnimationEnd(Animation animation)
{
animation.setFillAfter(false);
FrameLayout.LayoutParams par=(LayoutParams)b.getLayoutParams();
par.leftMargin=deltaXToMove;
b.setLayoutParams(par);
}
...
b.startAnimation(translateAnimation);
Because TranslateAnimation only changes where the View is drawn.
Try this:
TranslateAnimation ta = new TranslateAnimation(0, 0, Animation.RELATIVE_TO_SELF, -mbar4.getHeight());
ta.setDuration(1000);
ta.setFillAfter(true);
ta.setAnimationListener(new AnimationListener() {
public void onAnimationStart(Animation animation) {}
public void onAnimationRepeat(Animation animation) {}
public void onAnimationEnd(Animation animation) {
((RelativeLayout.LayoutParams)v4.getLayoutParams()).bottomMargin = mbar4.getHeight();
v4.requestLayou();
}
});
v4.startAnimation(ta);
Change RelativeLayout.LayoutParams to whatever the parent Layout is.
What i want is that each animation, from the code below, to start with a delay, like a sequence. So i have this code:
public void setAnimation(){
View view;
String animation = prefs.getString("animations", "Scale");
String interpolator = prefs.getString("interpolators", "Bounce");
Animation animate = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.scale_in);
for(int i=0; i<gridView.getChildCount(); i++){
view = gridView.getChildAt(i);
view.startAnimation(animate);
}
}
because there is a for loop, all child animations will start instantly. I already tried with:
Thread.sleep....
Handler...
animate.setStartTime...
animate.setStartOffset...
but all child animations starts instantly.
I tried this method inside of loop, and the animations won't start:
animate.setAnimationListener(new AnimationListener(){
public void onAnimationEnd(Animation arg0) {
view.startAnimation(animate);
}
public void onAnimationRepeat(Animation arg0) {
}
public void onAnimationStart(Animation arg0) {
}
});
Thanx in advance.
The solution is to create a GridLayoutAnimationController or LayoutAnimationController.
I used LayoutAnimationController to show elements in LinearLayout with animation effect one by one using following code.
Animation fadeIn = AnimationUtils.loadAnimation(context, R.anim.anim_fade_in);
//lnrContactContainer is LinearLayout.
AnimationSet set = new AnimationSet(true);
set.addAnimation(fadeIn);
set.setDuration(500);
controller = new LayoutAnimationController(set, 1f);
lnrContactContainer.setLayoutAnimation(controller);
lnrContactContainer.setVisibility(View.VISIBLE);
But same approach does not work when I use it to show fadeout animation while hiding LinearLayout lnrContactContainer.setVisibility(View.GONE);
I've a quick question.
I'm trying to animating a child view to make it disappear. That part is easy, but, during the animation, the parent view is not resized. How can I do to make the parent view automtically resize during the animation?
Here is my current code:
AnimationSet set = new AnimationSet(true);
Animation fade = new ScaleAnimation(1.f, 1.f, 1.f, 0);
Animation fade2 = new AlphaAnimation(1, 0);
set.addAnimation(fade);
set.addAnimation(fade2);
set.setDuration(2000);
set.setFillAfter(true);
bgColor.startAnimation(set);
bgColor is the View I'm making disappear. Here is the final result :
Result
You can see the gap after the animation.
Any ideas?
Thanks in advance!
You may add an AnimationListener and do a change of the layout after the animation is done
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationEnd(Animation animation) {
bgColor.setVisibility(View.GONE);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationStart(Animation animation) {
}
});
Also, be sure to have your stuff together regarding onFillAfter()!