仿制慕课网app实现斗鱼，全民k歌视频引导页（ViewVideoViewPaper）炫酷效果

在几个月前，我第一次玩全民k歌，下载完app，它弹出来的引导页吸引了我，不像以前的引导页一样千篇一律，而是用了视频的方式，用一种动态的方式来实现。在今天，我突然又想起了这个效果，就抽出了一点时间在网上也借鉴了一些人的想法自己写了一下这个炫酷的视频引导页。

现在我们先来看一下项目的结构，这样看代码来也比较清晰明朗。（我会在结尾把代码下载链接发出来）

。

页面超级简单，我就不贴代码出来，我们等会直接拿demo瞧一眼就好了。

我们理一下逻辑，在我们一般下载一个app的时候，只有第一次安装才会弹出引导页，第二次登录的话直接就是从 app的首页封面到app的主页面去了。所以我们肯定要有个东西要来记住我们是不是第一次打开这个app。所以这个类我们思路就好了。

start_activity.class

package com.android.mooc.activity;

import com.android.mooc.R;

import android.app.Activity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.content.SharedPreferences.Editor;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.support.annotation.Nullable;

public class start_activity extends Activity {
	private boolean isFirstIn = false;// 判断是否是第一次启动
	private static final int Time = 2000;
	private static final int Go_Home = 1000;
	private static final int Go_Guide = 1001;
	 //在主线程中做 延时操作是不合理的，可以使用handler
    Handler mHandler = new Handler(){
        public void handleMessage(Message msg) {
            switch (msg.what) {
            case Go_Home:
            	gotoMainActivity();
            	finish();
                break;
            case Go_Guide:
            	gotoGuideActivity();
            	finish();
                break;
            }
        };
    };
	protected void onCreate(@Nullable Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.start_activity);
		initData();
	}

	private void initData() {
		 SharedPreferences preferences = getSharedPreferences("nzx", MODE_PRIVATE);
	        //先去取isFirstI的值，如果没有，表明是第一次取，第一次取肯定是true
	        isFirstIn = preferences.getBoolean("isFirstIn", true); 
	        //通过isFirstIn选择启动哪个页面，再将新boolean值存入SharedPreferences
	        if(isFirstIn){
	            mHandler.sendEmptyMessageDelayed(Go_Guide, Time);  //制定多少毫秒后发送空消息，第一个参数是一个int what值
	            Editor editor = preferences.edit();
	            editor.putBoolean("isFirstIn", false);
	            editor.commit();
	        }else{
	            mHandler.sendEmptyMessageDelayed(Go_Home, Time);
	        }
	}

	private void gotoMainActivity() {

		Intent intent = new Intent(start_activity.this, appActivity.class);
		startActivity(intent);
		finish();
	}

	private void gotoGuideActivity() {
		start_activity.this.startActivity(new Intent(start_activity.this,
				MainActivity.class));
		finish();
	}
}

发现字有点小。

这个时候，我们就需要跳到我们的视频引导页去了。我们首先把每个引导页写到一个适配器才好一起管理。我们先贴出一个视频引导页的代码了，因为其他两个也是一样，为了不繁冗，一个就好了。

GuideOneFragmen.class

package com.android.mooc.fragment;
import com.android.mooc.R;
import com.android.mooc.view.MCVideoView;

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;

public class GuideOneFragment extends Fragment{
	private MCVideoView videoView;
	@Override
	public View onCreateView(LayoutInflater inflater,
			@Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
		View view=inflater.inflate(R.layout.fragment_guideone, null, false);
		initView(view);
		return view;
	}

	@Override
	public void onActivityCreated(@Nullable Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState) if(videoView!=null){
			videoView.playVideo(getActivity(), Uri.parse("android.resource://"+getActivity().getPackageName()+"/"+R.raw.guide_1));
		}
	}

	private void initView(View view) {
		videoView=(MCVideoView) view.findViewById(R.id.videoView);
	}

	@Override//重复播放
	public void onDestroy() {
		super.onDestroy();
		if(videoView!=null){
			videoView.stopPlayback();
		}
	}
}

