Card flip animation in android

20,793

Solution 1

imageView.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        final ObjectAnimator oa1 = ObjectAnimator.ofFloat(imageView, "scaleX", 1f, 0f);
        final ObjectAnimator oa2 = ObjectAnimator.ofFloat(imageView, "scaleX", 0f, 1f);
        oa1.setInterpolator(new DecelerateInterpolator());
        oa2.setInterpolator(new AccelerateDecelerateInterpolator());
        oa1.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                imageView.setImageResource(R.drawable.frontSide);
                oa2.start();
            }
        });
        oa1.start();
    }
});

This animation doesn't have any depth but maybe you will like it.

You can also set animation duration with

oa1.setDuration(1000);
oa2.setDuration(1000);

Solution 2

Property Animations (not to be confused with the older View Animation) are quite powerful :

final View v = <the_image_view>;

// first quarter turn
v.animate().withLayer()
        .rotationY(90)
        .setDuration(300)
        .withEndAction(
                new Runnable() {
                    @Override public void run() {

                        <change the image...>

                        // second quarter turn
                        v.setRotationY(-90);
                        v.animate().withLayer()
                                .rotationY(0)
                                .setDuration(300)
                                .start();
                    }
                }
        ).start();

You can adjust the perspective effect with View.setCameraDistance()

Share:
20,793
POUYA KARIMI
Author by

POUYA KARIMI

Updated on September 08, 2020

Comments

  • POUYA KARIMI
    POUYA KARIMI almost 4 years

    I have tired to make a flip card in android.Please make an image view,when I click on,it flip like  this