这次的目标是实现一个能够播放视频的轮播器,即每个页面都能放置视频且能随页面的切换实现视频的切换。这个需求类似于在ListView中实现小视频的播放和切换,核心内容是怎么将视频播放器与控件的状态变化连接在一起。
实现思路
- 使用 ViewPager 进行轮播
- 使用 MediaPlayer 对视频进行播放
- 使用 TextureView 展示视频界面
具体实现
为了提高性能,当然不能为每一页配置一个 MediaPlayer 用来播放视频,那么最好的解决方法是当页面切换时切换 MediaPlayer 的播放源。利用 ViewPager.OnPageChangeListener
监听轮播器的页面切换。
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
if (first && positionOffset == 0 && positionOffsetPixels == 0) {
onPageSelected(position);
first = false;
}
}
@Override
public void onPageSelected(int position) {
//从缓存的视图中找到当前视图并传递给扩展的MediaPlayer进行控制
View view = cacheView.get(position);
mMediaPlayer.playWithVideoLayout(view);
}
@Override
public void onPageScrollStateChanged(int state) {
}
在每一页的 view 中需要有 TextureView 用来显示视频界面,同时利用 TextureView.SurfaceTextureListener
监听当前TextureView的可用性。SurfaceTextureListener接口用于让TextureView的使用者知道SurfaceTexture已准备好,这样就可以把SurfaceTexture交给相应的内容源。
TextureView可用于承载显示『数据流』的场合,之前看到『流』不太明确其意义,这里给两个具体的场景大家体会一下:camera模块从sensor采集了1080p@30fps的预览数据『流』,视频通话模块从网络包里解出实时视频数据『流』。
public class VpVideoView extends TextureView implements TextureView.SurfaceTextureListener, MediaPlayer.OnVideoSizeChangedListener {
//some params
private Uri mSource;//视频源
private Surface surface;//用于承接播放器
private VPMediaPlayer mediaPlayer;//视频播放器
// some methods
public void setMediaPlayer(VPMediaPlayer mediaPlayer) {
this.mediaPlayer = mediaPlayer;
}
public void initSource(String videoPath) {
mSource = Uri.parse(videoPath);
}
public void setSeekProgress(int seekProgress) {
this.seekProgress = seekProgress;
}
@Override
protected void onDetachedFromWindow() {
// release resources on detach
super.onDetachedFromWindow();
}
/*
* TextureView.SurfaceTextureListener
*/
@Override
public void onSurfaceTextureAvailable(SurfaceTexture surfaceTexture, int width, int height) {
if (mSource == null) return;
surface = new Surface(surfaceTexture);
if (mediaPlayer != null) {
mediaPlayer.replayWithCurrentLayout();
}
}
@Override
public void onSurfaceTextureSizeChanged(SurfaceTexture surface, int width, int height) {
}
@Override
public boolean onSurfaceTextureDestroyed(SurfaceTexture surface) {
if (mediaPlayer != null) {
mediaPlayer.pause();
}
return true;
}
@Override
public void onSurfaceTextureUpdated(SurfaceTexture surface) {
}
@Override
public void onVideoSizeChanged(MediaPlayer mp, int width, int height) {
mVideoHeight = mp.getVideoHeight();
mVideoWidth = mp.getVideoWidth();
updateViewViewSize();
updateTextureViewSizeCenter();
}
/**
* 让控件大小适配视频大小
*/
private void updateViewViewSize() {
float sx = (float) getMeasuredWidth() / (float) mVideoWidth;
int height = (int) (sx * mVideoHeight);
setMeasuredDimension(MeasureSpec.makeMeasureSpec(getMeasuredWidth(), MeasureSpec.EXACTLY),
MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY));
postInvalidate();
}
//重新计算video的显示位置,让其全部显示并据中
private void updateTextureViewSizeCenter() {
float sx = (float) getMeasuredWidth() / (float) mVideoWidth;
float sy = (float) getMeasuredHeight() / (float) mVideoHeight;
Matrix matrix = new Matrix();
//第1步:把视频区移动到View区,使两者中心点重合.
matrix.preTranslate((getMeasuredWidth() - mVideoWidth) / 2, (getMeasuredHeight() - mVideoHeight) / 2);
//第2步:因为默认视频是fitXY的形式显示的,所以首先要缩放还原回来.
matrix.preScale(mVideoWidth / (float) getMeasuredWidth(), mVideoHeight / (float) getMeasuredHeight());
//第3步,等比例放大或缩小,直到视频区的一边和View一边相等.如果另一边和view的一边不相等,则留下空隙
if (sx >= sy) {
matrix.postScale(sy, sy, getMeasuredWidth() / 2, getMeasuredHeight() / 2);
} else {
matrix.postScale(sx, sx, getMeasuredWidth() / 2, getMeasuredHeight() / 2);
}
setTransform(matrix);
postInvalidate();
}
}
这个类主要有以下几个功能:(1)使用Texture来展示视频流;(2)记录视频源和播放进度(注意当view被销毁时进度也会重置,所有如果需要进度不随ViewPager的缓存机制影响要另做保存);(3)利用 MediaPlayer.OnVideoSizeChangedListener
调整视频长与宽;(4)利用 SurfaceTextureListener
监听TextureView是否可用。当判断可用时开始启动MediaPlayer播放视频。
在另一方面,需要对MediaPlayer做一些处理,以便做视频的切换播放。
public class VPMediaPlayer extends MediaPlayer implements
MediaPlayer.OnCompletionListener,
MediaPlayer.OnErrorListener,
MediaPlayer.OnPreparedListener {
//some params
public VPMediaPlayer(SimpleViewPager simpleViewPager) {
this.simpleViewPager = simpleViewPager;
setLooping(false);
setOnPreparedListener(this);
setOnCompletionListener(this);
setOnErrorListener(this);
}
//some methods
@Override
public void start() throws IllegalStateException {
super.start();
seekTo(videoView.getSeekProgress());
}
public void playWithVideoLayout() {
isScrolling = false;
try {
reset();
setOnVideoSizeChangedListener(videoView);
setDataSource(videoView.getContext(), videoView.getmSource());
setSurface(videoView.getSurface());
prepareAsync();
} catch (NullPointerException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
}
public void replayWithCurrentLayout() {
simpleViewPager.stopAutoScroll();
isScrolling = false;
try {
reset();
setOnVideoSizeChangedListener(videoView);
setDataSource(videoView.getContext(), videoView.getmSource());
setSurface(videoView.getSurface());
prepareAsync();
} catch (NullPointerException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
}
public void pauseCurrentVideoLayout() {
simpleViewPager.startAutoScroll(true);
isScrolling = true;
}
@Override
public void pause() throws IllegalStateException {
super.pause();
if (videoView != null) {
videoView.setSeekProgress(getCurrentPosition());
}
}
@Override
public void onCompletion(MediaPlayer mp) {
simpleViewPager.startAutoScroll(true);
isScrolling = true;
}
@Override
public boolean onError(MediaPlayer mp, int what, int extra) {
simpleViewPager.startAutoScroll(true);
isScrolling = true;
reset();
return false;
}
@Override
public void onPrepared(MediaPlayer mp) {
start();
}
public boolean isScrolling() {
return isScrolling;
}
}
VPMediaPlayer 主要处理一些播放器的逻辑,主要功能包括:(1)提供视频的播放暂停功能;(2)能够在视频播放结束后自动切换到下一页。
结束语
整个部分暂时没有添加视频控制的功能和UI,但有了主要的核心代码其他的功能添加起来应该都是水到渠成的事。