CODEWITHSUNDEEP
androidandroid-viewpagerandroid-recyclerview
osemec
osemec

Reputation: 259

Android RecyclerView with ViewPager

I have implemented a working RecyclerView with an image animation popup. The code I used for zooming a view (image) in RecyclerView was taken from here: https://developer.android.com/training/animation/zoom.html

After the image animation is over, I want to be able to slide left and right to other images. Is there some good way to do this?

My code for zooming an image (Right after the thumbnail image is fully zoomed, the better resolution of an image is displayed):

public void zoomImageFromThumb(final View thumbView, final Bitmap path,final String image) {
    if (mCurrentAnimator != null) {
        mCurrentAnimator.cancel();
    }

    final TouchImageView  imageView  = (TouchImageView) activity.findViewById(R.id.expanded_image);

    imageView.setImageBitmap(path);//thumbnail image

    final Rect startBounds = new Rect();
    final Rect finalBounds = new Rect();
    final Point globalOffset = new Point();

    thumbView.getGlobalVisibleRect(startBounds);
    this.activity.findViewById(R.id.container).getGlobalVisibleRect(finalBounds, globalOffset);
    startBounds.offset(-globalOffset.x, -globalOffset.y);
    finalBounds.offset(-globalOffset.x, -globalOffset.y);

    float startScale;
    if ((float) finalBounds.width() / finalBounds.height() > (float) startBounds.width() / startBounds.height()) {
        startScale = (float) startBounds.height() / finalBounds.height();
        float startWidth = startScale * finalBounds.width();
        float deltaWidth = (startWidth - startBounds.width()) / 2;
        startBounds.left -= deltaWidth;
        startBounds.right += deltaWidth;
    } else {
        startScale = (float) startBounds.width() / finalBounds.width();
        float startHeight = startScale * finalBounds.height();
        float deltaHeight = (startHeight - startBounds.height()) / 2;
        startBounds.top -= deltaHeight;
        startBounds.bottom += deltaHeight;
    }

    thumbView.setAlpha(0f);
    imageView.setVisibility(View.VISIBLE);

    imageView.setPivotX(0f);
    imageView.setPivotY(0f);

    AnimatorSet set = new AnimatorSet();
    set.play(ObjectAnimator.ofFloat(imageView, View.X, startBounds.left, finalBounds.left)).with(ObjectAnimator.ofFloat(imageView, View.Y, startBounds.top,
            finalBounds.top))
            .with(ObjectAnimator.ofFloat(imageView, View.SCALE_X, startScale, 1f))
            .with(ObjectAnimator.ofFloat(imageView, View.SCALE_Y, startScale, 1f));

    set.setDuration(mShortAnimationDuration);
    set.setInterpolator(new DecelerateInterpolator());
    set.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            mCurrentAnimator = null;
            imageView.setImageURI(Uri.parse(image));//Better resolution of an image is displayed
        }
        @Override
        public void onAnimationCancel(Animator animation) {
            mCurrentAnimator = null;
        }
    });

If I just go to ViewPager and display better resolution of an image after animation is complete, it doesn't go smoothly.

Upvotes: 0

Views: 384

Answers (1)

osemec
osemec

Reputation: 259

The solution is to zoom the ViewPager instead of zooming the image. It works perfectly that way.

Upvotes: 1

Related Questions