I implement the translateAnimation to a imageview.
it Successfully animatated.
One translate is moving up and another one is moving down. i need to change image when start second translate.
My code is:
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/accelerate_decelerate_interpolator"
android:shareInterpolator="true">
<translate
android:fromXDelta="0%" android:toXDelta="0%p"
android:fromYDelta="0%" android:toYDelta="20%"
android:drawable="#drawable/bs_bunny1"
android:duration="2000" android:startOffset="100"/>
<translate
android:fromXDelta="0%" android:toXDelta="0%p"
android:fromYDelta="0%p" android:toYDelta="-20%p"
android:duration="3000" android:startOffset="100"/></set>
I set the above animation to the imageview.
But i want to chage the image when start to load the second translate.. How to do it.
You need to break it up into two animations, and register a Animation.AnimationListener to the first translate animation. On Animation.AnimationListener's onAnimationEnd(Animation animation) callback, do the image change and then start the second animation, like thus:
translate.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
view.setImageResource(resId);
view.startAnimation(translate2);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
Related
I wanna use an animation in my prog., but it is not seen on emulator. It opens MenuActivity class before animation resource.
Here is the code partition;
Animation anim = AnimationUtils.loadAnimation(this, R.anim.fade_in);
ImageView girisLogo = (ImageView)findViewById(R.id.girisLogoImageView);
anim.reset();
girisLogo.clearAnimation();
girisLogo.startAnimation(anim);
anim.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
Intent intent = new Intent(GirisActivity.this,MenuActivity.class);
startActivity(intent);
GirisActivity.this.finish();
}
public void onAnimationRepeat(Animation animation) {}
public void onAnimationEnd(Animation animation) {}
});
}
fade_in.xml:
<set xmlns:android="https://schemes.android.com/apk/res/android">
<alpha
android:fromAlpha = "0.0"
android:toAlpha="1.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:duration="4000"
/>
</set>
I tried to use anim.serDuration(400); but result doesnt change.
Could you help me in this problem?
Change fade_in.xml
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:duration="4000" />
Also, if you want the new Activity to start when animation ends, place the code in onAnimationEnd()
How can I move an object out of the screen?
This is how I move the TextView from under the screen into the screen.
slide_up_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromYDelta="100%" android:toYDelta="0%" android:duration="500" android:fillAfter="true"/>
</set>
This is how I move it out of the screen:
slide_down_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromYDelta="0%" android:toYDelta="100%" android:duration="500" android:fillAfter="true"/>
</set>
But the TextView appears again. Why?
That is because it renders it again after the animation and will actually place the TextView to its default position from the screen/layout.
solution:
You need to add a listener and set the visibility of your TextView to gone or invisible at the end of the listener.
animation.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) { }
#Override
public void onAnimationEnd(Animation animation) {
You_text_view.setVisibility(View.INVISIBLE);
}
#Override
public void onAnimationRepeat(Animation animation) { }
});
I want to apply animation on layout
when i click on arrow the slide meny look like
then clink on arrow reanimation the menuenter code here
You can define an animation like this one that animates left to right and apply that to your layout:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<translate android:fromXDelta="-100%" android:toXDelta="0%"
android:fromYDelta="0%" android:toYDelta="0%"
android:duration="700"/>
</set>
To apply animation to a layout resource:
Animation slideInLeft;
...
slideInLeft = AnimationUtils.loadAnimation(this, R.anim.slide_in_left);
mYourLayout.startAnimation(slideInLeft);
Edit:
When the animation is finished the layout will go back to the starting position. to avoid that you can use one of these 3 approaches:
1- Define an animation listener like this and hide your layout
anim.setAnimationListener(new Animation.AnimationListener(){
#Override
public void onAnimationStart(Animation arg0) {
}
#Override
public void onAnimationRepeat(Animation arg0) {
}
#Override
public void onAnimationEnd(Animation arg0) {
}
});
2- Use a postDelayed Handler with the same duration has your animation duration and hide the layout at the end.
3- add this line to your animation:
anim.setFillAfter(true);
Hope it helps.
I have 2 imageview (a imageview for a pen image, and a imageview for a line, both are drawable), that each one has it own view animation that works perfectly.
my problem is that when I start the animation for the pen I want it to interact and animate the drawing of the line in the other view animation (I want that it will show as the pen is drawing the line), how do I do that?
my xml for animation for the pen imageview is:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0%p"
android:toXDelta="100%p"
android:fromYDelta="-50%p"
android:toYDelta="-50%p"
android:duration="2000"/>
</set>
my xml for animation for the line imageview is:
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="0%"
android:pivotY="50%"
android:fromXScale="0%"
android:toXScale="100%"
android:fromYScale="1.0"
android:toYScale="1.0"
android:fillAfter="true"
android:duration="2000"
android:interpolator="#android:anim/linear_interpolator"
/>
please help!
I believe this can be done with the help of animationListener. Add an animationListener for the pen's animation. In onAnimationStart method do lineImage.startAnimation(lineAnimation);
Sample:
penAnimation.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
lineImage.startAnimation(lineAnimation);
}
#Override
public void onAnimationEnd(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
I am applying three animations in an ImageView, one after another. I have a AnimationListener for each animation, so inside the onAnimationEnd, I start the next one, so they dont overlap. The animations are this: scale in, fade out and the last one fade in. The fade in animation will restart the scale in animation again, to these animations will be running "forever". What I am trying to achieve is the same effect Twitter has applied to their new home screen, where they keep changing the pictures.
The problem with my animations is that after scaling in the ImageView and before staring the the fade out animation, the ImageView gets reseted and the scale change is lost, even setting fillAfter in the code or in the xml file. Here is the code for handling the animation events:
mAnimationFadeIn = AnimationUtils.loadAnimation(this, R.anim.fade_in);
mAnimationFadeIn.setFillAfter(true);
mAnimationFadeOut = AnimationUtils.loadAnimation(this, R.anim.fade_out);
mAnimationFadeOut.setFillAfter(true);
mAnimationScaleIn = AnimationUtils.loadAnimation(this, R.anim.slow_scale_in);
mAnimationScaleIn.setFillAfter(true);
mAnimationScaleIn.setFillEnabled(true);
mAnimationScaleIn.setFillBefore(false);
mAnimationScaleIn.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationEnd(Animation animation) {
mImageView.startAnimation(mAnimationFadeOut);
}
});
mAnimationFadeOut.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationEnd(Animation animation) {
mImageView.setImageResource(mImages[++mImageIndex > 2 ? mImageIndex=0 : mImageIndex]);
mImageView.startAnimation(mAnimationFadeIn);
}
});
mAnimationFadeIn.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationEnd(Animation animation) {
mImageView.startAnimation(mAnimationScaleIn);
}
});
mImageView.startAnimation(mAnimationScaleIn);
and here are my animations:
scale in:
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:duration="9000"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:interpolator="#android:anim/linear_interpolator"
android:pivotX="50.0%"
android:pivotY="50.0%"
android:toXScale="1.1"
android:toYScale="1.1" />
fade in:
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromAlpha="0.0"
android:interpolator="#android:anim/linear_interpolator"
android:toAlpha="1.0" />
fade out:
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromAlpha="1.0"
android:interpolator="#android:anim/linear_interpolator"
android:toAlpha="0.0" />
Is there a way to keep the scale transformation before starting the fade out animation?
I have tried all the combinations for setFillAfter, setFillBefore and setFillEnabled and no way I can get the scale transformation to be kept after the scale animation is over.
Many thanks
T
do as given below u have to enable it in set tag and than use in either rotate or scale etc...
<?xml version="1.0" encoding="UTF-8"?>
<set android:shareInterpolator="false"
android:fillEnabled="true"
android:fillAfter="true"
xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:toDegrees="359"
android:pivotX="50%"
android:fromXScale="1.0"
android:toXScale="1.4"
android:fromYScale="1.0"
android:toYScale="1.4"
android:pivotY="50%"
android:fillAfter="true"
android:fillEnabled="true"
android:duration="2000" />
<scale
android:interpolator="#android:anim/accelerate_decelerate_interpolator"
android:fromXScale="1.0"
android:toXScale="1.4"
android:fromYScale="1.0"
android:toYScale="1.4"
android:pivotX="50%"
android:pivotY="50%"
android:fillEnabled="true"
android:fillAfter="true"
android:duration="2000" />
</set>