FinClip为企业提供小程序生态圈技术产品,开发者可在FinClip小程序开发帮助中心找到相关FinClip小程序指引

# 媒体组件

# 媒体组件说明

组件 说明 最低版本 备注
audio 音频 1.0.0
image 图片 1.0.0
video 视频 1.0.0
camera 照相机 2.9.3
live-player 实时音频播放 2.10.1 需配合第三方音视频 SDK 使用
live-pusher 实时音频录制 2.10.1 需配合第三方音视频 SDK 使用
voip-room 多人音视频对话 不支持

# audio

请注意

audio 组件不再维护,请使用 wx.createInnerAudio API 处理音频播放。

属性 类型 默认值 必填 说明 最低版本
id string 否 audio 组件的唯一标识符 1.0.0
src string 否 要播放音频的资源地址 1.0.0
loop boolean false 否 是否循环播放 1.0.0
controls boolean false 否 是否显示默认控件 1.0.0
poster string 否 默认控件上的音频封面的图片资源地址,如果 controls 属性值为 false 则设置 poster 无效 1.0.0
name string 未知音频 否 默认控件上的音频名字,如果 controls 属性值为 false 则设置 name 无效 1.0.0
author string 未知作者 否 默认控件上的作者名字,如果 controls 属性值为 false 则设置 author 无效 1.0.0
binderror eventhandle 否 当发生错误时触发 error 事件,detail = {errMsg:MediaError.code} 1.0.0
bindplay eventhandle 否 当开始/继续播放时触发 play 事件 1.0.0
bindpause eventhandle 否 当暂停播放时触发 pause 事件 1.0.0
bindtimeupdate eventhandle 否 当播放进度改变时触发 timeupdate 事件,detail = {currentTime, duration} 1.0.0
bindended eventhandle 否 当播放到末尾时触发 ended 事件 1.0.0

# image

属性 类型 默认值 必填 说明 最低版本
src string 否 图片资源地址 2.11.4
mode string scaleToFill 否 图片裁剪、缩放的模式 2.11.4
binderror eventhandle 否 当错误发生时触发,event.detail = {errMsg} 2.11.4
bindload eventhandle 否 当图片载入完毕时触发,event.detail = {height, width} 2.11.4
webp boolean false 否 默认不解析 webP 格式,只支持网络资源 不支持
lazy-load boolean false 否 图片懒加载,在即将进入一定范围(上下三屏)时才开始加载 2.12.2
show-menu-by-longpress boolean false 否 开启长按图片显示识别小程序码菜单 不支持

# mode 的合法值

值 说明 最低版本
scaleToFill 缩放模式,不保持纵横比缩放图片,使图片的宽高完全拉伸至填满 image 元素
aspectFit 缩放模式,保持纵横比缩放图片,使图片的长边能完全显示出来。也就是说,可以完整地将图片显示出来。
aspectFill 缩放模式,保持纵横比缩放图片,只保证图片的短边能完全显示出来。也就是说,图片通常只在水平或垂直方向是完整的,另一个方向将会发生截取。
widthFix 缩放模式,宽度不变,高度自动变化,保持原图宽高比不变
heightFix 缩放模式,高度不变,宽度自动变化,保持原图宽高比不变
top 裁剪模式,不缩放图片,只显示图片的顶部区域
bottom 裁剪模式,不缩放图片,只显示图片的底部区域
center 裁剪模式,不缩放图片,只显示图片的中间区域
left 裁剪模式,不缩放图片,只显示图片的左边区域
right 裁剪模式,不缩放图片,只显示图片的右边区域
top left 裁剪模式,不缩放图片,只显示图片的左上边区域
top right 裁剪模式,不缩放图片,只显示图片的右上边区域
bottom left 裁剪模式,不缩放图片,只显示图片的左下边区域
bottom right 裁剪模式,不缩放图片,只显示图片的右下边区域

# live-player

iOS使用live-player组件需要集成直播SDK

iOS集成扩展SDK/直播SDK请参考「小程序 SDK-iOS SDK-iOS 集成-直播SDK」

Android使用live-player组件需要集成LiveSDK

Android集成LiveSDK请参考「小程序 SDK-Android SDK-Android 集成-LiveSDK」

