Android控件之ViewFlipper视图View复用

ViewFlipper介绍

 1. Android自带控件；
 2. 多页面管理控件，且可自动播放；

与ViewPager区别

  1. ViewPager是一页页的，而ViewFlipper则是一层层的;
  2. ViewPager通常用于类似引导页，ViewFlipper通常用于上下翻滚；

ViewFlipper源码位置

~/android-sdk-macosx/sources/android-30/android/widget

ViewFlipper继承结构

package android.widget;
...
import android.widget.RemoteViews.RemoteView;
...
@RemoteView
public class ViewFlipper extends ViewAnimator {
    ...
}
package android.widget;
...
public class ViewAnimator extends FrameLayout {
    ...
}

ViewFlipper是ViewAnimator的子类，而ViewAnimator又是继承自FrameLayout，FrameLayout就是平时基本上只显示一个子视图的布局。ViewFlipper调用addView(View view)添加视图组件，一旦向ViewFlipper中添加了多个视图组件之后，ViewFlipper可使用动画控制实现多个视图的切换效果。

常用函数介绍

• startFlipping
  开始执行追加的View间的切换
• stopFlipping
  停止执行追加的View间的切换
• setFlipInterval
  设置View之间切换的时间间隔，单位是毫秒。
• isFlipping
  判断是否执行View间的切换
• setAutoStart
  设置是否自动开启View间的切换
• isAutoStart
  判断是否为自动开始浏览

视图View复用

思考：
自定义View，或者是ViewFlipper的子类，主要是将ViewFlipper的子视图总数设置为2，这样可以实现翻滚动效。
如何保持ViewFlipper的子视图的总数为2呢？每次获取下一个子视图之前，将第二个子视图移除掉，重新通过addView(View view)追加到ViewFlipper，并且指定在第一个位置(索引为0)，接下来就可以设置期望展示的动效，并直接切换到第一个子视图。

    /**
     * 子视图的总个数
     */
    public static final int COUNT_CHILD_VIEW = 2;

    /**
     * 处理ViewFlipper中的视图
     */
    private void next() {
        // 获取子View个数，这里返回是2，因为我们就追加了2个视图
        int childCount = mViewFlipper.getChildCount();
        // 其实这里获取到子视图个数就是2，因为前面我们追加的视图个数最多就是2个
        if (COUNT_CHILD_VIEW == childCount) {
            // 移除最后一个视图，这里返回子View总数还有1个
            mViewFlipper.removeViewAt(childCount - 1);
        }
        // 获取下一个子视图
        View view = getNextView();
        if (view == null) {
            return;
        }
        // 将下一个子视图插入到第一个位置，该子视图的父类就是ViewFlipper
        mViewFlipper.addView(view, 0);
        // 获取子View个数，这里返回是2，因为刚插入了一个子视图
        childCount = mViewFlipper.getChildCount();
        if (0 != childCount) {
            // 进来动画
            mViewFlipper.setInAnimation(getContext(), R.anim.slide_in_vertical);
            // 离开动画
            mViewFlipper.setOutAnimation(getContext(), R.anim.slide_out_vertical);
            // 直接显示刚刚插入第一个位置的子视图
            mViewFlipper.setDisplayedChild(0);
        }
    }

实现ViewFlpper视图复用的关键代码

    private RyderViewFlipper mViewFlipper;
    /**
     * 数据源
     */
    private List mDataSource;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mViewFlipper = findViewById(R.id.container_view_flipper);
        mDataSource = new ArrayList<>();
        for (int i = 0; i < 1000 ; i++) {
            mDataSource.add("第" + i + "张");
        }
        mViewFlipper.setDataSource(mDataSource);
    }

/**
 * @ClassName: RyderViewFliper
 * @Author: RyderWang
 * @Date: 2021/4/26 23:05
 * @Description:
 */
public class RyderViewFlipper extends LinearLayout {

    ...

    @Override
    public View getNextView() {
        if (mDataSource == null || mDataSource.size() == 0) {
            return null;
        }
        mCurrentIndex++;
        mCurrentIndex = mCurrentIndex % mDataSource.size();
        return getItemView(mDataSource.get(mCurrentIndex));
    }

    @Override
    public View getPreviousView() {
        if (mDataSource == null || mDataSource.size() == 0) {
            return null;
        }
        mCurrentIndex--;
        if (mCurrentIndex < 0) {
            mCurrentIndex = mDataSource.size() - 1;
        }
        return getItemView(mDataSource.get(mCurrentIndex));
    }

    private Runnable mScrollRunnable = new Runnable() {
        @Override
        public void run() {
            if (isStop) {
                return;
            }
            next();
            mHandler.postDelayed(mScrollRunnable, SCROLL_DURATION);
        }
    };
    ...
}

具体用法可见demo，效果图自行运行吧

源码下载直达点击