微信小程序媒体组件 camera


本文整理自网络,侵删。

camera


基础库 1.6.0 开始支持,低版本需做兼容处理。

系统相机。

需要用户授权 scope.camera

属性名 类型 默认值 说明
device-position String back 前置或后置,值为front, back
flash String auto 闪光灯,值为auto, on, off
bindstop EventHandle 摄像头在非正常终止时触发,如退出后台等情况
binderror EventHandle 用户不允许使用摄像头时触发

相关api:wx.createCameraContext

Bug & Tip
  1. tip: camera 组件是由客户端创建的原生组件,它的层级是最高的,不能通过 z-index 控制层级。可使用 cover-view cover-image覆盖在上面。
  2. tip: 同一页面只能插入一个 camera 组件。
  3. tip: 请勿在 scroll-view、swiper、picker-view、movable-view 中使用 camera 组件。

示例:

<!-- camera.wxml -->
<camera device-position="back" flash="off" binderror="error" style="width: 100%; height: 300px;"></camera>
<button type="primary" bindtap="takePhoto">拍照</button>
<view>预览</view>
<image mode="widthFix" src="{{src}}"></image>
// camera.js
Page({
    takePhoto() {
        const ctx = wx.createCameraContext()
        ctx.takePhoto({
            quality: 'high',
            success: (res) => {
                this.setData({
                    src: res.tempImagePath
                })
            }
        })
    },
    error(e) {
        console.log(e.detail)
    }
})

标签:微信小程序

相关阅读 >>

微信小程序api 实时语音-加入(创建)实时语音通话

微信小程序 code2seesion

微信小程序api 创建插屏广告组件

微信小程序云开发服务端数据库api 指定查询排序条件

微信小程序api getupdatemanager

微信小程序云开发api 获取数据库查询及更新指令

微信小程序云开发 支付方式

wxapp媒体组件 video

微信小程序 小程序使用onorderstatus

微信小程序api 地图-创建mapcontext对象

更多相关阅读请进入《微信小程序》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...