sunny-video視頻倍速播放器

組件名：sunny-video

效果圖

img1	img2	img3	img4

平臺差異說明

• 目前已應用到APP（安卓、iOS）、微信（小程序、H5）
• 其它平臺未測試

安裝方式

• 本組件符合easycom規范，HBuilderX 2.5.5起，只需將本組件導入項目，在頁面template中即可直接使用，無需在頁面中import和注冊components。
• uni-app插件市場鏈接 —— https://ext.dcloud.net.cn/plugin?id=11982

基本用法

• APP端需要配置manifest.json>App模塊配置勾選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"]}

代碼演示

<template><view><sunny-video ref="sunnyVideo" title="測試視頻" src="https://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%8B@20200317.mp4" @timeupdate="timeupdate" /></view>
<template><script>export default {data() {return {}},methods: {timeupdate(e){console.log('timeupdate：', e)}}}
</script><style>
</style>

Props

屬性名	類型	默認值	可選值	說明
src	String	‘’	-	視頻播放地址
loop 1.1.3	Boolean	false	true	是否循環播放
muted 1.1.3	Boolean	false	true	是否靜音播放
title	String	‘’	-	視頻標題
poster	String	‘’	-	視頻封面
videoHeight	String, Number	230px	-	視頻高度
videoWidth 1.1.3	String, Number	750rpx	-	視頻寬度
playImgHeight	String, Number	70rpx	-	播放圖標按鈕寬高
playImg	String	base64	-	播放按鈕圖標
showMuteBtn	Boolean	false	true	是否顯示靜音按鈕
isExitFullScreen	Boolean	true	false	播放完畢是否退出全屏
tipText 1.1.0	String	‘試看已結束，本片是會員專享內容’	-	試看提示的文字
btnText 1.1.0	String	‘成為會員免費觀看’	-	試看按鈕的文字
trialTime 1.1.0	Number	0	-	視頻試看時間（秒）, 不需要試看功能則默認為0
speedBoxWidth 1.1.3	String, Number	160rpx	-	倍速盒子寬度

事件 Events

事件名	說明	返回值
play	監聽開始播放	-
pause	監聽視頻暫停	-
playError	視頻播放出錯時觸發	-
videoEnded	視頻播放結束觸發	-
timeupdate	播放進度變化時觸發	event.detail={currentTime, duration}。觸發頻率 250ms 一次
fullscreenchange 1.1.3	當視頻進入和退出全屏時觸發	Boolean
handleBtn 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.1	position	跳轉到指定位置，單位 s