How to run two different animations on recyclerView consecutively? - android

I have a horizontal recyclerView, I want to animate it (by sliding right and then left) when the activity is first opened.
So I do this in onCreate:
final Animation slideRight = AnimationUtils.loadAnimation(this, R.anim.slide_right);
slideRight.setDuration(200);
final Animation slideLeft = AnimationUtils.loadAnimation(this, R.anim.slide_left);
slideLeft.setDuration(200);
RecyclerView recyclerView = findViewById(R.id.recycler_view);
recyclerView.startAnimation(slideRight);
recyclerView.startAnimation(slideLeft);
but seems like only the right slide works
here are my anims:
left slide
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >
<translate
android:duration="200"
android:fromXDelta="-100%"
android:fromYDelta="0%"
android:toXDelta="0%"
android:toYDelta="0%" />
</set>
right slide
<translate
android:duration="200"
android:fromXDelta="100%"
android:fromYDelta="0%"
android:toXDelta="0%"
android:toYDelta="0%" />
what am I doing wrong?
EDIT: how is this related to proposed duplicate?

try this one
Animation slideRight = AnimationUtils.loadAnimation(this, R.anim.slide_right);
Animation slideLeft = AnimationUtils.loadAnimation(this, R.anim.slide_left);
slideRight.setDuration(200);
slideLeft.setDuration(200);
slideRight .setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
recyclerView.startAnimation(slideLeft);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
recyclerView.startAnimation(slideRight);

In this case slideLeft animation will work.. because before the slideRight is working the slideleft is getting started.. so do like this...
slideRight.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
recyclerView.startAnimation(slideLeft);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
}
At the end of animation right start the animation left
Edit
Or you can start only one anim by adding repeatMode = reverse and repeatCount = 1` in your anim..
android:repeatMode="reverse" android:repeatCount="1"

Related

How to add delay between animations

I'm having a trouble with animations in android. I have my animation_char.xml:
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
android:duration="300"
android:fromAlpha="0.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:toAlpha="1.0"/>
</set>
That is ok, but in my MainActivity I want to start an animation one after one. So I created a method to make it more easy and just change the ImageView
public void animation(ImageView imageView){
animation = AnimationUtils.loadAnimation(getApplicationContext(),R.anim.animation_char);
imageView.startAnimation(animation);
}
And for make consecutives animations, I'm trying to use AnimatorSet. But as I read AnimatorSet works with Animator, not with Animation. So my question is:
is there a way to load an animation in a animator?? Or should I use another way in order to achieve what I want to do? Thanks in advance!
EDIT
I changed my method and now Im trying with this but the problem is that all the images appear at the same time, how can I add some delay between animations?
public void animation() {
animation= AnimationUtils.loadAnimation(getApplicationContext(),R.anim.animation_char);
w.startAnimation(animation);
a.startAnimation(animation);
r.startAnimation(animation);
}
Actually I've answered on this question here. You should start your second animation in onAnimationEnd of AnimationListener of first animations. The same for second one.
You should use AnimationSet class instead of AnimatorSet.
For instance
AnimationSet as = new AnimationSet(true);
as.setFillEnabled(true);
as.setInterpolator(new BounceInterpolator());
as.addAnimation(firstAnim);
as.addAnimation(secondAnim);
as.setDuration(1000);
imageView.startAnimation(as);
I put this here maybe it helps someone...
I did something like this. I have 3 images that I want to fall one after the other.
note1 = findViewById(R.id.note1);
note1.setVisibility(View.INVISIBLE);
note2 = findViewById(R.id.note2);
note2.setVisibility(View.INVISIBLE);
note3 = findViewById(R.id.note3);
note3.setVisibility(View.INVISIBLE);
Setting visibility so that they are not shown initially
And then create 3 animations
Animation slideDown = AnimationUtils.loadAnimation(this, R.anim.slide_down);
note1.startAnimation(slideDown);
final Animation slideDown2 = AnimationUtils.loadAnimation(SplashScreen.this, R.anim.slide_down);
final Animation slideDown3 = AnimationUtils.loadAnimation(SplashScreen.this, R.anim.slide_down);
Next step is to add the event listeners that #Divers added:
slideDown.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
note1.setVisibility(View.VISIBLE);
note2.startAnimation(slideDown2);
slideDown2.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
note3.startAnimation(slideDown3);
note2.setVisibility(View.VISIBLE);
slideDown3.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
note3.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
And that's all
My animation xml is something like
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="800"
android:fromXDelta="0%"
android:fromYDelta="-50%p"
/>
<alpha
android:duration="500"
android:fromAlpha="0.1"
android:toAlpha="1.0"
/>
</set>
If you use Kotlin, you can use this way:
doOnEnd {startDelay = 1000L
start() }
Where repeatCount = 1
look at this example:
val animations = arrayOf(-140f).map { translation ->
ObjectAnimator.ofFloat(binding.viewYatch, "translationX", translation).apply {
//Update
duration = 800
repeatCount = 1
repeatMode = ObjectAnimator.RESTART
doOnEnd {
startDelay = 1000L
start()
}
}
}
val set = AnimatorSet()
set.playTogether(animations)
set.start()

Animations in sequence

I want to set colors to my tiles in sequence.
This function is called in a for-loop, so its called some times in a very short timewindow.
tile.setImage(R.drawable.blue);
This is the function:
public void setImage(int resId){
Animation fadeInAnimation = AnimationUtils.loadAnimation(this.getContext(), R.animator.fadein);
startAnimation(fadeInAnimation);
setImageResource(resId);
}
and this is the fadein.xml
<alpha
android:duration="1000"
android:fromAlpha="0.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:toAlpha="1.0" />
</set>
I want the animation to start only if the animation before it is done.
So I would like the first image to be drawn the first sec and the second image during the second sec, and so on.
BR
Use AnimationListener especially its method onAnimationEnd(Animation animation)
fadeInAnimation.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// CALL next animation
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});`

