收藏人数:
https://github.com/programbao/uniplugin-vlc-video
购买（
下载 for 离线打包
赞赏（1）
更新记录
1.0.0（2023-10-25）
更新记录
1.0.0（2023-10-24）
本次主要是上线 android版 vlc播放器；支持两种组件；
- 第一种是“无原生控件” ；控件可请大家参考其他插件的实现方式。
- 第二种是“有原生控件”；实现了基本的播放器功能控件，可根据条件提供源码进行定制。
平台兼容性
| Android | Android CPU类型 | iOS |
|---|---|---|
| 适用版本区间：5.0 - 12.0 | armeabi-v7a：支持，arm64-v8a：支持，x86：支持 | × |
原生插件通用使用流程：
- 购买插件，选择该插件绑定的项目。
- 在HBuilderX里找到项目，在manifest的app原生插件配置中勾选模块，如需要填写参数则参考插件作者的文档添加。
- 根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。
- 打包自定义基座，选择插件，得到自定义基座，然后运行时选择自定义基座，进行log输出测试。
- 开发完毕后正式云打包
付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios
注意事项：使用HBuilderX2.7.14以下版本，如果同一插件且同一appid下购买并绑定了多个包名，提交云打包界面提示包名绑定不一致时，需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择
更新记录
1.0.0（2023-10-04）
本次主要是上线 android版 vlc播放器；支持两种组件；
- 第一种是“无原生控件” ；控件可请大家参考其他插件的实现方式。
- 第二种是“有原生控件”；实现了基本的播放器功能控件，可根据条件提供源码进行定制。
概述
vlc超级播放器，支持几乎所有视频和音频格式解码
Plays all formats MPEG-1/2, DivX® (1/2/3/4/5/6), MPEG-4 ASP, XviD, 3ivX D4, H.261, H.265, H.263 / H.263i, H.264 / MPEG-4 AVC, Cinepak, Theora, Dirac / VC-2, MJPEG (A/B), WMV 1/2, WMV 3 / WMV-9 / VC-1, Sorenson 1/3, DV, On2 VP3/VP5/VP6, Indeo Video v3 (IV32), Real Video (1/2/3/4). MPEG Layer 1/2, MP3 - MPEG Layer 3, AAC - MPEG-4 part3, Vorbis, AC3 - A/52, E-AC-3, MLP / TrueHD>3, DTS, WMA 1/2, WMA 3, FLAC, ALAC, Speex, Musepack / MPC, ATRAC 3, Wavpack, Mod, TrueAudio, APE, Real Audio, Alaw/µlaw, AMR (3GPP), MIDI, LPCM, ADPCM, QCELP, DV Audio, QDM2/QDMC, MACE. DVD, Text files (MicroDVD, SubRIP, SubViewer, SSA1-5, SAMI, VPlayer), Closed captions, Vobsub, Universal Subtitle Format (USF), SVCD / CVD, DVB, OGM, CMML, Kate. ID3 tags, APEv2, Vorbis comment.
有问题请联系 qq：2962631411 wx：xianmai-baobao
使用
<template>
<div class="video-box" :style="videoBoxStyle">
<text class="title" v-if="!isFull">vlc万能播放器</text>
<div class="vlc-video-box">
<text class="sub-title">无原生控件</text>
<programbao-vlc-video-v1
play="http://github.com/mediaelement/mediaelement-files/blob/master/big_buck_bunny.mp4?raw=true"
ref="vlc"
:style="vlcVideoStyle"
@onTimeChange="onTimeChange"
@onPositionChange="onPositionChange"
@onTotalTime="onTotalTime"
@onPlayEnd="onPlayEnd"
@onPlayError="onPlayError"
@onOpening="onOpening"
>
<cover-view style="width: 100%;height: 100px;" class="video-view">
<text :style="{color:'#f40'}">标题</text>
</cover-view>
</programbao-vlc-video-v1>
<text style="margin-top: 20px;" class="sub-title">有原生控件</text>
<div
style="width: 750rpx;height: 200px;">
<programbao-vlc-video-v2
play="http://github.com/mediaelement/mediaelement-files/blob/master/big_buck_bunny.mp4?raw=true"
ref="vlc-v2"
:style="vlcVideoStyle"
:title="title"
@onTimeChange="onTimeChange"
@onPositionChange="onPositionChange"
@onTotalTime="onTotalTime"
@onPlayEnd="onPlayEnd"
@onPlayError="onPlayError"
@onOpening="onOpening">
</programbao-vlc-video-v2>
</div>
<!-- 三方控件 -->
<!-- <chunleiVideo
:setFullScreen="isFull"
@back="enterFullScreen"
@tapFullScreen="enterFullScreen"
:style="fullScreenStyle"></chunleiVideo> -->
</div>
<view class="btns">
<button class="btn" @click="setRate(rate)" v-for="rate in rateArr" :key="rate">
<text class="txt">速率 {{ rate }}</text>
</button>
<button class="btn primary" type="primary" @click="init"><text class="txt">初始化</text></button>
<button class="btn primary" type="primary" @click="play"><text class="txt">播放</text></button>
<button class="btn primary" type="primary" @click="pause"><text class="txt">暂停</text></button>
<button class="btn primary" type="primary" @click="stop"><text class="txt">停止</text></button>
<button class="btn primary" type="primary" @click="enterFullScreen"><text class="txt">全屏</text></button>
</view>
</div>
</template>
<script>
// 导入三方控件
// import chunleiVideo from '../../components/chunlei-video/chunlei-video.nvue'
export default {
// components:{chunleiVideo},
data() {
return {
msg: '',
isFull: false,
rateArr: ['0.25', '0.5', '1', '1.25', '1.5', '2'],
initVideoViewStyle: {
height: '200px'
},
fullScreenStyle: {
height: '200px'
},
vlcVideoStyle: {
height: '200px'
},
videoBoxStyle: {},
title: "标题标题"
}
},
onLoad() {
},
// 回退按钮监听 -- 判断退出全屏
onBackPress(event) {
if (event.from === 'navigateBack') {
return false;
}
this.handleBackPressEvent();
return true;
},
methods: {
handleBackPressEvent() {
let that = this
if (that.$refs["vlc-v2"].handleIsExitFullScreenStatus) {
that.$refs["vlc-v2"].handleIsExitFullScreenStatus(function (isFull) {
if (!isFull) {
uni.navigateBack();
}
})
} else {
uni.navigateBack();
}
},
play() {
this.$refs.vlc.toPlay()
},
pause() {
this.$refs.vlc.pause()
},
stop() {
this.$refs.vlc.stop()
},
enterFullScreen() {
let that = this;
if (!this.isFull) {
// plus.navigator.setFullscreen(true);
// plus.navigator.hideSystemNavigation();
// plus.screen.lockOrientation("landscape-primary");
setTimeout(() => {
let screenWidth = uni.getSystemInfoSync().screenWidth
let screenHeight = uni.getSystemInfoSync().screenHeight
// that.fullScreenStyle = {
// 'position': 'fixed',
// 'top': 0,
// 'left': 0,
// 'bottom': 0,
// 'right': 0,
// 'z-index': 100,
// 'width': screenWidth + 'px',
// 'height': screenHeight + 'px',
// // 'background-color': '#f40'
// }
// that.isFull = !that.isFull;
// this.$refs.vlc.enterFullScreen({}, () => {
// // subNVue.show('slide-in-top', 250)
// })
}, 200)
// this.$refs.vlc.requestFullScreen()
// this.$refs.vlc.changeToLandscape({}, function(res) {
// that.fullScreenStyle = {
// 'position': 'fixed',
// 'top': 0,
// 'left': 0,
// 'bottom': 0,
// 'right': 0,
// 'z-index': 10,
// 'background-color': '#f40'
// }
// });
} else {
// plus.navigator.setFullscreen(false);
// plus.navigator.showSystemNavigation();
// plus.screen.lockOrientation("portrait-primary");
// setTimeout(() => {
// let screenWidth = uni.getSystemInfoSync().screenWidth
// // let screenHeight = uni.getSystemInfoSync().screenHeight
// that.fullScreenStyle = {
// ...that.initVideoViewStyle,
// 'width': screenWidth + 'px'
// }
// that.isFull = !that.isFull;
// this.$refs.vlc.exitFullScreen({}, () => {
// // subNVue.hide('slide-in-top', 250)
// })
// }, 200)
// this.$refs.vlc.exitFullScreen()
}
},
setRate(rate) {
this.$refs.vlc.setRate({
"rate": rate //0.25 - 8.0
})
},
onTimeChanged(res) {
if (this.changing == false) {
console.log(res, 'resres')
this.current = res.detail.time;
}
},
onTotalTime(res) {
this.duration = res.detail.time;
}
}
}
</script>
<style scoped>
.video-view {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 999;
}
.video-box {
overflow: hidden;
}
.video-box .title {
font-size: 20px;
margin: 20px auto;
font-weight: 700;
text-align: center;
}
.video-box .sub-title {
font-size: 16px;
text-align: center;
}
.video-box .picture {
flex-direction: row;
/* flex-wrap: wrap; */
}
.video-box .picture .img {
width: 200px;
height: 200px;
}
.video-box .picture2 {
justify-content: center;
align-items: center;
}
.video-box .picture2 .img {
}
.video-box .btns {
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.video-box .btns .btn {
width: 100px;
height: 40px;
margin: 4px;
}
.video-box .btns .btn .txt {
font-size: 30rpx;
}
.video-box .btns .btn.primary .txt {
color: #fff;
}
</style>
下载 148
赞赏 1
下载 8392
赞赏 94
赞赏
京公网安备：11010802035340号