Android视频播放引导页

看着别人家的App有的打开是视频引导页，那是一个羡慕啊，特别是有美女的情况下，这样的直播App能不常常打开看看吗。我也想要这样的效果。那就来吧，来就来吧，就顺手写了一个。

废话少说，放码过来 github代码地址

先上效果图，由于gif限制5M大小，所以只裁剪了部分演示：

演示

1376328-0)]

制作流程：

1.使用3个fragment播放对应的视频，从主页面将视频ResId传过去。

    private void init() {
        vpGuide.setOffscreenPageLimit(4);
        for (int i = 0; i < videoRes.length; i++) {
            GuidePagerFragment fragment = new GuidePagerFragment();
            Bundle bundle = new Bundle();
            bundle.putInt("res", videoRes[i]);
            bundle.putInt("page", i);
            fragment.setArguments(bundle);
            fragments.add(fragment);
        }
        pagerAdapter = new FmPagerAdapter(fragments, getSupportFragmentManager());
        vpGuide.setAdapter(pagerAdapter);

        tvEnter.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //进入主页面
            }
        });

        initDot();
    }

2.大家经常写的功能，initDot()创建变化的小圆点，循环创建view添加到一个Linearlayout中;滑动viewpager切换对应小圆点。

   private void initDot() {
        params1 = new LinearLayout.LayoutParams(dip2px(getApplicationContext(),7),dip2px(getApplicationContext(),7));
        params1.leftMargin = dip2px(getApplicationContext(),15);
        params2 = new LinearLayout.LayoutParams(dip2px(getApplicationContext(),10),dip2px(getApplicationContext(),10));
        params2.leftMargin = dip2px(getApplicationContext(),15);
        View dot;
        for (int i = 0; i < videoRes.length; i++) {
            dot = new View(this);
            if (i == 0) {
                dot.setLayoutParams(params2);
                dot.setBackgroundResource(R.drawable.dot_focus);
            } else {
                dot.setLayoutParams(params1);
                dot.setBackgroundResource(R.drawable.dot_unfocus);
            }
            llDot.addView(dot);
        }
    }

    private void setCurrentdot(int position) {
        for (int i = 0; i < llDot.getChildCount(); i++) {
            View dot = llDot.getChildAt(i);
            if (i == position) {
                dot.setLayoutParams(params2);
                dot.setBackgroundResource(R.drawable.dot_focus);
            } else {
                dot.setLayoutParams(params1);
                dot.setBackgroundResource(R.drawable.dot_unfocus);
            }

        }
    }

    private void setPageChange() {
        vpGuide.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                setCurrentdot(position);
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
    }

3.打开对应fragment就进行播放视频，切换页面就停止播放。onCompletion()回调是当前视频播放完成的回调，然后自动切换到下一页。

public class GuidePagerFragment extends LazyLoadFragment implements MediaPlayer.OnPreparedListener, MediaPlayer.OnCompletionListener {

    private VideoView videoviewGuide;
    private int curPage;
    private boolean mHasPaused;

    @Override
    protected int setContentView() {
        return R.layout.fragment_guide_pager;
    }

    @Override
    protected void stopLoad() {
        super.stopLoad();
        if (videoviewGuide != null) {
            videoviewGuide.stopPlayback();
        }
    }

    @Override
    public void onDestroyView() {
        super.onDestroyView();
        ButterKnife.unbind(this);
    }

    @Override
    protected void lazyLoad() {
        if (getArguments() == null) {
            return;
        }
        videoviewGuide = findViewById(R.id.videoview_guide);
        int videoRes = getArguments().getInt("res");
        curPage = getArguments().getInt("page");
        videoviewGuide.setOnPreparedListener(this);
        videoviewGuide.setVideoPath("android.resource://" + getActivity().getPackageName() + "/" + videoRes);

    }

    @Override
    public void onPrepared(MediaPlayer mp) {
        if (videoviewGuide != null) {
            videoviewGuide.requestFocus();
            videoviewGuide.seekTo(0);
            videoviewGuide.start();
            videoviewGuide.setOnCompletionListener(this);
        }
        return;
    }

    @Override
    public void onResume() {
        super.onResume();
        if (mHasPaused) {
            if (videoviewGuide != null) {
                videoviewGuide.seekTo(curPage);
                videoviewGuide.resume();
            }
        }
        return;
    }

    @Override
    public void onPause() {
        super.onPause();
        if (videoviewGuide != null) {
            curPage = videoviewGuide.getCurrentPosition();
        }
        mHasPaused = true;
    }

    public void onDestroy() {
        super.onDestroy();
        if (videoviewGuide != null) {
            videoviewGuide.stopPlayback();
        }
        return;
    }

    @Override
    public void onCompletion(MediaPlayer mp) {
        ((GuidePagerActivity)getActivity()).next(curPage);
    }
}

这里用到了懒加载fragment，如果不用的话，刚进入多个视频就会同时播放，再切换都不知道后面进度播到天高皇帝远了。第一次进入不会同时播放多个。调用系统方法getUserVisibleHint()，视图对当加用户是显示状态，返回true。才可以进行数据加载。

public abstract class LazyLoadFragment extends Fragment {
    /**
     * 视图是否已经初初始化
     */
    protected boolean isInit = false;
    protected boolean isLoad = false;
    protected final String TAG = "LazyLoadFragment";
    private View view;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        view = inflater.inflate(setContentView(), container, false);
        isInit = true;
        /**初始化的时候去加载数据**/
        isCanLoadData();
        return view;
    }

    /**
     * 视图是否已经对用户可见，系统的方法
     */
    @Override
    public void setUserVisibleHint(boolean isVisibleToUser) {
        super.setUserVisibleHint(isVisibleToUser);
        isCanLoadData();
    }

    /**
     * 是否可以加载数据
     * 可以加载数据的条件：
     * 1.视图已经初始化
     * 2.视图对用户可见
     */
    private void isCanLoadData() {
        if (!isInit) {
            return;
        }

        if (getUserVisibleHint()) {
            lazyLoad();
            isLoad = true;
        } else {
            if (isLoad) {
                stopLoad();
            }
        }
    }

    /**
     * 视图销毁的时候讲Fragment是否初始化的状态变为false
     */
    @Override
    public void onDestroyView() {
        super.onDestroyView();
        isInit = false;
        isLoad = false;

    }

    protected void showToast(String message) {
        if (!TextUtils.isEmpty(message)) {
            Toast.makeText(getContext(), message, Toast.LENGTH_SHORT).show();
        }

    }

    /**
     * 设置Fragment要显示的布局
     *
     * @return 布局的layoutId
     */
    protected abstract int setContentView();

    /**
     * 获取设置的布局
     *
     * @return
     */
    protected View getContentView() {
        return view;
    }

    /**
     * 找出对应的控件
     *
     * @param id
     * @param <T>
     * @return
     */
    protected <T extends View> T findViewById(int id) {

        return (T) getContentView().findViewById(id);
    }

    /**
     * 当视图初始化并且对用户可见的时候去真正的加载数据
     */
    protected abstract void lazyLoad();

    /**
     * 当视图已经对用户不可见并且加载过数据，如果需要在切换到其他页面时停止加载数据，可以调用此方法
     */
    protected void stopLoad() {
    }
}