用viewpager實現圖片與視訊混輪播
阿新 • • 發佈:2018-12-11
主要參考https://blog.csdn.net/chengxu_hou/article/details/78144607
不同之處在於我用的 JCVideoPlayer播放視訊,參考的博主用的是VideoView播放視訊的,主要邏輯與思路,參考上篇部落格博主。
程式碼其實不難理解:禁用了ViewPager的預載入模式,重寫了一下viewPager,利用Handler與ViewPager實現輪播,Timer定時,Handler實現更新UI。
下面直接上程式碼:
public class TestActivity extends BaseActivity { private static final intUPTATE_VIEWPAGER = 0; public ViewPagers mViewPager; private List<BannerModel> list; private BannerViewAdapter mAdapter; private int autoCurrIndex = 0;//設定當前 第幾個圖片 被選中 private Timer timer; private TimerTask timerTask; private long period = 5000;//輪播圖展示時長,預設5秒 //定時輪播圖片,需要在主執行緒裡面修改UI private Handler mHandler = new Handler() { public void handleMessage(Message msg) { switch (msg.what) { case UPTATE_VIEWPAGER: if (msg.arg1 != 0) { mViewPager.setCurrentItem(msg.arg1); } else { //false當從末頁調到首頁時,不顯示翻頁動畫效果, mViewPager.setCurrentItem(msg.arg1, false); } break; } } }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_test); ButterKnife.bind(this); mViewPager = findViewById(R.id.viewPager); initData(); } /** * 廣告輪播圖測試資料 */ public void initData() { list = new ArrayList<>(); for (int i = 0; i < 6; i++) { BannerModel listBean = new BannerModel(); if (i == 1 || i == 3 || i== 5) { listBean.setBannerName("動畫片"); // listBean.setBannerUrl("http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"); listBean.setBannerUrl("http://vodfile1.0086org.com/UF/vod/201805/1116/9814/3222510/ios/1805071131507290.mp4"); listBean.setPlayTime(27000); listBean.setUrlType(1);//圖片型別 視訊 list.add(listBean); }else{ listBean.setBannerName("廣告"); listBean.setBannerUrl("http://pic11.nipic.com/20101201/4452735_182232064453_2.jpg"); listBean.setPlayTime(2000); listBean.setUrlType(0);//圖片型別 圖片 list.add(listBean); } } period = list.get(0).getPlayTime(); autoBanner(); } private void autoBanner(){ mViewPager.setOffscreenPageLimit(0); mAdapter = new BannerViewAdapter(this,list); mViewPager.setAdapter(mAdapter); mViewPager.setOnPageChangeListener(new ViewPagers.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { autoCurrIndex = position;//動態設定輪播圖每一頁的停留時間 period = list.get(position).getPlayTime(); if (timer != null) {//每次改變都需要重新建立定時器 timer.cancel(); timer = null; timer = new Timer(); if (timerTask != null) { timerTask.cancel(); timerTask = null; createTimerTask(); } timer.schedule(timerTask, period, period); } } @Override public void onPageScrollStateChanged(int state) { } }); createTimerTask();//建立定時器 timer = new Timer(); timer.schedule(timerTask, 5000, period); } public void createTimerTask(){ timerTask = new TimerTask() { @Override public void run() { Message message = new Message(); message.what = UPTATE_VIEWPAGER; if (autoCurrIndex == list.size() - 1) { autoCurrIndex = -1; } message.arg1 = autoCurrIndex + 1; mHandler.sendMessage(message); } }; } @Override protected void onResume() { super.onResume(); } protected void onPause() { super.onPause(); } @Override protected void onDestroy() { super.onDestroy(); if (timerTask != null) { timerTask.cancel(); timerTask = null; } if (timer != null) { timer.cancel(); timer = null; } } }
public class BannerViewAdapter extends PagerAdapter { private Context context; private List<BannerModel> listBean; public BannerViewAdapter(Activity context, List<BannerModel> list) { // this.context = context.getApplicationContext(); this.context = context; if (list == null || list.size() == 0) { this.listBean = new ArrayList<>(); } else { this.listBean = list; } } @Override public Object instantiateItem(final ViewGroup container, final int position) { if (listBean.get(position).getUrlType() == 0) {//圖片 final ImageView imageView = new ImageView(context); Glide.with(context).load(listBean.get(position).getBannerUrl()) // .skipMemoryCache(true) .into(imageView); container.addView(imageView); return imageView; } else {//視訊 // final VideoView videoView = new VideoView(context); // videoView.setVideoURI(Uri.parse(listBean.get(position).getBannerUrl())); // //開始播放 // videoView.start(); // container.addView(videoView); JCVideoPlayerStandard jcVideoPlayer = new JCVideoPlayerStandard(context); jcVideoPlayer.setUp(listBean.get(position).getBannerUrl() , JCVideoPlayerStandard.SCREEN_LAYOUT_NORMAL, "不信"); Glide.with(context) .load("http://img4.jiecaojingxuan.com/2016/11/23/[email protected]!640_360") .into(jcVideoPlayer.thumbImageView); jcVideoPlayer.prepareMediaPlayer(); container.addView(jcVideoPlayer); return jcVideoPlayer; } } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView((View) object); } @Override public int getCount() { return listBean.size(); } @Override public boolean isViewFromObject(View view, Object object) { return view == (View) object; } }
public class BannerModel { private String bannerName; private String bannerUrl; private int playTime;//播放時長 private int urlType;//型別:0圖片、1視訊 public String getBannerName() { return bannerName; } public void setBannerName(String bannerName) { this.bannerName = bannerName; } public String getBannerUrl() { return bannerUrl; } public void setBannerUrl(String bannerUrl) { this.bannerUrl = bannerUrl; } public int getPlayTime() { return playTime; } public void setPlayTime(int playTime) { this.playTime = playTime; } public int getUrlType() { return urlType; } public void setUrlType(int urlType) { this.urlType = urlType; } }
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <com.xgh.app.activity.viewpager.ViewPagers android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="wrap_content"> </com.xgh.app.activity.viewpager.ViewPagers> </LinearLayout>
ViewPagers是重新的ViewPager,與v4包的ViewPager只有一點不一樣,就是
private static final int DEFAULT_OFFSCREEN_PAGES = 0;//預設是1,這裡直接改為0
v4包的ViewPager直接複製一遍,將這裡改掉,extend使用即可。
好了,親測好使。