属性 类型 默认值 必填 说明 最低版本
src string 否 音视频地址。目前支持 flv, rtmp 格式, webrtc 格式依赖 oem 参数启用 3.0.50
oem string 否 "srs" //开源服务,"zlmedia" //ZLmedia,"nginx" //Nginx,"anyrtc" //Anyrtc,"aliyun" //阿里,"tencent" //腾讯,"huawei" //华为,"qiniu" //七牛,"aws" // Aws,"max" 3.4.4
mode string live 否 模式 暂不支持
autoplay boolean false 否 自动播放 3.0.50
muted boolean false 否 是否静音 3.0.50
orientation string vertical 否 画面方向 暂不支持
object-fit string contain 否 填充模式,可选值有 contain,fillCrop 3.0.50
background-mute boolean false 否 进入后台时是否静音(已废弃,默认退后台静音) 暂不支持
min-cache number 1 否 最小缓冲区,单位 s(RTC 模式推荐 0.2s) 暂不支持
max-cache number 3 否 最大缓冲区,单位 s(RTC 模式推荐 0.8s)。缓冲区用来抵抗网络波动,缓冲数据越多,网络抗性越好,但时延越大。 暂不支持
sound-mode string speaker 否 声音输出方式 暂不支持
auto-pause-if-navigate boolean true 否 当跳转到本小程序的其他页面时,是否自动暂停本页面的实时音视频播放 3.3.1
SDK:2.44.1
auto-pause-if-open-native boolean true 否 当跳转到其它原生页面时,是否自动暂停本页面的实时音视频播放 3.3.1
SDK:2.44.1
picture-in-picture-mode string/Array 否 设置小窗模式: push, pop,空字符串或通过数组形式设置多种模式(如: ["push", "pop"]) 3.3.1
SDK:2.44.1
bindstatechange eventhandle 否 播放状态变化事件,detail = {code} 3.0.50
bindfullscreenchange eventhandle 否 全屏变化事件,detail = {direction, fullScreen} 暂不支持
bindnetstatus eventhandle 否 网络状态通知,detail = {info} 3.0.50
bindaudiovolumenotify eventhandler 否 播放音量大小通知,detail = {} 3.0.50
bindenterpictureinpicture eventhandler 否 播放器进入小窗 android:暂不支持
bindleavepictureinpicture eventhandler 否 播放器退出小窗 android:暂不支持

# mode 的合法值

值 说明 最低版本
live 直播
RTC 实时通话,该模式时延更低

# orientation 的合法值

值 说明 最低版本
vertical 竖直
horizontal 水平

# object-fit 的合法值

值 说明 最低版本
contain 图像长边填满屏幕,短边区域会被填充⿊⾊
fillCrop 图像铺满屏幕,超出显示区域的部分将被截掉

# sound-mode 的合法值

值 说明 最低版本
speaker 扬声器
ear 听筒

# picture-in-picture-mode 的合法值

值 说明 最低版本
[] 取消小窗
push 路由 push 时触发小窗
pop 路由 pop 时触发小窗

# live-pusher

iOS 使用 live-pusher 组件需要集成直播 SDK

iOS 集成扩展 SDK 或直播 SDK 请参考「小程序 SDK-iOS SDK-iOS 集成-直播SDK」

Android 使用 live-pusher 组件需要集成 LiveSDK

Android 集成 LiveSDK 请参考「小程序 SDK-Android SDK-Android 集成-LiveSDK」

