I have to animate a view from state A to B with changes to its scale, position and scrolling.
The following code almost does the trick:
AnimationSet animation = new AnimationSet(true);
int fromXDelta = view.getScrollX();
int fromYDelta = view.getScrollY();
view.scrollTo(0, 0);
float scale = (float) widthB / (float) widthA;
// Calculate toXDelta and toYDelta
TranslateAnimation translateAnimation = new TranslateAnimation(-fromXDelta, -toXDelta, -fromYDelta, -toYDelta);
translateAnimation.setDuration(duration);
animation.addAnimation(translateAnimation);
ScaleAnimation scaleAnimation = new ScaleAnimation(1, scale, 1, scale);
scaleAnimation.setDuration(duration);
animation.addAnimation(scaleAnimation);
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationEnd(Animation arg0) {
view.clearAnimation();
// Change view to state B by modifying its layout params and scroll
}
#Override public void onAnimationRepeat(Animation arg0) {}
#Override public void onAnimationStart(Animation arg0) {}
});
view.startAnimation(animation);
The logic of onAnimationEnd makes the view flicker after the animation ends. Also if I don't call clearAnimation() the animation does not work as expected (why?).
Is this the right way to do this?
Thanks!
I don't know if it is the right way, but I was having the same problem as you.
I managed to get rid of the flickering by adding a:
animation.reset();
Just before the:
view.clearAnimation();
Note: In your code, it would be arg0.reset();
Did you try setting animation.setFillAfter(true) ?
It basically lets the latest position/state of your view persist when the animation is finished, avoiding any sort of flickering.
Related
I want to apply a translate animation to the view from bottom right to center THEN scale animation from where it finished translation. Once this is done, I want the view to come back to its original size and position. Any idea how to do that? Here is the code I am using for animation
TranslateAnimation translateAnim = new TranslateAnimation(0, midScreenX, 0, midScreenY);
translateAnim.setDuration(2000);
ScaleAnimation scaleAnim = new ScaleAnimation(1, 4, 1, 4, Animation.RELATIVE_TO_SELF,1f, Animation.RELATIVE_TO_SELF,1f);
scaleAnim.setDuration(2000);
use an AnimationListener to chain the animations and use setFillAfter(true)
TranslateAnimation translateAnim = new TranslateAnimation(0, midScreenX, 0, midScreenY);
translateAnim.setDuration(2000);
// user setFillAfter to make sure that we scale from the last position it was animated to.
translateAnim.setFillAfter(true);
// make scaleAnim final so we can use it in the AnimationListener.onAnimationEnd method
final ScaleAnimation scaleAnim = new ScaleAnimation(1, 4, 1, 4, Animation.RELATIVE_TO_SELF,1f, Animation.RELATIVE_TO_SELF,1f);
scaleAnim.setDuration(2000);
scaleAnim.setFillAfter(true);
translateAnim.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// now that the first animation is done, start the second
someViewObj.startAnimation(scaleAnim);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
// start first animation
someViewObj.startAnimation(translateAnim);
Android Docs : http://developer.android.com/reference/android/view/animation/Animation.AnimationListener.html
http://developer.android.com/reference/android/view/animation/Animation.html#setFillAfter(boolean)
I'm trying to slide in a view on a RelativeLayout via an animation. Once the view is in place I have to alter the layout params of layout so that the new view doesn't block existing content. I call the code to update the layout after the animation but it occurs before the animation causing a block of area to be blank during the animation.
The following screens are before animation, during and after:
Here is the code. The relative layout is adjusted in onShowAd.
float fromY = getAdHeight();
float toY = 0;
TranslateAnimation slide = new TranslateAnimation(0,0,fromY,toY);
slide.setDuration(ANIMATION_RATE);
slide.setFillAfter(true);
mAdLayout.startAnimation(slide);
onShowAd();
mAdLayout.setVisibility(View.VISIBLE);
I tried differing orders of calling visible and other things as well as using a handler to postDelayed onShowAd() to wait the same amount of time as the ANIMATION_RATE however what happened you'd stare at the black box for the time it was post delayed and then have to wait for the animation so it was worse. In windows there's an API call LOCKWINDOWUPDATE that I could pass in a window handle to prevent updating...is there anything equivalent for a view in Android? Or any other ideas?
Incidentally when sliding the view OUT it works fine. Here is the code going the other way. onHideAd is where the layoutparams are modified in this one.
float toY = ((View) mAdLayout.getParent()).getBottom();
float fromY = 0;//toY - mAdLayout.getHeight();
TranslateAnimation slide = new TranslateAnimation(0,0,fromY,toY);
slide.setDuration(ANIMATION_RATE);
slide.setFillAfter(true);
mAdLayout.startAnimation(slide);
mAdLayout.setVisibility(View.GONE);
onHideAd();
Thanks for any suggestions!
EDIT: I added the listener and that doesn't take care of it. I have isolated it to the following code which in in the "onShowAd()" routine:
RelativeLayout.LayoutParams params = (android.widget.RelativeLayout.LayoutParams) mainFragmentContainer.getLayoutParams();
params.addRule(RelativeLayout.ABOVE, mAdLayout.getId());
mainFragmentContainer.setLayoutParams(params);
I've tried to further separate it by calling it with a handler.postDelayed and it seems like anywhere I place it in the chain of events causes it to occur BEFORE the animation itself shows. Very odd! :-(
This is the updated showAd routine. I tried reordering some of the calls as well.
float fromY = getAdHeight();
float toY = 0;
TranslateAnimation slide = new TranslateAnimation(0,0,fromY,toY);
slide.setDuration(ANIMATION_RATE);
slide.setFillAfter(true);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationEnd(Animation animation) {
onShowAd();
}
});
mAdLayout.setVisibility(View.VISIBLE);
mAdLayout.startAnimation(slide);
You should use an AnimationListener to accomplish what you are looking for. The problem you are running into is caused because the call to start animation returns instantly even though the animation doesn't complete for the time set to ANIMATION_RATE.
Ex for slide in:
float fromY = getAdHeight();
float toY = 0;
TranslateAnimation slide = new TranslateAnimation(0,0,fromY,toY);
slide.setDuration(ANIMATION_RATE);
slide.setFillAfter(true);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
onShowAd();
}
});
mAdLayout.setVisibility(View.VISIBLE);
mAdLayout.startAnimation(slide);
I am confusing the translate animation and rotate animation. In my game I use this two animations, after completing the animation I am save my image. In translate animation it is fine, but after completing rotate animation my image is blink once. See my code in bellow, please solve my problem……..
Why anyone not respond my question, it is not understand or I am asking any wrong question ? Please tell me reason.................
Thanks.
Bitmap bmp=BitmapFactory.decodeResource(getResources(),R.drawable.train);
//1)
TranslateAnimation TAnimation=new TranslateAnimation(0, 0, 0,-100);//bottom to start
TAnimation.setInterpolator(new LinearInterpolator());
TAnimation.setDuration(2000);
TAnimation.setFillAfter(false);
TAnimation.setFillEnabled(true);
//TAnimation.setFillBefore(true);
Train.startAnimation(TAnimation);
TAnimation.setAnimationListener(new AnimationListener() {
public void onAnimationStart(Animation animation) {
}
public void onAnimationRepeat(Animation animation) {
}
public void onAnimationEnd(Animation animation) {
RelativeLayout RL=(RelativeLayout)findViewById(R.id.rl);
param=new RelativeLayout.LayoutParams( LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
param.setMargins(x, y, 0, 0);
Train.setLayoutParams(param);
Train.setImageBitmap(bmp);
}
});
//x and y values are exact position of compliting translateanimation position
//2)
RotateAnimation RAnimation=new RotateAnimation(0,90,50,25);
RAnimation.setInterpolator(new LinearInterpolator());
RAnimation.setDuration(2000);
RAnimation.setFillAfter(false);
TAnimation.setFillEnabled(true);
//RAnimation.setFillBefore(true);
Train.startAnimation(RAnimation);
RAnimation.setAnimationListener(new AnimationListener() {
public void onAnimationStart(Animation animation) {
}
public void onAnimationRepeat(Animation animation) {
}
public void onAnimationEnd(Animation animation) {
RelativeLayout RL=(RelativeLayout)findViewById(R.id.rl);
param=new RelativeLayout.LayoutParams( LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
param.setMargins(x, y, 0, 0);//x and y values are exact position of compliting translateanimation position
Train.setLayoutParams(param);
Train.setImageBitmap(bmp);
}
});
i had that problem but it's reaaaaally simple to fix. You don't need to implement the animation listener, simple don't do it (i had your problem because I use that way).
Do your animation and before call the animation method:
setFillAfter(true); //this save view at the end of the animation
Like so:
//my animation
final Animation rotation = AnimationUtils.loadAnimation(getActivity(), R.anim.rotate_up);
//hide login content
content.setVisibility(View.GONE);
//animContent = AnimationUtils.loadAnimation(getActivity(), R.anim.show_up);
rotation.setFillAfter(true);
//animate the arrow
arrow.startAnimation(rotation);
So, delete the listeners and change your setFillAfter(false) to TRUE. Will works ;)
I applied an infinite animation on an ImageView to indicate a running background thread in my app. When the thread finishes, I'm able to stop the animation by using clearAnimation(), but it snaps the ImageView back to its starting position, and I'd like the current animation cycle to complete (which is designed to gracefully end in its starting position). Is there a way to do this?
Register an AnimationListener, and wait until onAnimationRepeat() to clear it. I haven't tried this, but I think it will work.
Just call setRepeatCount(0) and then listen for onAnimationEnd. See here for more details.
You can set the desirable position of your animation in the onAnimationEnd() method of your animation listener. Then, instead of going to the initial position, the View will be displayed at the coordinates you set up there.
animation = new TranslateAnimation(0, -length, 0, 0); //setup here your translation parameters
animation.setInterpolator(new LinearInterpolator());
animation.setDuration(10);
animation.setAnimationListener(new Animation.AnimationListener() {
public void onAnimationStart(Animation animation) {
animationRunning = true;
}
public void onAnimationRepeat(Animation animation) {
}
public void onAnimationEnd(Animation animation) {
animationRunning = false;
// setAnimationPositionAfterPositionChange();
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) runningText.getLayoutParams();
params.leftMargin = currentPosition; //Calculate you current position here
runningText.setLayoutParams(params);
}
});
runningText.setAnimation(animation);
If you are using animate()
you use setListener(null) to stop it the animation,
works for me.
image.animate()
.translationXBy(-width* 0.5f)
.setDuration(300)
.setStartDelay(6000)
.setListener(new AnimatorListenerAdapter() {
#Override
public void onAnimationEnd(Animator animation) {
image.animate().rotationBy(90).setDuration(1000).setStartDelay(1).setListener(null);
}
});
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()!