3

ViewPager跳ねる・弾力のあるスライド効果のあるを表示したい。これは、 aPageTransformerと a の組み合わせを使用して可能であると思いますBounceInterpolator

私が知らないのは方法です。これまでのところ、私はこれを達成することができませんでした。

a の典型的な例は、次のPageTransformerようなものです。

public class TypicalPageTransformer implements ViewPager.PageTransformer {

    @Override
    public void transformPage(View view, float position) {

        if (position < -1) { // [-Infinity,-1)
            // This page is way off-screen to the left.
            view.setAlpha(0);

        } else if (position <= 0) { // [-1,0]
            // Use the default slide transition when moving to the left page
            view.setAlpha(1);
            view.setTranslationX(0);
            view.setScaleX(1);
            view.setScaleY(1);

        } else if (position <= 1) { // (0,1]
            // Fade the page out.
            view.setAlpha(1 - position);

            // Counteract the default slide transition
            view.setTranslationX(pageWidth * -position);

            // Scale the page down (between MIN_SCALE and 1)
            float scaleFactor = MIN_SCALE
                    + (1 - MIN_SCALE) * (1 - Math.abs(position));
            view.setScaleX(scaleFactor);
            view.setScaleY(scaleFactor);

        } else { // (1,+Infinity]
            // This page is way off-screen to the right.
            view.setAlpha(0);
        }
    }
}

問題は、Interpolator(あらゆる種類の) をここでどのように捉えるかということです。のアニメーションのオブジェクトをどこから取得して、それに を設定するのでしょうか?AnimationViewPagerInterpolator

私はすでに次の投稿を参照しました。

3 番目の投稿には、まさにこのアプローチについて言及している回答がありますが、その方法に関する詳細は提供されていません。

BounceInterpolatorをとを組み合わせる方法を正確に知っている人はいPageTransformerますか? これは、この問題に対する有機的で首尾一貫したアプローチのように見えますが、そもそも可能でしょうか? または、これに対する別の論理的な解決策はありますか?

参考文献:

注意:

とを組み合わせるだけで、 を拡張する必要なく、弾性/バウンス アニメーション効果を実現できるはずです。他のアプローチも歓迎しますが、アウトラインだけでなく、コードを含む詳細なソリューションを提供してください。InterpolatorPageTransformerViewPager

4

3 に答える 3

4

この効果を実現するには、fakeDragBy メソッドを使用できます。

 viewPager.beginFakeDrag();
viewPager.fakeDragBy(offset); //offset in pixels. 
viewPager.endFakeDrag();

または、次の方法を使用できます。

private int animFactor;
private ValueAnimator animator = new ValueAnimator();

private void animateViewPager(final ViewPager pager, final int offset, final int delay) {
    if (!animator.isRunning()) {
        animator.removeAllUpdateListeners();
        animator.removeAllListeners();
        //Set animation
        animator.setIntValues(0, -offset);
        animator.setDuration(delay);
        animator.setRepeatCount(1);
        animator.setRepeatMode(ValueAnimator.RESTART);
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            public void onAnimationUpdate(ValueAnimator animation) {
                Integer value = animFactor * (Integer) animation.getAnimatedValue();
                if (!pager.isFakeDragging()) {
                    pager.beginFakeDrag();
                }
                pager.fakeDragBy(value);
            }
        });
        animator.addListener(new AnimatorListenerAdapter() {

            @Override
            public void onAnimationStart(Animator animation) {
                animFactor = 1;
            }

            @Override
            public void onAnimationEnd(Animator animation) {
                pager.endFakeDrag();
            }

            @Override
            public void onAnimationRepeat(Animator animation) {
                animFactor = -1;
            }
        });
        animator.start();
    }
}

Javaクラスでは、これだけを使用してください:

animateViewPager(pager, 10, 1000);
于 2016-06-02T09:56:45.773 に答える
0

このライブラリを見てください。多分それはあなたを助けるかもしれません。

于 2016-06-22T19:43:38.283 に答える
0

PageTransformer言及された効果を達成するための最良の方法であるかどうかはわかりません。このような変換は、両方のスワイプ方向で同じになることに注意してください。受信した位置では、左から右にスワイプするか、その逆にスワイプするかがわからないためです。そしておそらく、ビューの反対側の 2 つの面をバウンスさせたくないでしょうが、プルが適用されるのは 1 つのみです。もう 1 つは、IMO よりも重要なことですが、PageTransformerフレーミングは、安定したシステム クロックではなく、ユーザーのジェスチャーによって駆動されます。その結果、フェード フェーズ (ユーザーが指を離したときのフェーズ) の持続時間を制御できず、スムーズな動作を実現できません (一般に、ティックは非単調に変化する位置で配信され、タッチ速度に大きく依存するため)。

ValueAnimatorしたがって、によってトリガーされる標準 API を使用する方がはるかに優れていますOnPageChangeListener。もちろん、この場合、別の注意点がありますが、このアプローチの方が有望なようです。

于 2016-06-24T08:07:05.300 に答える