属性 类型 默认值 必填 说明 最低版本
url string 否 推流地址。目前仅支持 rtmp 格式 3.0.50
mode string RTC 否 SD(标清), HD(高清), FHD(超清), RTC(实时通话) 暂不支持
autopush boolean false 否 自动推流 3.0.50
muted boolean false 否 是否静音。即将废弃,可用 enable-mic 替代 3.0.50
enable-camera boolean true 否 开启摄像头 3.0.50
auto-focus boolean true 否 自动聚集 暂不支持
orientation string vertical 否 画面方向 暂不支持
beauty number 0 否 美颜,取值范围 0-9 ,0 表示关闭 暂不支持
whiteness number 0 否 美白,取值范围 0-9 ,0 表示关闭 暂不支持
aspect string 9:16 否 宽高比,可选值有 3:4, 9:16 暂不支持
min-bitrate number 200 否 最小码率 暂不支持
max-bitrate number 1000 否 最大码率 暂不支持
audio-quality string high 否 高音质(48KHz)或低音质(16KHz),值为 high, low 暂不支持
waiting-image string 否 进入后台时推流的等待画面 暂不支持
waiting-image-hash string 否 等待画面资源的 MD5 值 暂不支持
zoom boolean false 否 调整焦距 暂不支持
device-position string front 否 前置或后置,值为 front, back 3.0.50
background-mute boolean false 否 进入后台时是否静音(已废弃,默认退后台静音) 暂不支持
mirror boolean false 否 设置推流画面是否镜像,产生的效果在 live-player 反应到 暂不支持
remote-mirror boolean false 否 同 mirror 属性,后续 mirror 将废弃 暂不支持
local-mirror string auto 否 控制本地预览画面是否镜像 暂不支持
audio-reverb-type number 0 否 音频混响类型 暂不支持
enable-mic boolean true 否 开启或关闭麦克风 3.0.50
enable-agc boolean false 否 是否开启音频自动增益 暂不支持
enable-ans boolean false 否 是否开启音频噪声抑制 暂不支持
audio-volume-type string auto 否 音量类型 暂不支持
video-width number 360 否 上推的视频流的分辨率宽度 暂不支持
video-height number 640 否 上推的视频流的分辨率高度 暂不支持
beauty-style string smooth 否 设置美颜类型 暂不支持
pictureInPictureMode string/Array 否 设置小窗模式, push, pop,空字符串或通过数组形式设置多种模式(如: ["push", "pop"]) 3.0.0
custom-effect string standard 否 是否启动自定义特效 暂不支持
voice-changer-type number 0 否 变声效果 暂不支持
skin-whiteness number 0 否 自定义特效美白效果 暂不支持
skin-smoothness number 0 否 自定义特效磨皮效果 暂不支持
face-thinness number 0 否 自定义特效瘦脸效果 暂不支持
eye-bigness number 0 否 自定义特效大眼效果 暂不支持
fps number 15 否 帧率 暂不支持
filter string standard 否 设置色彩滤镜 暂不支持
bindstatechange eventhandle 否 状态变化事件,detail = {code} 3.0.50
bindnetstatus eventhandle 否 网络状态通知,detail = {info} 3.0.50
binderror eventhandle 否 渲染错误事件,detail = {errMsg, errCode} 3.0.50
bindbgmstart eventhandle 否 背景音开始播放时触发 暂不支持
bindbgmprogress eventhandle 否 背景音进度变化时触发,detail = {progress, duration} 暂不支持
bindbgmcomplete eventhandle 否 背景音播放完成时触发 暂不支持
bindaudiovolumenotify eventhandle 否 返回麦克风采集的音量大小 暂不支持
bindenterpictureinpicture eventhandle 否 进入小窗的回调 3.4.1
bindleavepictureinpicture eventhandle 否 退出小窗的回调 3.4.1

# orientation 的合法值

值 说明 最低版本
vertical 竖直
horizontal 水平

# local-mirror 的合法值

值 说明 最低版本
auto 前置摄像头镜像,后置摄像头不镜像
enable 前后置摄像头均镜像
disable 前后置摄像头均不镜像

# audio-reverb-type 的合法值

值 说明 最低版本
0 关闭
1 KTV
2 小房间
3 大会堂
4 低沉
5 洪亮
6 金属声
7 磁性

# audio-volume-type 的合法值

值 说明 最低版本
auto 自动
media 媒体音量
voicecall 通话音量

# beauty-style 的合法值

值 说明 最低版本
smooth 光滑美颜
nature 自然美颜

# filter 的合法值

值 说明 最低版本
standard 标准
pink 粉嫩
nostalgia 怀旧
blues 蓝调
romantic 浪漫
cool 清凉
fresher 清新
solor 日系
aestheticism 唯美
whitening 美白
cerisered 樱红

# video

