How to start two animations at same time in androi

Question

I have two linear layouts which I want to perform two different animation on both of these layouts and at the same time.

Now its working in sequential manner. i.e, after completing one its starting another.

here is my code.

    Animation inFromRight = new TranslateAnimation(
                    Animation.RELATIVE_TO_PARENT, +0.0f,
                    Animation.RELATIVE_TO_PARENT, 0.0f,
                    Animation.RELATIVE_TO_PARENT, 0.0f,
                    Animation.RELATIVE_TO_PARENT, 0.0f);
            inFromRight.setDuration(500);
            inFromRight.setInterpolator(new AccelerateInterpolator());

    Animation outtoLeft = new TranslateAnimation(
                    Animation.RELATIVE_TO_PARENT, 0.0f,
                    Animation.RELATIVE_TO_PARENT, -1.0f,
                    Animation.RELATIVE_TO_PARENT, 0.0f,
                    Animation.RELATIVE_TO_PARENT, 0.0f);
            outtoLeft.setDuration(500);
            outtoLeft.setInterpolator(new AccelerateInterpolator());

    @Override
        public void onClick(View v) {
            switch (v.getId()) {
            case R.id.menu:
                            mainLayout.startAnimation(outtoLeft);
                sideBar.startAnimation(inFromRight);                
                break;
            }
        }

outtoLeft.setAnimationListener(new AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                mainLayout
                        .setLayoutParams(new LayoutParams(
                                LayoutParams.FILL_PARENT,
                                LayoutParams.FILL_PARENT, 40));

            }
        });

Answer 1

The way to solve this problem is to use an AnimatorSet with Animator objects. If you are worried about backwards compatibility, you can use the NineOldAndroids library to bring the API back all the way to Android 1.0

Answer 2

In your Activity

ImageView reusableImageView = (ImageView)findViewById(R.id.imageView1);
reusableImageView.setImageResource(R.drawable.flag);
reusableImageView.setVisibility(View.VISIBLE);
Animation an =  AnimationUtils.loadAnimation(this, R.anim.yourAnimation);
reusableImageView.startAnimation(an);

Then, in yourAnimation.xml define all the animations you want

<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<scale
    android:pivotX="50%"
    android:pivotY="50%"
    android:fromXScale="1.0"
    android:fromYScale="1.0"
    android:toXScale="2.0"
    android:toYScale="2.0"
    android:duration="2500" />
<scale
    android:startOffset="2500"
    android:duration="2500"
    android:pivotX="50%"
    android:pivotY="50%"
    android:fromXScale="1.0"
    android:fromYScale="1.0"
    android:toXScale="0.5"
    android:toYScale="0.5" />
<rotate
    android:fromDegrees="0"
    android:toDegrees="360"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="5000" />
</set>

Answer 3

I solved it starting second animation in onAnimationStart event of the first animation. In my example right layout replacing left one, both of them are moving left at the same time. I use animate property of a View class http://developer.android.com/reference/android/view/View.html#animate() which is available starting API v.12

leftLayout.animate()
    .translationX(-leftLayout.getWidth()) // minus width
    .setDuration(300)
    .setListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationStart(Animator animation) {
            rightLayout.animate()
                    .translationX(-leftLayout.getWidth()) // minus width
                    .setDuration(300)
                    .setListener(new AnimatorListenerAdapter() {
                        @Override
                        public void onAnimationEnd(Animator animation) {
                            leftLayout.setVisibility(View.GONE);
                            leftLayout.setTranslationX(0f); // discarding changes
                            rightLayout.setTranslationX(0f);
                        }
                    });
        }
});

Answer 4

I think you need to use an AnimationSet.

From the doc:

Represents a group of Animations that should be played together. The transformation of each individual animation are composed together into a single transform.

Here you can see how an AnimationSet is supposed to be.