组件_video
原创...大约 1 分钟
<video src="http://iwenwiki.com/api/livable/livable.mp4"></video>
为了美观,我们将视频宽度充满全屏
video {
width: 100%;
}
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
src | string | 是 | 要播放视频的资源地址,支持网络路径、本地临时路径 | |
duration | number | 否 | 指定视频时长 | |
controls | boolean | true | 否 | 是否显示默认播放控件(播放/暂停按钮、播放进度、时间) |
autoplay | boolean | false | 否 | 是否自动播放 |
loop | boolean | false | 否 | 是否循环播放 |
muted | boolean | false | 否 | 是否静音播放 |
initial-time | number | 0 | 否 | 指定视频初始播放位置 |
show-mute-btn | boolean | false | 否 | 是否显示静音按钮 |
danmu-list | Array | 否 | 弹幕列表 | |
danmu-btn | boolean | false | 否 | 是否显示弹幕按钮,只在初始化时有效,不能动态变更 |
enable-danmu | boolean | false | 否 | 是否展示弹幕,只在初始化时有效,不能动态变更 |
<video
id="myVideo"
src="http://iwenwiki.com/api/livable/livable.mp4"
duration="100"
controls
autoplay
loop
muted
initial-time="10"
show-mute-btn
title="制作歌曲"
danmu-list="{{ danmuList }}"
danmu-btn
enable-danmu
></video>
<button type="primary" bindtap="sendDanmuHandle">发送弹幕</button>
// pages/audio/audio.js
Page({
data: {
danmuList: [
{
text: "第 1s 出现的弹幕",
color: "#ff0000",
time: 11,
},
],
},
onReady() {
this.videoContext = wx.createVideoContext("myVideo");
},
sendDanmuHandle() {
this.videoContext.sendDanmu({
text: "真好看",
color: "#00ff00",
});
},
});
Powered by Waline v2.15.7