属性 类型 默认值 必填 说明 支持度
src string 是 要播放视频的资源地址,支持网络路径、本地临时路径 iOS:✅
Android:✅
Harmony:✅
duration number 否 指定视频时长 iOS:✅
Android:✅
Harmony:✅
controls boolean true 否 是否显示默认播放控件(播放/暂停按钮、播放进度、时间) iOS:✅
Android:✅
Harmony:✅
danmu-list Array 否 弹幕列表 iOS:✅
Android:✅
Harmony:✅
danmu-btn boolean false 否 是否显示弹幕按钮,只在初始化时有效,不能动态变更 iOS:✅
Android:✅
Harmony:✅
enable-danmu boolean false 否 是否展示弹幕,只在初始化时有效,不能动态变更 iOS:✅
Android:✅
Harmony:✅
enable-view-danmu boolean false 否 是否展示弹幕,仅同层 video 下有效,使用该配置时 enable-danmu 设置不再生效,基础库 3.5.9 起支持 iOS:✅
Android:✅
Harmony:✅
autoplay boolean false 否 是否自动播放 iOS:✅
Android:✅
Harmony:✅
loop boolean false 否 是否循环播放 iOS:✅
Android:✅
Harmony:✅
muted boolean false 否 是否静音播放 iOS:✅
Android:✅
Harmony:✅
initial-time number 0 否 指定视频初始播放位置 iOS:✅
Android:✅
Harmony:✅
direction number 否 设置全屏时视频的方向,不指定则根据宽高比自动判断 iOS:✅
Android:✅
Harmony:✅
show-progress boolean true 否 若不设置,宽度大于 240 时才会显示 iOS:✅
Android:✅
Harmony:✅
show-fullscreen-btn boolean true 否 是否显示全屏按钮 iOS:✅
Android:✅
Harmony:✅
show-play-btn boolean true 否 是否显示视频底部控制栏的播放按钮 iOS:✅
Android:✅
Harmony:✅
show-center-play-btn boolean true 否 是否显示视频中间的播放按钮 iOS:✅
Android:✅
Harmony:✅
enable-progress-gesture boolean true 否 是否开启控制进度的手势 iOS:✅
Android:✅
Harmony:✅
object-fit string contain 否 当视频大小与 video 容器大小不一致时,视频的表现形式 iOS:✅
Android:✅
Harmony:✅
poster string 否 视频封面的图片网络资源地址或云文件 ID(2.3.0)。若 controls 属性值为 false 则设置 poster 无效 iOS:✅
Android:✅
Harmony:✅
show-mute-btn boolean false 否 是否显示静音按钮 iOS:✅
Android:✅
Harmony:✅
title string 否 视频的标题,全屏时在顶部展示 iOS:✅
Android:✅
Harmony:✅
play-btn-position string bottom 否 播放按钮的位置 iOS:✅
Android:✅
Harmony:✅
enable-play-gesture boolean false 否 是否开启播放手势,即双击切换播放/暂停 iOS:✅
Android:✅
Harmony:✅
auto-pause-if-navigate boolean true 否 当跳转到本小程序的其他页面时,是否自动暂停本页面的视频播放 iOS:✅
Android:✅
Harmony:❌
auto-pause-if-open-native boolean true 否 当跳转到其它 APP 原生页面时,是否自动暂停本页面的视频 iOS:✅
Android:✅
Harmony:❌
vslide-gesture boolean false 否 在非全屏模式下,是否开启亮度与音量调节手势(同 page-gesture) iOS:✅
Android:✅
Harmony:❌
vslide-gesture-in-fullscreen boolean true 否 在全屏模式下,是否开启亮度与音量调节手势 iOS:✅
Android:✅
Harmony:❌
poster-for-crawler string 是 用于给搜索等场景作为视频封面展示,建议使用无播放 icon 的视频封面图,只支持网络地址 iOS:❌
Android:❌
Harmony:❌
show-casting-button boolean false 否 显示投屏按钮。Android 在同层渲染下生效,支持 DLNA 协议;iOS 支持 AirPlay 和 DLNA 协议 iOS:✅
Android:✅
Harmony:❌
picture-in-picture-mode string/Array 否 设置小窗模式: push, pop,空字符串或通过数组形式设置多种模式(如: ["push", "pop"]) iOS:✅
Android:✅
Harmony:❌
picture-in-picture-show-progress boolean false 否 是否在小窗模式下显示播放进度 iOS:✅
Android:✅
Harmony:❌
enable-auto-rotation boolean false 否 是否开启手机横屏时自动全屏,当系统设置开启自动旋转时生效 iOS:✅
Android:✅
Harmony:❌
show-screen-lock-button boolean false 否 是否显示锁屏按钮,仅在全屏时显示,锁屏后控制栏的操作 iOS:✅
Android:✅
Harmony:❌
show-snapshot-button boolean false 否 是否显示截屏按钮,仅在全屏时显示 iOS:✅
Android:✅
Harmony:❌
show-background-playback-button boolean false 否 是否展示后台音频播放按钮 iOS:❌
Android:✅
Harmony:❌
background-poster string 否 进入后台音频播放后的通知栏图标 iOS:✅
Android:✅
Harmony:✅
bindplay eventhandle 否 当开始/继续播放时触发 play 事件 iOS:✅
Android:✅
Harmony:✅
bindpause eventhandle 否 当暂停播放时触发 pause 事件 iOS:✅
Android:✅
Harmony:✅
bindended eventhandle 否 当播放到末尾时触发 ended 事件 iOS:✅
Android:✅
Harmony:✅
bindtimeupdate eventhandle 否 播放进度变化时触发,event.detail = { currentTime, duration } 。 iOS:✅
Android:✅
Harmony:✅
bindfullscreenchange eventhandle 否 视频进入和退出全屏时触发,event.detail = { fullScreen, direction },direction 有效值为 vertical 或 horizontal iOS:✅
Android:✅
Harmony:✅
bindwaiting eventhandle 否 视频出现缓冲时触发 iOS:✅
Android:✅
Harmony:❌
binderror eventhandle 否 视频播放出错时触发 iOS:✅
Android:✅
Harmony:✅
bindprogress eventhandle 否 加载进度变化时触发,只支持一段加载。event.detail = { buffered },百分比 iOS:✅
Android:✅
Harmony:❌
bindloadedmetadata eventhandle 否 视频元数据加载完成时触发。event.detail = { width, height, duration } iOS:✅
Android:✅
Harmony:❌
bindcontrolstoggle eventhandle 否 切换 controls 显示隐藏时触发。event.detail = { show } iOS:✅
Android:✅
Harmony:✅
bindseekcomplete eventhandler 否 seek 完成时触发 iOS:✅
Android:✅
Harmony:✅
bindenterpictureinpicture eventhandler 否 播放器进入小窗 iOS:❌
Android:❌
Harmony:❌
bindleavepictureinpicture eventhandler 否 播放器进入小窗 iOS:❌
Android:❌
Harmony:❌

