Slow Motion in Android View Pager Transition

Question

Slow Motion in Android View Pager Transition

Navigation

#1 by (1 votes)

1

I'm developing an Android application, one of which requires a ViewPager of images, these images will automatically transition from one to another in a time interval I set. This is already done.
The problem is that when you move from one image to another, the transition is quick, I wanted to know some way to simulate the transition of how you would slowly run your finger across the screen. Thanks in advance.

Pager Item Transition Animation

public class DepthPageTransformer implements ViewPager.PageTransformer {
private static final float MIN_SCALE = 0.75f;

public void transformPage(View view, float position) {
    int pageWidth = view.getWidth();

    if (position < -1) {
        view.setAlpha(0);

    } else if (position <= 0) {

        view.setAlpha(1);
        view.setTranslationX(0);
        view.setScaleX(1);
        view.setScaleY(1);

    } else if (position <= 1) {

        view.setAlpha(1 - position);


        view.setTranslationX(pageWidth * -position);

        float scaleFactor = MIN_SCALE
                + (1 - MIN_SCALE) * (1 - Math.abs(position));
        Log.i("SCALE", String.valueOf(scaleFactor));
        view.setScaleX(scaleFactor);
        view.setScaleY(scaleFactor);

    } else {
        view.setAlpha(0);
    }
}

}

Cyclic Behavior that transitions the ViewPager from Three in Three Seconds

public void controlTimeSlidePageAdvert(){
    Timer timer = new Timer();
    TimerTask timerTask = new TimerTask() {
        @Override
        public void run() {
            handler.post(new Runnable() {
                @Override
                public void run() {
                    if (mPagerAdverts.getCurrentItem() == mPagerAdapterAdverts.getCount() - 1)
                        mPagerAdverts.setCurrentItem(0);
                    else
                        mPagerAdverts.setCurrentItem(mPagerAdverts.getCurrentItem() + 1);
                }
           });
        }
    };
    timer.schedule(timerTask, 1000, 3000);
}

android

asked by anonymous 07.01.2016 / 23:21

1 answer

TWebbrowser load html pages (forms) in sequence Different windows (xaml) for Landscape and Portrait

score 1 · Accepted Answer

I think this should go against what you want:

private final static int PAGER_TRANSITION_DURATION_MS = 500;
private void animatePagerTransition(final boolean forward) {

    ValueAnimator animator = ValueAnimator.ofInt(0, mPager.getWidth());
    animator.addListener(new Animator.AnimatorListener() {
        @Override
        public void onAnimationStart(Animator animation) {
        }

        @Override
        public void onAnimationEnd(Animator animation) {
            if(mPager.isFakeDragging())
                mPager.endFakeDrag();
        }

        @Override
        public void onAnimationCancel(Animator animation) {
            if(mPager.isFakeDragging())
                mPager.endFakeDrag();
        }

        @Override
        public void onAnimationRepeat(Animator animation) {
        }
    });

    animator.setInterpolator(new AccelerateInterpolator());
    animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {

        private int oldDragPosition = 0;

        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            int dragPosition = (Integer) animation.getAnimatedValue();
            int dragOffset = dragPosition - oldDragPosition;
            oldDragPosition = dragPosition;
            //Testar isFakeDragging() garante que fakeDragBy()
            //não lança IllegalStateException
            //se a página for movida manualmente durante a animação 
            if(mPager.isFakeDragging()){
                mPager.fakeDragBy(dragOffset * (forward ? -1 : 1));
            }else{
                animation.cancel();
            }
        }
    });

    animator.setDuration(PAGER_TRANSITION_DURATION_MS);
    mPager.beginFakeDrag();
    animator.start();
}

Adapted from this response in SOen

To use it, change the controlTimeSlidePageAdvert() method as follows:

public void controlTimeSlidePageAdvert(){
    Timer timer = new Timer();
    TimerTask timerTask = new TimerTask() {
        @Override
        public void run() {
            handler.post(new Runnable() {
                @Override
                public void run() {
                    if (mPager.getCurrentItem() == mPagerAdapter.getCount() - 1)
                        mPager.setCurrentItem(0);
                    else
                        //mPager.setCurrentItem(mPager.getCurrentItem() + 1);
                        animatePagerTransition(true);
                }
           });
        }
    };
    timer.schedule(timerTask, 1000, 3000);
}

Notes:

animatePagerTransition(true) advances one page.
animatePagerTransition(false) goes back one page.
PAGER_TRANSITION_DURATION_MS defines the time in milliseconds that the transition takes.