学校网站模版,网站 颜色标准,多商户海外商城源码下载,电影网站模板htmlsunny-video视频倍速播放器 组件名#xff1a;sunny-video 效果图
img1img2img3img4
平台差异说明
目前已应用到APP#xff08;安卓、iOS#xff09;、微信#xff08;小程序、H5#xff09;其它平台未测试
安装方式
本组件符合easycom规范#xff0c;HBuilderX 2.5…sunny-video视频倍速播放器 组件名sunny-video 效果图
img1img2img3img4
平台差异说明
目前已应用到APP安卓、iOS、微信小程序、H5其它平台未测试
安装方式
本组件符合easycom规范HBuilderX 2.5.5起只需将本组件导入项目在页面template中即可直接使用无需在页面中import和注册components。uni-app插件市场链接 —— https://ext.dcloud.net.cn/plugin?id11982 基本用法
APP端需要配置manifest.jsonApp模块配置勾选VideoPlay(视频播放)App端3.6.14 以及 手机系统 iOS16 以上video全屏 需要配置应用支持横屏 在manifest.json 文件内 app-plus 节点下新增 screenOrientation 配置设置值为[portrait-primary,portrait-secondary,landscape-primary,landscape-secondary]。如下 app-plus : {screenOrientation : [portrait-primary,portrait-secondary,landscape-primary,landscape-secondary]}代码演示
templateviewsunny-video refsunnyVideo title测试视频 srchttps://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B20200317.mp4 timeupdatetimeupdate //view
templatescriptexport default {data() {return {}},methods: {timeupdate(e){console.log(timeupdate, e)}}}
/scriptstyle
/styleProps
属性名类型默认值可选值说明srcString‘’-视频播放地址loop 1.1.3Booleanfalsetrue是否循环播放muted 1.1.3Booleanfalsetrue是否静音播放titleString‘’-视频标题posterString‘’-视频封面videoHeightString, Number230px-视频高度videoWidth 1.1.3String, Number750rpx-视频宽度playImgHeightString, Number70rpx-播放图标按钮宽高playImgStringbase64-播放按钮图标showMuteBtnBooleanfalsetrue是否显示静音按钮isExitFullScreenBooleantruefalse播放完毕是否退出全屏tipText 1.1.0String‘试看已结束本片是会员专享内容’-试看提示的文字btnText 1.1.0String‘成为会员免费观看’-试看按钮的文字trialTime 1.1.0Number0-视频试看时间秒, 不需要试看功能则默认为0speedBoxWidth 1.1.3String, Number160rpx-倍速盒子宽度
事件 Events
事件名说明返回值play监听开始播放-pause监听视频暂停-playError视频播放出错时触发-videoEnded视频播放结束触发-timeupdate播放进度变化时触发event.detail{currentTime, duration}。触发频率 250ms 一次fullscreenchange 1.1.3当视频进入和退出全屏时触发BooleanhandleBtn 1.1.0点击试看按钮时触发-trialEnd 1.1.0试看结束时触发-
方法 Methods
需要通过ref获取组件才能调用
名称参数说明changePlay开始播放视频changePause 1.1.3暂停播放视频showTrialEnd 1.1.0控制试看模块显示closeTrialEnd 1.1.0控制试看模块隐藏seek 1.1.1position跳转到指定位置单位 s
注意事项
APP全屏需要按照文档基本用法进行配置APP端如果需要全屏倍速及试看需要使用.nvue文件