perform Fade_out animation android

I want to perform a fade out animation whenever a keyboard click matches with the image that is on the view.
Here is my code for the matching click:
Animation animation = AnimationUtils.loadAnimation(this, R.anim.fadeout);
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
imageView.setAlpha(255);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
imageView.setVisibility(ImageView.GONE);
}
});
if(counterOfindex==random.length){
startAnimation();
}else{
startAnimation();
Log.e("removed_id=:", ""+viewId);
}
I want to slowly fade out the image once the right key letter on the keyboard has been clicked.
Here is my XML:
<?xml version="1.0" encoding="UTF-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/decelerate_interpolator">
<alpha android:fromAlpha="1.0" android:toAlpha="0.0"
android:duration="4000"/>
</set>
Problem: Nothing is happening. The code runs just as it was running previously.

How to apply Scale animation After Translate animation in android

Hi am doing one app here i need to apply rotate,move scale animation to my imageview..i tried using below code rotate and scale animation working well but in scale animation image is not scaling in where translate animation stoped that postion its coming back to original postion there its scaling..but i need to scale image where my image stoped using translate animation..where i did mistake any one suggest me thanks
public class MainActivity extends Activity {
ImageView i1;
TranslateAnimation moveLefttoRight1;
Animation logoMoveAnimation;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
i1=(ImageView)findViewById(R.id.img);
final Animation myRotation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.rotate1);
i1.startAnimation(myRotation);
moveLefttoRight1 = new TranslateAnimation(0, 0, 0, 200);
moveLefttoRight1.setDuration(2000);
moveLefttoRight1.setFillAfter(true);
myRotation.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
i1.startAnimation(moveLefttoRight1);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
logoMoveAnimation = AnimationUtils.loadAnimation(this, R.anim.sacle);
moveLefttoRight1.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
i1.startAnimation(logoMoveAnimation);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
}
}
scale.xml:
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXScale="0.5"
android:toXScale="2.0"
android:fromYScale="0.5"
android:toYScale="2.0"
android:pivotX="0%"
android:pivotY="100%"
android:startOffset="0"
android:duration="1000"
android:fillAfter="true" />
rotate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<rotate android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="0"
android:duration="3000"/>
</set>
u may try
after translation has finished
img.setTranslation(value);
value = the position where image should be after translation

how do i start animation after some time in android?

I want to start second animation after the end of first animation.
This is what i have done so far
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<translate
android:toYDelta="50%p"
android:duration="6000"
android:fillEnabled="false"
android:startOffset="7000"
android:fillAfter="false"/>
</set>
Any help will be appriciated. TIA
Use AnimationListener on your first animation, and when it is completed, start the second animation.
animation1.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// Start the second animation.
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});

Categories

Resources