微信小程序开发文档——媒体组件

本文主要介绍了微信小程序中的媒体组件,包括audio、image、video、camera、live-player和live-pusher。特别提到了audio组件建议使用wx.createInnerAudioContext接口,并详细说明了image组件的mode属性有13种模式。此外,还提及了video组件和camera组件,以及与之相关的api如wx.createCameraContext。
摘要由CSDN通过智能技术生成

媒体组件

  • audio (音频,建议使用能力更强的 wx.createInnerAudioContext 接口)
  • image(图片)
  • video(视频)
  • camera(系统相机)
  • live-player(实时音视频播放)
  • live-pusher(实时音视频录制)

1.  InnerAudioContext wx.createInnerAudioContext( )

2. image

属性名 类型 默认值 说明 最低版本
src String   图片资源地址,支持云文件ID(2.2.3起)  
mode String 'scaleToFill' 图片裁剪、缩放的模式  
lazy-load Boolean false 图片懒加载。只针对page与scroll-view下的image有效 1.5.0
binderror HandleEvent   当错误发生时,发布到 AppService 的事件名,事件对象event.detail = {errMsg: 'something wrong'}  
bindload HandleEvent   当图片载入完毕时,发布到 AppService 的事件名,事件对象event.detail = {height:'图片高度px', width:'图片宽度px'}  
aria-label String   无障碍访问,(属性)元素的额外描述 2.5.0

mode 有效值: mode 有 13 种模式,其中 4 种是缩放模式,9 种是裁剪模式。

模式 说明
缩放 scaleToFill 不保持纵横比缩放图片,使图片的宽高完全拉伸至填满 image 元素
缩放 aspectFit 保持纵横比缩放图片,使图片的长边能完全显示出来。也就是说,可以完整地将图片显示出来。
缩放 aspectFill 保持纵横比缩放图片,只保证图片的短边能完全显示出来。也就是说,图片通常只在水平或垂直方向是完整的,另一个方向将会发生截取。
缩放 widthFix 宽度不变,高度自动变化,保持原图宽高比不变
裁剪 top 不缩放图片,只显示图片的顶部区域
裁剪 bottom 不缩放图片,只显示图片的底部区域
裁剪 center 不缩放图片,只显示图片的中间区域
裁剪 left 不缩放图片,只显示图片的左边区域
裁剪 right 不缩放图片,只显示图片的右边区域
裁剪 top left 不缩放
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值