Video三种播放方式

1、使用其自带的播放器。指定Action为ACTION_VIEW,Data为Uri,Type为其MIME类型。

2、使用VideoView来播放。在布局文件中使用VideoView结合MediaController来实现对其控制。

3、使用MediaPlayer类和SurfaceView来实现。这种方式最灵活,也最复杂。

1、调用其自带的播放器:

Uri uri = Uri.parse(Environment.getExternalStorageDirectory().getPath()+"/Test_Movie.m4v");//调用系统自带的播放器
Intent intent = new Intent(Intent.ACTION_VIEW);
intent.setDataAndType(uri, "video/mp4");
startActivity(intent);


2、使用VideoView来实现:

Uri uri = Uri.parse(Environment.getExternalStorageDirectory().getPath()+"/Test_Movie.m4v");
VideoView videoView = (VideoView)this.findViewById(R.id.video_view);
videoView.setMediaController(new MediaController(this));
videoView.setVideoURI(uri);
//videoView.start();
videoView.requestFocus();


3、使用MediaPlayer:

/**
* 该实例中使用MediaPlayer完成播放,同时界面使用SurfaceView来实现
*
* 这里我们实现MediaPlayer中很多状态变化时的监听器
*
* 使用Mediaplayer时,也可以使用MediaController类,但是需要实现MediaController.mediaController接口
* 实现一些控制方法。
*
* 然后,设置controller.setMediaPlayer(),setAnchorView(),setEnabled(),show()就可以了,这里不再实现
* @author Administrator
*
*/
public class VideoSurfaceDemo extends Activity implements OnCompletionListener,OnErrorListener,OnInfoListener,
OnPreparedListener, OnSeekCompleteListener,OnVideoSizeChangedListener,SurfaceHolder.Callback{
private Display currDisplay;
private SurfaceView surfaceView;
private SurfaceHolder holder;
private MediaPlayer player;
private int vWidth,vHeight;
//private boolean readyToPlay = false;


public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
this.setContentView(R.layout.video_surface);


surfaceView = (SurfaceView)this.findViewById(R.id.video_surface);
//给SurfaceView添加CallBack监听
holder = surfaceView.getHolder();
holder.addCallback(this);
//为了可以播放视频或者使用Camera预览,我们需要指定其Buffer类型
holder.setType(SurfaceHolder.SURFACE_TYPE_PUSH_BUFFERS);

//下面开始实例化MediaPlayer对象
player = new MediaPlayer();
player.setOnCompletionListener(this);
player.setOnErrorListener(this);
player.setOnInfoListener(this);
player.setOnPreparedListener(this);
player.setOnSeekCompleteListener(this);
player.setOnVideoSizeChangedListener(this);
Log.v("Begin:::", "surfaceDestroyed called");
//然后指定需要播放文件的路径,初始化MediaPlayer
String dataPath = Environment.getExternalStorageDirectory().getPath()+"/Test_Movie.m4v";
try {
player.setDataSource(dataPath);
Log.v("Next:::", "surfaceDestroyed called");
} catch (IllegalArgumentException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalStateException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}

//然后,我们取得当前Display对象
currDisplay = this.getWindowManager().getDefaultDisplay();
}