videoView.playVideo(getActivity(), Uri.parse("android.resource://"+getActivity().getPackageName()+"/"+R.raw.guide_1));

这段代码就是我们从我们的res 目录下解析我们的视频文件下来

适配器方面就跟我们平常写listview适配器一样继承重写方法。

GuideFragmentPagerAdapter （适配器类）

package com.android.adapter.Adapter;
import java.util.List;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class GuideFragmentPagerAdapter extends FragmentPagerAdapter{
	public List<Fragment> list;
	public GuideFragmentPagerAdapter(FragmentManager fm, List<Fragment> list) {
		super(fm);
		this.list=list;
	}

	@Override
	public Fragment getItem(int arg0) {
		return list.get(arg0);
	}

	@Override
	public int getCount() {
		return list.size();
	}

}

很多人在想，那视频类呢在哪里呢，它是怎么实现的呢，很简单。

MCVideoView.Class

package com.android.mooc.view;

import android.content.Context;
import android.media.MediaPlayer;
import android.media.MediaPlayer.OnErrorListener;
import android.media.MediaPlayer.OnPreparedListener;
import android.net.Uri;
import android.util.AttributeSet;
import android.view.View;
import android.widget.VideoView;

public class MCVideoView extends VideoView{

	public MCVideoView(Context context) {
		this(context,null);
	}

	public MCVideoView(Context context, AttributeSet attrs) {
		super(context, attrs,0);
	}

	public MCVideoView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}

	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		super.onMeasure(widthMeasureSpec, heightMeasureSpec);
		setMeasuredDimension(View.MeasureSpec.getSize(widthMeasureSpec), View.MeasureSpec.getSize(heightMeasureSpec));
	}

	public void playVideo(Context context,Uri uri){
		if(uri==null){
			throw new IllegalArgumentException("Uri can not be null");
		}
		//设置播放路径
		setVideoURI(uri);
		//开始播放
		start();
		setOnPreparedListener(new OnPreparedListener() {

			@Override
			public void onPrepared(MediaPlayer mp) {
				//设置循环播放
				mp.setLooping(true);	
			}
		});
		setOnErrorListener(new OnErrorListener() {

			@Override
			public boolean onError(MediaPlayer mp, int what, int extra) {
				return true;
			}
		});
	}
}

冲的来说就是继承VideoView 实现他的构造方法，设置播放路径设置一些基本属性就ok了

现在就是有一点逻辑的时候了，怎么让每个视频页下面有一个红点，不是当前播放的页就没有红点呢。

MainActivity.class

package com.android.mooc.activity;

import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.os.Handler;

import com.android.adapter.Adapter.GuideFragmentPagerAdapter;
import com.android.mooc.R;
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.v4.view.ViewPager.OnPageChangeListener;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.ImageView;

import com.android.mooc.fragment.GuideOneFragment;
import com.android.mooc.fragment.GuideThreeFragment;
import com.android.mooc.fragment.GuideTwoFragment;

