美文网首页
Android如何实现轮播效果:ViewFlipper 和 Vi

Android如何实现轮播效果:ViewFlipper 和 Vi

作者: BlueSocks | 来源:发表于2023-06-01 20:12 被阅读0次

    前言

    现在的app中基本上都有轮播的需求,比如广告banner、最新消息tips等等。

    其中我们熟悉的顶部广告一般左右轮播,这种情况大部分通过ViewPager实现。而那种上下轮播的消息tips(一般是条状)则可以使用ViewFlipper实现。

    说到ViewFlipper,就不得不先说ViewAnimator,它是ViewFlipper的父类,ViewFlipper的功能就是在它基础上扩展出来的。

    ViewAnimator

    ViewAnimator继承FrameLayout,所以它的子View都是堆叠的。它的主要作用就是可以切换这些子view,且切换时有动画过渡。

    我们可以直接在xml中给它添加子view,也可以通过addView系列函数动态添加子view。因为ViewAnimator重写了最终的addView函数。

    然后可以调用showNextshowPrevious来切换下一个或上一个子view。

    还可以使用setInAnimationsetOutAnimation设置切换动画。

    可以看到这些就满足了我们轮播的基本需求:切换+动画。

    ViewAnimator有几个子类:TextSwitcher,ImageSwitcher,ViewSwitcher,ViewFlipper。

    通过源码可以知道TextSwitcher,ImageSwitcher其实就是严格限定子view是TextView和ImageView,同时提供更方便的函数来处理text或image。

    而ViewSwitcher限制子view个数不能超过2个,所以它只是两个view来回切换。

    而ViewFlipper就是本文的主角,它实现来定时切换功能。

    ViewFlipper

    ViewFlipper在ViewAnimator的基础上实现来定时切换的功能,我们可以设置切换时间。同时也支持开启自动切换。

    这样就正好用来实现我们的上下轮播功能。

    使用ViewFlipper切换时默认是瞬时的,但是因为它继承ViewAnimator,所以可以添加过渡动画,通过两个函数即可:

    flipper.setInAnimation(mContext, R.anim.in_bottom);
    flipper.setOutAnimation(mContext, R.anim.out_top);
    
    

    in_bottom是从底部飞入:

    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="300">
        <translate
            android:fromYDelta="100%p"
            android:toYDelta="0" />
        <alpha
            android:fromAlpha="0.0"
            android:toAlpha="1.0" />
    </set>
    
    

    out_top是从顶部飞出:

    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="300">
        <translate
            android:fromYDelta="0"
            android:toYDelta="-100%p" />
        <alpha
            android:fromAlpha="1.0"
            android:toAlpha="0.0" />
    </set>
    
    

    这样就实现了轮播动画。

    但是ViewFlipper或ViewAnimator没有任何关于切换的监听器,所以我们无法监听切换。有一个巧妙的方法可以简单的监听切换,就是在设置了Animation的前提下,通过监听动画来实现:

    flipper.getInAnimation().setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
                //do something
            }
    
            @Override
            public void onAnimationEnd(Animation animation) {
    
            }
    
            @Override
            public void onAnimationRepeat(Animation animation) {
    
            }
        });
    
    

    注意:上面代码必须设置了setInAnimation,否则会null指针异常。

    相关文章

      网友评论

          本文标题:Android如何实现轮播效果:ViewFlipper 和 Vi

          本文链接:https://www.haomeiwen.com/subject/nrqpedtx.html