Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
DCloud
hello uni-app x
提交
4d6d19f9
H
hello uni-app x
项目概览
DCloud
/
hello uni-app x
通知
6007
Star
91
Fork
164
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
18
列表
看板
标记
里程碑
合并请求
1
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
H
hello uni-app x
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
18
Issue
18
列表
看板
标记
里程碑
合并请求
1
合并请求
1
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
提交
4d6d19f9
编写于
9月 06, 2023
作者:
DCloud-yinjiacheng
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
更新video示例
上级
3d0c1bec
变更
1
显示空白变更内容
内联
并排
Showing
1 changed file
with
412 addition
and
406 deletion
+412
-406
pages/component/video/video.uvue
pages/component/video/video.uvue
+412
-406
未找到文件。
pages/component/video/video.uvue
浏览文件 @
4d6d19f9
<template>
<view class="uni-flex-item">
<video class="video" ref="video" :header="header" :src=src :autoplay="autoplay" :loop="loop" :muted="muted
"
:initial-time="initialTime" :duration="duration" :controls="controls" :danmu-btn="danmuBtn"
<video class="video" ref="video" id="video" :header="header" :src=src :autoplay="autoplay" :loop="loop
"
:muted="muted"
:initial-time="initialTime" :duration="duration" :controls="controls" :danmu-btn="danmuBtn"
:enable-danmu="enableDanmu" :page-gesture="pageGesture" :direction="direction" :show-progress="showProgress"
:show-fullscreen-btn="showFullscreenBtn" :show-play-btn="showPlayBtn"
:show-center-play-btn="showCenterPlayBtn" :show-loading="showLoading"
:enable-progress-gesture="enableProgressGesture" :object-fit="objectFit" :poster="poster"
:show-mute-btn="showMuteBtn" :title="title" :enable-play-gesture="enablePlayGesture"
:show-fullscreen-btn="showFullscreenBtn" :show-play-btn="showPlayBtn" :show-center-play-btn="showCenterPlayBtn"
:show-loading="showLoading" :enable-progress-gesture="enableProgressGesture" :object-fit="objectFit"
:poster="poster" :show-mute-btn="showMuteBtn" :title="title" :enable-play-gesture="enablePlayGesture"
:vslide-gesture="vslideGesture" :vslide-gesture-in-fullscreen="vslideGestureInFullscreen" :codec="codec"
:http-cache="httpCache" :play-strategy="playStrategy" :danmu-list="danmuList" @play="onPlay"
@pause="onPause" @ended="onEnded" @timeupdate="onTimeUpdate" @waiting="onWaiting" @error="onError"
@progress="onProgress" @fullscreenclick="onFullScreenClick" @controlstoggle="onControlsToggle"
@fullscreenchange="onFullScreenChange">
:http-cache="httpCache" :play-strategy="playStrategy" :danmu-list="danmuList" @play="onPlay" @pause="onPause"
@ended="onEnded" @timeupdate="onTimeUpdate" @waiting="onWaiting" @error="onError" @progress="onProgress"
@fullscreenclick="onFullScreenClick" @controlstoggle="onControlsToggle" @fullscreenchange="onFullScreenChange">
</video>
<scroll-view class="uni-padding-wrap uni-common-mt uni-flex-item">
<view class="uni-title">
...
...
@@ -141,8 +139,12 @@
<script lang="uts">
import { VideoNode } from "uts.sdk.modules.DCloudUniVideo";
export default {
onReady() {
this.videoContext = uni.createVideoContext('video', this);
},
data() {
return {
videoContext: null as VideoContext | null,
// 属性
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@20181126-lite.m4v",
_src: "https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-app-video-courses.mp4",
...
...
@@ -174,12 +176,16 @@
text: '要显示的文本5',
color: '#000000',
time: 11
}] as Array<UTSJSONObject
>,
}] as Array<Danmu
>,
danmuBtn: false,
enableDanmu: true,
pageGesture: false,
direction: 0,
_direction: -90,
direction: {
direction: 0
} as RequestFullScreenOptions,
_direction: {
direction: -90
} as RequestFullScreenOptions,
showProgress: true,
showFullscreenBtn: true,
showPlayBtn: true,
...
...
@@ -209,34 +215,34 @@
} as UTSJSONObject,
// API
pos: 10,
rate: "1.5"
,
rate: 1.5
,
danmu: {
text: '要显示的文本',
color: '#FF0000'
} as UTSJSONObject
} as Danmu
}
},
methods: {
// API
play: function () {
console.log("play");
(this.$refs["video"] as VideoNode)
.play();
this.videoContext?
.play();
},
pause: function () {
console.log("pause");
(this.$refs["video"] as VideoNode)
.pause();
this.videoContext?
.pause();
},
seek: function (pos : number) {
console.log("seek -> " + pos);
(this.$refs["video"] as VideoNode)
.seek(pos);
this.videoContext?
.seek(pos);
},
requestFullScreen: function (direction : number
) {
console.log("requestFullScreen -> " + direction
);
(this.$refs["video"] as VideoNode).requestFullScreen(direction
);
requestFullScreen: function (options : RequestFullScreenOptions
) {
console.log("requestFullScreen -> " + options
);
this.videoContext?.requestFullScreen(options
);
},
exitFullScreen: function () {
console.log("exitFullScreen");
(this.$refs["video"] as VideoNode)
.exitFullScreen();
this.videoContext?
.exitFullScreen();
},
stop: function () {
console.log("stop");
...
...
@@ -254,13 +260,13 @@
console.log("close");
(this.$refs["video"] as VideoNode).close();
},
sendDanmu: function (data : UTSJSONObject
) {
console.log("sendDanmu -> " + data
);
(this.$refs["video"] as VideoNode).sendDanmu(data
);
sendDanmu: function (danmu : Danmu
) {
console.log("sendDanmu -> " + danmu
);
this.videoContext?.sendDanmu(danmu
);
},
playbackRate: function (rate : string
) {
playbackRate: function (rate : number
) {
console.log("playbackRate -> " + rate);
(this.$refs["video"] as VideoNode)
.playbackRate(rate);
this.videoContext?
.playbackRate(rate);
},
// 属性
setSrc: function (src : string) {
...
...
@@ -299,8 +305,8 @@
this.pageGesture = !this.pageGesture;
console.log("pageGesture -> " + this.pageGesture)
},
setDirection: function (direction : number
) {
this.direction = direction
;
setDirection: function (options : RequestFullScreenOptions
) {
this.direction = options
;
console.log("direction -> " + this.direction)
},
setShowProgress: function () {
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录