/**
 * 高仿慕课网动画
 * 
 * @author nzx
 * 
 */
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
	private ViewPager viewPager;
	private List<Fragment> list = new ArrayList<>();
	private GuideOneFragment guideOneFragment;
	private GuideTwoFragment guideTwoFragment;
	private GuideThreeFragment guideThreeFragment;
	private GuideFragmentPagerAdapter adapter;
	private Button btn_login;
	 private ImageView[] indicationPoint;//指示点控件
	private boolean isFirst;//判断是否是第一次启动
	private Handler handler;
	private int[] points = {R.id.point1,R.id.point2,R.id.point3};
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
				WindowManager.LayoutParams.FLAG_FULLSCREEN);
		/**
		 * 设置窗体全屏getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN
		 * , WindowManager.LayoutParams.FLAG_FULLSCREEN);
		 */
		/***
		 * //设置窗体始终点亮
		 * getWindow().setFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON,
		 * WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON); //设置窗体背景模糊
		 * getWindow().setFlags(WindowManager.LayoutParams.FLAG_BLUR_BEHIND,
		 * WindowManager.LayoutParams.FLAG_BLUR_BEHIND);
		 */
		setContentView(R.layout.activity_main);
		init();
		initView();
		initDots();

	}

	public void init() {
		btn_login = (Button) findViewById(R.id.btn_login);
		viewPager = (ViewPager) findViewById(R.id.viewPager);
		btn_login.setOnClickListener(this);
        indicationPoint = new ImageView[list.size()];
        //实例化每个指示点控件
        for (int i=0; i<list.size(); i++) {
            indicationPoint[i] = (ImageView) findViewById(points[i]);
        }
	}

	public void initView() {
		// 设置viewpaper的页数
		viewPager.setOffscreenPageLimit(3);
		//加载我们的视频页
		if (guideOneFragment == null) {
			guideOneFragment = new GuideOneFragment();
			list.add(guideOneFragment);
		}
		if (guideTwoFragment == null) {
			guideTwoFragment = new GuideTwoFragment();
			list.add(guideTwoFragment);
		}
		if (guideThreeFragment == null) {
			guideThreeFragment = new GuideThreeFragment();
			list.add(guideThreeFragment);
		}
		adapter = new GuideFragmentPagerAdapter(getSupportFragmentManager(),
				list);
		viewPager.setAdapter(adapter);
	}
		//初始化dots方法中，找到了每一个dots的对象，相当于一个个find出来，但对于大型数据用两个数组的方式更好
	    private void initDots(){
	    	indicationPoint = new ImageView[list.size()];
	        for(int i =0; i<list.size(); i++){
	        	indicationPoint[i]= (ImageView) findViewById(points[i]);
	        }
	    
		viewPager.setOnPageChangeListener(new OnPageChangeListener() {

			@Override
			public void onPageSelected(int position) {
				if (position == 2) {
					btn_login.setVisibility(View.VISIBLE);
				} else {
					btn_login.setVisibility(View.GONE);
				}
				for (int i = 0; i < indicationPoint.length; i++) {
					if (position==i) {
						/**被选中是红点*/
						indicationPoint[i].setImageResource(R.drawable.msg_update);
					}else {
						indicationPoint[i].setImageResource(R.drawable.person_item_point);
					}
					
				}
				
			}

			@Override
			public void onPageScrolled(int arg0, float arg1, int arg2) {

			}

			@Override
			public void onPageScrollStateChanged(int arg0) {
			}
		});
	}

		@Override
		public void onClick(View v) {
			// TODO Auto-generated method stub
			switch (v.getId()) {
			case R.id.btn_login:
				MainActivity.this.startActivity(new Intent(MainActivity.this, appActivity.class));
				finish();
				break;

			default:
				break;
			}
		}

    

}

这些就是我们大概的代码了，大家先看一下大概的逻辑在来看代码。在去拿demo去看，然后跟着自己的逻辑走一遍代码，有时间的可以自己敲一下，也可以直接套过去使用。

不懂的地方可以加我674939877也可以加群 166120952 有什么不懂有大神可以教你。demo就在下面。http://download.csdn.net/detail/ningzhouxu/9618216

仿制慕课网app实现斗鱼，全民k歌视频引导页（ViewVideoViewPaper）炫酷效果

android 支付寶第三方支付

用print在canvas自定義View實現飄雪花，多色雪花功能。

仿製慕課網app實現鬥魚，全民k歌視頻引導頁（ViewVideoViewPaper）炫酷效果

android intent的跳轉,頁面傳值

基於SlipButton教你如何實現ios7的選擇器效果

Mac下配置sublime實現LaTeX

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結