更新记录

1.0.5（2024-09-10）

修复uniapp安卓端崩溃

1.0.4（2024-09-04）

新增options配置参数

1.0.3（2024-09-02）

修复bug

平台兼容性

yzc-vlckit 兼容安卓、iOS端VLC播放器，支持rtsp、rtmp流播放

uniappx用法

参数

options配置可参考

方法

|方法名|参数|说明｜ |play|无参|播放方法｜ |pause|无参|暂停方法｜ |stop|无参|停止方法｜

组件引入

<vlc-video 
ref="video"
class="video"
:options="vlcOptions"
url="rtsp://xxxxx"
@mediaPlayerStateChanged="mediaPlayerStateChanged"
@mediaPlayerTimeChanged="mediaPlayerTimeChanged"
></vlc-video>

类型导入

import { StateInfoType, TimeInfoType } from '@/uni_modules/yzc-vlckit/utssdk/interface.uts';

选项时API

export default {
    data() {
        return {
            videoElement: null as VlcVideoElement | null
        }
    },
    onLoad() {
    },
    methods: {
         btnClick() {
             if (this.videoElement == null) {
                 this.videoElement = this.$refs['video'] as VlcVideoElement
             }
             this.videoElement?.play()
             // this.videoElement?.pause()
             // this.videoElement?.stop()
         },
         // 状态改变回调方法
         mediaPlayerStateChanged(res: StateInfoType) {
            console.log('video: state', res.state)
         },
         // 时间改变回调方法
         mediaPlayerTimeChanged(res: TimeInfoType) {
            console.log('video: time', res.time) 
         }
    }
}

组合式API

const video = ref(null)
const btnClick = (() => {
    (video.value as VlcVideoElement).play()
    // (video.value as VlcVideoElement).pause()
    // (video.value as VlcVideoElement).stop()
})
// 状态改变回调方法
const mediaPlayerStateChanged = ((res: StateInfoType) => {
    console.log('video: state', res.state)
})
// 时间改变回调方法
const mediaPlayerTimeChanged = ((res: TimeInfoType) => {
    console.log('video: time', res.time)
})

uniapp用法

export default {
    data() {
        return {
        }
    },
    onLoad() {
    },
    methods: {
         btnClick() {
             this.$refs['video'].play()
             // this.$refs['video'].pause()
             // this.$refs['video'].stop()
         },
         // 状态改变回调方法
         mediaPlayerStateChanged(res) {
            console.log('video: state', res.detail.state)
         },
         // 时间改变回调方法
         mediaPlayerTimeChanged(res) {
            console.log('video: time', res.detail.time) 
         }
    }
}

mediaPlayerStateChanged方法回调说明

state说明

mediaPlayerTimeChanged方法回调说明

time说明 返回为ms的整数类型