uniapp微信小程序开发自定义相机
自定义相机,调用手机原生相机,自定义拍照或录制键。实际使用就是使用小程序的媒体组件<camera></camera>就可以了。
<view class=""> <camera class="camera" id="myCamera" :device-position="devicePosition" @error="onCameraError"> <view @click="handleClick">拍照</view> <view @click="handleCut">切换摄像头</view> </camera> <image :src="tempImagePath"></image> </view>
export default { data(){ return { tempImagePath: '', devicePosition: 'front' } }, methods: { onCameraError(error) { console.log('摄像头错误', error); }, handleClick(){ console.log('拍照'); let cameraContext = uni.createCameraContext(); // 创建camera上下文实例 cameraContext.takePhoto({ quality: 'high', // 指定拍照质量 success: (res) => { // 成功拍照的回调 console.log('拍照成功', res); this.tempImagePath = res.tempImagePath }, fail: (err) => { // 拍照失败的回调 console.error('拍照失败', err); } }); }, onCameraError(error) { console.log('摄像头错误', error); }, handleCut() { console.log('切换'); this.devicePosition = this.devicePosition == 'front' ? 'back' : 'front' } }, }