• 1. Create a raw folder under the res of the project and place the three prepared videos in it

• 2. CustomVideoView provides a method for playing video in this custom View. The user only needs to pass in the playback path, and can play in a loop.

package cn.bluemobi.dylan.welcomevideopager; import android.content.Context; import android.media.MediaPlayer; import android.net.Uri; import android.util.AttributeSet; import android.view.View; import android.widget.VideoView; */ public class CustomVideoView extends VideoView {public class CustomVideoView extends VideoView {public CustomVideoView(Context context) { super(context); } public CustomVideoView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } public CustomVideoView(Context context, AttributeSet attrs) { super(context, attrs); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); setMeasuredDimension(View.MeasureSpec.getSize(widthMeasureSpec), View.MeasureSpec.getSize(heightMeasureSpec)); } public void playVideo(uri uri) {if (uri == null) {throw new IllegalArgumentException("Uri can not be null"); } /** Set the playback path **/ setVideoURI(uri); /** start(); setOnPreparedListener(new MediaPlayer.OnPreparedListener() { @Override public void onPrepared(MediaPlayer mp) { /** / mp.setlooping (true); }}); setOnErrorListener(new MediaPlayer.OnErrorListener() { @Override public boolean onError(MediaPlayer mp, int what, int extra) { return true; }}); }}Copy the code

• 3. Create a Fragment with no welcome page to load a custom video View

package cn.bluemobi.dylan.welcomevideopager; import android.net.Uri; import android.os.Bundle; import android.support.annotation.Nullable; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; /** * Created by yuandl on 2016-11-10. */ public class GuildFragment extends Fragment { private CustomVideoView customVideoView; @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { customVideoView = new CustomVideoView(getContext()); /** Get parameters, play different videos based on different parameters **/ int index = getArguments().getint ("index"); Uri uri; if (index == 1) { uri = Uri.parse("android.resource://" + getActivity().getPackageName() + "/" + R.raw.guide_1); } else if (index == 2) { uri = Uri.parse("android.resource://" + getActivity().getPackageName() + "/" + R.raw.guide_2); } else { uri = Uri.parse("android.resource://" + getActivity().getPackageName() + "/" + R.raw.guide_3); } / * * * * / customVideoView play video in playVideo (uri); return customVideoView; } @override public void onDestroy() {super.ondestroy (); if (customVideoView ! = null) { customVideoView.stopPlayback(); }}}Copy the code

• 4. Interface layout

    

    

        

        

        
    

    

Copy the code

• 5. Add fragments to the interface

package cn.bluemobi.dylan.welcomevideopager; import android.os.Bundle; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentPagerAdapter; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.widget.Button; import android.widget.ImageView; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { private ViewPager vp; private ImageView iv1; private ImageView iv2; private ImageView iv3; private Button bt_start; private List fragments; private void assignViews() { vp = (ViewPager) findViewById(R.id.vp); iv1 = (ImageView) findViewById(R.id.iv1); iv2 = (ImageView) findViewById(R.id.iv2); iv3 = (ImageView) findViewById(R.id.iv3); bt_start = (Button) findViewById(R.id.bt_start); } @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); assignViews(); initData(); initView(); Private void initData() {fragments = new ArrayList<>(); Fragment fragment1 = new GuildFragment(); Bundle bundle1 = new Bundle(); bundle1.putInt("index", 1); fragment1.setArguments(bundle1); fragments.add(fragment1); Fragment fragment2 = new GuildFragment(); Bundle bundle2 = new Bundle(); bundle2.putInt("index", 2); fragment2.setArguments(bundle2); fragments.add(fragment2); Fragment fragment3 = new GuildFragment(); Bundle bundle3 = new Bundle(); bundle3.putInt("index", 3); fragment3.setArguments(bundle3); fragments.add(fragment3); } /** * Private void initView() {vp.setoffScreenPagelimit (3); vp.setAdapter(new MyPageAdapter(getSupportFragmentManager())); vp.addOnPageChangeListener(new MyPageChangeListener()); } /** * ViewPager adapter */ private class MyPageAdapter extends FragmentPagerAdapter {public MyPageAdapter(FragmentManager) fm) { super(fm); } @Override public Fragment getItem(int position) { return fragments.get(position); } @Override public int getCount() { return fragments.size(); }} / listener * * * * ViewPager sliding page/private class MyPageChangeListener implements ViewPager. OnPageChangeListener {@ Override public void onPageScrolled(int position, float positionOffset, Int positionOffsetPixels) {} /** * Dynamically change the red dot according to the page and display the experience button on the last page ** @param position */ @override public void onPageSelected(int position) { bt_start.setVisibility(View.GONE); iv1.setImageResource(R.mipmap.dot_normal); iv2.setImageResource(R.mipmap.dot_normal); iv3.setImageResource(R.mipmap.dot_normal); if (position == 0) { iv1.setImageResource(R.mipmap.dot_focus); } else if (position == 1) { iv2.setImageResource(R.mipmap.dot_focus); } else { iv3.setImageResource(R.mipmap.dot_focus); bt_start.setVisibility(View.VISIBLE); } } @Override public void onPageScrollStateChanged(int state) { } } }Copy the code