注:

  • 2.11.2 基础库需搭配 SDK 2.34.1 版本使用
  • IDE 部分属性不支持设置,主要涉及全屏、手势、画中画模式等属性,建议用实机查看

# native-view

原生 view 容器

属性 类型 默认值 必填 说明 最低版本
type string camera 是 原生容器类型,设置只会不可改变
options string {} 否 传递给原生组件的自定义参数,使用 json 数据 string 格式化结果
bindontask eventhandle 否 接收原生组件发送事件

示例代码

<native-view
  type="{{type}}"
  options="{{options}}"
  bindready="bindonready"
></native-view>

注:如需全局监听 native-view 事件,参考 onCustomEvent API

# camera

属性 类型 默认值 必填 说明 支持度
mode string normal 否 应用模式,只在初始化时有效,不能动态变更 iOS:✅
Android:✅
Harmony:✅
resolution string medium 否 分辨率,不支持动态修改 iOS:✅
Android:✅
Harmony:✅
device-position string back 否 摄像头朝向 iOS:✅
Android:✅
Harmony:✅
flash string auto 否 闪光灯,值为 auto, on, off iOS:✅
Android:✅
Harmony:✅
frame-size string medium 否 指定期望的相机帧数据尺寸 iOS:✅
Android:✅
Harmony:✅
bindstop eventhandle 否 摄像头在非正常终止时触发,如退出后台等情况 iOS:✅
Android:✅
Harmony:✅
binderror eventhandle 否 用户不允许使用摄像头时触发 iOS:✅
Android:✅
Harmony:✅
bindinitdone eventhandle 否 相机初始化完成时触发,e.detail = {maxZoom} iOS:✅
Android:✅
Harmony:✅
bindscancode eventhandle 否 在扫码识别成功时触发,仅在 mode="scanCode" 时生效 iOS:✅
Android:✅
Harmony:✅