快應(yīng)用 video組件

2020-08-08 13:41 更新

概述

視頻播放器

子組件

不支持

屬性

支持 通用屬性

名稱 類型 默認(rèn)值 必填 描述
src <uri> - 視頻播放內(nèi)容的 uri
autoplay <boolean> false 渲染后是否自動(dòng)播放
poster <uri> - 視頻預(yù)覽海報(bào)
controls 1010+ <boolean> true 是否顯示默認(rèn)控件
muted 1030+ <boolean> false 是否靜音播放
orientation 1070+ <string> landscape(橫屏) 指定點(diǎn)擊默認(rèn)控件的全屏按鈕時(shí)視頻進(jìn)入的全屏方向。landscape橫屏,portrait豎屏
titlebar 1070+ <boolean> true 指定視頻組件全屏播放時(shí)是否顯示頂欄,true為顯示,false為不顯示,在非全屏?xí)r均不顯示頂欄
title 1070+ <string> - 配置全屏播放時(shí)頂欄顯示的標(biāo)題,最多只支持一行文案,超過(guò)會(huì)自動(dòng)以省略號(hào)結(jié)尾截?cái)?/td>

備注:如果開(kāi)發(fā)者手動(dòng)調(diào)用requestFullScreen方法進(jìn)入全屏,將根據(jù)此方法的傳入?yún)?shù)screenOrientation設(shè)置全屏方向。

示例代碼:

<video src="xxx.mp4" orientation="portrait"></video>

樣式

支持 通用樣式

名稱 類型 默認(rèn)值 必填 描述
object-fit 1040+ contain | cover | fill | none | scale-down contain 視頻源的縮放類型

object-fit 類型 1040+

類型 描述
contain 保持寬高比,縮小或者放大,使得視頻完全顯示在顯示邊界內(nèi),居中顯示
cover 保持寬高比,縮小或者放大,使得兩邊都大于或等于顯示邊界,居中顯示
fill 不保存寬高比,填充滿顯示邊界
none 居中,無(wú)縮放
scale-down 保持寬高比,縮小或保持不變,取 contain 和 none 中顯示較小的一個(gè),居中顯示

事件

支持 通用事件

名稱 參數(shù) 描述
prepared {duration: value(秒)} 視頻連接成功時(shí)觸發(fā)
start - 開(kāi)始播放時(shí)觸發(fā)
pause - 暫停時(shí)觸發(fā)
finish - 播放結(jié)束時(shí)觸發(fā)
error - 播放失敗時(shí)觸發(fā)
seeking {currenttime: value(秒)} 播放進(jìn)度條滑動(dòng)時(shí)觸發(fā)
seeked {currenttime: value(秒)} 播放進(jìn)度條滑動(dòng)放開(kāi)時(shí)觸發(fā)
timeupdate {currenttime: value(秒)} 播放進(jìn)度變化時(shí)觸發(fā),觸發(fā)頻率4HZ
fullscreenchange {fullscreen: fullscreenValue} 視頻進(jìn)入和退出全屏?xí)r觸發(fā)

方法

名稱 參數(shù) 描述
start - 開(kāi)始播放視頻
pause - 暫停播放視頻
setCurrentTime {currenttime: value(秒)} 指定視頻播放位置
requestFullscreen { screenOrientation : "portrait" | "landscape" } minPlatformVersion < 1050: 默認(rèn)參數(shù)為 "landscape"; minPlatformVersion >= 1050: 默認(rèn)參數(shù)為 "portrait". 請(qǐng)求進(jìn)入全屏模式
exitFullscreen - 視頻退出全屏

video   示例代碼

查看 示例代碼

說(shuō)明:

  1. 支持 HTTP/HTTPS/RTSP 協(xié)議
  2. 在主流的視頻編碼格式(如:H.263,H.264,MPEG-4 等)和主流的音頻編碼格式(AAC,F(xiàn)LAC,MP3 等)下,支持主流的音視頻封裝格式如:MPEG-4(.mp4),3GPP(.3gp),MPEG-TS(.ts,not seekable),Matroska(.mkv),Ogg(.ogg)等


以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)