《微信小程序开发从入门到实战》学习九十九

2024-01-31 20:28

本文主要是介绍《微信小程序开发从入门到实战》学习九十九,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

 

7.4 视频组件

7.4.1 video组件

支持属性属性如下:

属性类型默认值说明最低版本
src(必填)string要播放视频的资源地址,基础库2.3.0版本开始支持云文件ID1.0.0
controlsbooleantrue是否显示默认播放控件(播放/暂停按钮、播放进度、时间)1.0.0
enable-danmubooleanfalse是否展示弹幕,只在初始化时有效,不能动态变更1.0.0
danmu-btnbooleanfalse是否显示弹幕按钮,只在初始化时有效,不能动态变更1.0.0
danmu-listObject[]弹幕列表1.0.0
autoplaybooleanfalse是否自动播放1.0.0
loopbooleanfalse是否循环播放1.4.0
mutedbooleanfalse是否静音播放1.4.0
initial-timenumber0指定视频初始播放位置1.6.0
directionnumber

设置全屏时视频的方向,不指定则根据宽高比自动判断,可选值及其含义如下:

0:正常竖向

90:屏幕逆时针90度

-90:屏幕顺时针90度

1.7.0
show-progressbooleantrue若不设置,宽度大于240时才会显示1.9.0
show-fullscreen-btnbooleantrue是否显示全屏按钮1.9.0
show-play-btnbooleantrue是否显示视频底部控制栏的播放按钮1.9.0
show-center-play-btnbooleantrue是否显示视频中间的播放按钮1.9.0
enable-progress-gesturebooleantrue是否开启控制进度的手势1.9.0
object-fitstringcontain

当视频大小与 video 容器大小不一致时,视频的表现形式,可选值及其含义如下:

contain:包含

fill:填充

cover:覆盖

1.0.0
posterstring视频封面的图片网络资源地址或云文件ID(2.3.0)。若 controls 属性值为 false 则设置 poster 无效1.0.0
show-mute-btnbooleanfalse是否显示静音按钮2.4.0
titlestring视频的标题,全屏时在顶部展示2.4.0
play-btn-positionstringbottom播放按钮的位置,可选值及其含义如下:

bottom:controls bar上

center:视频中间

2.4.0
enable-play-gesturebooleanfalse是否开启播放手势,即双击切换播放/暂停2.4.0
autp-pause-if-navigatebooleantrue当跳转到本小程序的其他页面时,是否自动暂停本页面的视频播放2.5.0
autp-pause-if-open-nativebooleantrue当跳转到其它微信原生页面时,是否自动暂停本页面的视频2.5.0
page-gesturebooleanfalse在非全屏模式下,是否开启亮度与音量调节手势(废弃,见 vslide-gesture)1.6.0
vslide-gesturebooleanfalse在非全屏模式下,是否开启亮度与音量调节手势(同 page-gesture)1.6.0
vslide-gesture-in-fullscreenbooleantrue在全屏模式下,是否开启亮度与音量调节手势2.6.2
bindplayeventhandle当开始/继续播放时触发play事件1.0.0
bindpauseeventhandle当暂停播放时触发 pause 事件1.0.0
bindendedeventhandle当播放到末尾时触发 ended 事件1.0.0
bindtimeupdateeventhandle播放进度变化时触发,event.detail = {currentTime, duration} 。触发频率 250ms 一次1.0.0
bindfullscreenchangeeventhandle视频进入和退出全屏时触发,event.detail = {fullScreen, direction},direction 有效值为 vertical 或 horizontal1.4.0
bindwaitingeventhandle视频出现缓冲时触发1.7.0
binderroreventhandle视频播放出错时触发1.7.0
bindprogresseventhandle加载进度变化时触发,只支持一段加载。event.detail = {buffered},百分比2.4.0

enable-danmu、danmu-btn和danmu-list属性分别用于设置是否显示弹幕、是否显示弹幕开关和弹幕列表。danmu-list属性需要传入一个数组,数组中的每一项都是一个Object类型的值,包含text、color和time三个属性,分别表示一条弹幕的文字、字体颜色和出现时间(单位为秒)。

 

