微信小程序|调用相机
本文首发于微信公众号："算法与编程之美"，欢迎关注，及时了解更多此系列文章。
相机是一个媒体组件，调用相机听起来很复杂，但其实比设计导航或列表界面更为简单。
使用camera组件不需要在wxss添加样式，只需要在js提供数据以及在wxml绑定数据即可调用相机。
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>Js:
// pages/headline/headline.js
Page({
takePhoto(){
const ctx=wx.createCameraContext()
ctx.takePhoto({
quality:'high',
success:(res)=>{
this.set.Data({
src:res.tempImagePath
})
}
})
},
error(e){
console.log(e.detail)
}
})效果图：
图1 调用相机
代码解释：
device-position是控制摄像头朝向的属性，前置为front,后置为back，默认调用后置。flash则是负责闪光灯的属性，值为auto,on和off。binderror是一个事件属性（即需要在特定情况下才能触发），他的触发条件是在用户不允许使用相机时。
组件的使用代码并不繁杂，但是要理解它的含义还需要更深入的学习。
本文参与 腾讯云自媒体同步曝光计划，分享自微信公众号。
原始发表：2020-01-08，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
腾讯云开发者