@Override
public void surfaceChanged(SurfaceHolder arg0, int arg1, int arg2, int arg3) {
// 当Surface尺寸等参数改变时触发
Log.v("Surface Change:::", "surfaceChanged called");
}
@Override
public void surfaceCreated(SurfaceHolder holder) {
// 当SurfaceView中的Surface被创建的时候被调用
//在这里我们指定MediaPlayer在当前的Surface中进行播放
player.setDisplay(holder);
//在指定了MediaPlayer播放的容器后,我们就可以使用prepare或者prepareAsync来准备播放了
player.prepareAsync();

}
@Override
public void surfaceDestroyed(SurfaceHolder holder) {

Log.v("Surface Destory:::", "surfaceDestroyed called");
}
@Override
public void onVideoSizeChanged(MediaPlayer arg0, int arg1, int arg2) {
// 当video大小改变时触发
//这个方法在设置player的source后至少触发一次
Log.v("Video Size Change", "onVideoSizeChanged called");

}
@Override
public void onSeekComplete(MediaPlayer arg0) {
// seek操作完成时触发
Log.v("Seek Completion", "onSeekComplete called");

}
@Override
public void onPrepared(MediaPlayer player) {
// 当prepare完成后,该方法触发,在这里我们播放视频

//首先取得video的宽和高
vWidth = player.getVideoWidth();
vHeight = player.getVideoHeight();

if(vWidth > currDisplay.getWidth() || vHeight > currDisplay.getHeight()){
//如果video的宽或者高超出了当前屏幕的大小,则要进行缩放
float wRatio = (float)vWidth/(float)currDisplay.getWidth();
float hRatio = (float)vHeight/(float)currDisplay.getHeight();

//选择大的一个进行缩放
float ratio = Math.max(wRatio, hRatio);

vWidth = (int)Math.ceil((float)vWidth/ratio);
vHeight = (int)Math.ceil((float)vHeight/ratio);

//设置surfaceView的布局参数
surfaceView.setLayoutParams(new LinearLayout.LayoutParams(vWidth, vHeight));

//然后开始播放视频

player.start();
}
}
@Override
public boolean onInfo(MediaPlayer player, int whatInfo, int extra) {
// 当一些特定信息出现或者警告时触发
switch(whatInfo){
case MediaPlayer.MEDIA_INFO_BAD_INTERLEAVING:
break;
case MediaPlayer.MEDIA_INFO_METADATA_UPDATE:

break;
case MediaPlayer.MEDIA_INFO_VIDEO_TRACK_LAGGING:

break;
case MediaPlayer.MEDIA_INFO_NOT_SEEKABLE:

break;
}
return false;
}
@Override
public boolean onError(MediaPlayer player, int whatError, int extra) {
Log.v("Play Error:::", "onError called");
switch (whatError) {
case MediaPlayer.MEDIA_ERROR_SERVER_DIED:
Log.v("Play Error:::", "MEDIA_ERROR_SERVER_DIED");
break;
case MediaPlayer.MEDIA_ERROR_UNKNOWN:
Log.v("Play Error:::", "MEDIA_ERROR_UNKNOWN");
break;
default:
break;
}
return false;
}
@Override
public void onCompletion(MediaPlayer player) {
// 当MediaPlayer播放完成后触发
Log.v("Play Over:::", "onComletion called");
this.finish();
}
}
### Video.js 播放视频的方法和配置教程 #### 安装依赖包 为了在项目中使用 Video.js,需先安装必要的 npm 包。对于 Vue 3 项目而言,可以通过命令行工具来安装 `video.js` 和对应的样式文件。 ```bash npm install video.js --save ``` #### 导入 Video.js 到 Vue 组件 在具体的 Vue 组件内导入 Video.js 及其 CSS 文件: ```javascript import videojs from 'video.js'; import 'video.js/dist/video-js.css'; ``` #### 创建 HTML 视频标签 定义一个用于承载视频播放器的 `<video>` 标签,并赋予唯一的 ID 属性以便后续初始化操作。 ```html <video id="my-video" class="video-js vjs-default-skin" controls preload="auto"> <source src="path/to/your/video.mp4" type='video/mp4'> </video> ``` #### 初始化 Player 实例 利用 JavaScript 来获取页面中的视频元素并通过 `videojs()` 函数创建一个新的播放器实例[^1]。 ```javascript mounted() { this.player = videojs('my-video'); }, beforeDestroy() { if (this.player) { this.player.dispose(); } } ``` #### 添加自定义事件监听 可以为播放器绑定各种生命周期内的事件处理函数,比如当视频播放完毕时执行特定逻辑。 ```javascript player.on('ended', () => { console.log('The video has ended.'); }); ``` #### 扩展按钮组件至控制栏 除了基本的功能外,还可以基于官方文档进一步定制化开发,例如向默认控件组里加入额外的操作按钮等特性。 ```javascript class MyCustomButton extends videojs.getComponent('Button') { constructor(player, options){ super(player, options); this.controlText('My Custom Button'); } handleClick(){ alert('You clicked the custom button!'); } } // Register the component. videojs.registerComponent('MyCustomButton', MyCustomButton); // Add it to a player instance's control bar. let myPlayerInstance = videojs('example_video_1'); myPlayerInstance.getChild('controlBar').addChild('MyCustomButton'); ``` #### 处理 FLV 流媒体格式 针对某些特殊场景下的流式传输协议支持(如FLV),则可能需要用到第三方插件如 flv.js 进行辅助加载[^3]。 ```javascript if (typeof Hls !== 'undefined' && Hls.isSupported()) { let hls = new Hls(); hls.loadSource('https://www.example.com/path/to/flv/stream.flv'); hls.attachMedia(videoElement); } else if (FlvJs.isSupported()) { FlvJs.createPlayer({ type: 'flv', url: 'https://www.example.com/path/to/flv/stream.flv' }).attachMediaElement(videoElement).load(); } ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值