这篇关于《微信小程序开发从入门到实战》学习九十九的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/664963

相关文章

Python并行处理实战之如何使用ProcessPoolExecutor加速计算

《Python并行处理实战之如何使用ProcessPoolExecutor加速计算》Python提供了多种并行处理的方式,其中concurrent.futures模块的ProcessPoolExecu... 目录简介完整代码示例代码解释1. 导入必要的模块2. 定义处理函数3. 主函数4. 生成数字列表5.

Python基于微信OCR引擎实现高效图片文字识别

《Python基于微信OCR引擎实现高效图片文字识别》这篇文章主要为大家详细介绍了一款基于微信OCR引擎的图片文字识别桌面应用开发全过程,可以实现从图片拖拽识别到文字提取,感兴趣的小伙伴可以跟随小编一... 目录一、项目概述1.1 开发背景1.2 技术选型1.3 核心优势二、功能详解2.1 核心功能模块2.

Go学习记录之runtime包深入解析

《Go学习记录之runtime包深入解析》Go语言runtime包管理运行时环境,涵盖goroutine调度、内存分配、垃圾回收、类型信息等核心功能,:本文主要介绍Go学习记录之runtime包的... 目录前言:一、runtime包内容学习1、作用:① Goroutine和并发控制:② 垃圾回收:③ 栈和

Android学习总结之Java和kotlin区别超详细分析

《Android学习总结之Java和kotlin区别超详细分析》Java和Kotlin都是用于Android开发的编程语言,它们各自具有独特的特点和优势,:本文主要介绍Android学习总结之Ja... 目录一、空安全机制真题 1:Kotlin 如何解决 Java 的 NullPointerExceptio

Java Spring 中的监听器Listener详解与实战教程

《JavaSpring中的监听器Listener详解与实战教程》Spring提供了多种监听器机制,可以用于监听应用生命周期、会话生命周期和请求处理过程中的事件,:本文主要介绍JavaSprin... 目录一、监听器的作用1.1 应用生命周期管理1.2 会话管理1.3 请求处理监控二、创建监听器2.1 Ser

Python中OpenCV与Matplotlib的图像操作入门指南

《Python中OpenCV与Matplotlib的图像操作入门指南》:本文主要介绍Python中OpenCV与Matplotlib的图像操作指南,本文通过实例代码给大家介绍的非常详细,对大家的学... 目录一、环境准备二、图像的基本操作1. 图像读取、显示与保存 使用OpenCV操作2. 像素级操作3.

Apache 高级配置实战之从连接保持到日志分析的完整指南

《Apache高级配置实战之从连接保持到日志分析的完整指南》本文带你从连接保持优化开始,一路走到访问控制和日志管理,最后用AWStats来分析网站数据,对Apache配置日志分析相关知识感兴趣的朋友... 目录Apache 高级配置实战:从连接保持到日志分析的完整指南前言 一、Apache 连接保持 - 性

MQTT SpringBoot整合实战教程

《MQTTSpringBoot整合实战教程》:本文主要介绍MQTTSpringBoot整合实战教程,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考... 目录MQTT-SpringBoot创建简单 SpringBoot 项目导入必须依赖增加MQTT相关配置编写

如何基于Python开发一个微信自动化工具

《如何基于Python开发一个微信自动化工具》在当今数字化办公场景中,自动化工具已成为提升工作效率的利器,本文将深入剖析一个基于Python的微信自动化工具开发全过程,有需要的小伙伴可以了解下... 目录概述功能全景1. 核心功能模块2. 特色功能效果展示1. 主界面概览2. 定时任务配置3. 操作日志演示

JavaScript实战:智能密码生成器开发指南

本文通过JavaScript实战开发智能密码生成器,详解如何运用crypto.getRandomValues实现加密级随机密码生成,包含多字符组合、安全强度可视化、易混淆字符排除等企业级功能。学习密码强度检测算法与信息熵计算原理,获取可直接嵌入项目的完整代码,提升Web应用的安全开发能力 目录