Skip to content

LimeCamera 相机

  • 参照小程序的camera组件和createCameraContextAPI实现。

安装

导入插件后,自定义基座再使用,请先试用后谨慎购买,一但购买没有退货。

基础使用

html
<l-camera style="height:750rpx; background-color: aqua;" @error="onError" :flash="flash" :device-position="device"></l-camera>
<image v-if="imagePath" :src="imagePath"></image>
<button @click="toggleFlash">切换闪光灯</button>
<button @click="toggledevice">切换前后置</button>
<button @click="takePhoto">拍照</button>
<button @click="setZoom">设置缩放</button>
<button @click="startRecord">开始录像</button>
<button @click="stopRecord">结束录像</button>
<button @click="startFrame">开启监听</button>
<button @click="stopFrame">关闭监听</button>
js
import { 
	createCameraContext, 
	TakePhotoOption,  
	TakePhotoSuccessCallbackResult,
	CameraContextSetZoomOption,
	SetZoomSuccessCallbackResult,
	CameraContextStartRecordOption,
	GeneralCallbackResult,
	CameraContextStopRecordOption,
	StopRecordSuccessCallbackResult
	} from '@/uni_modules/lime-camera'
const context = createCameraContext()

const flash = ref('off')
const device = ref('back')
const imagePath = ref('')
const onError = (err:any) => {
	console.log('err', err)
}

const toggleFlash = ()=>{
	flash.value = flash.value == 'on' ? 'off' : 'on'
}
const toggledevice = ()=>{
	device.value = device.value == 'back' ? 'front' : 'back'
}
const takePhoto = ()=>{
	let time = Date.now()
	context.takePhoto({
		success: (res:TakePhotoSuccessCallbackResult)=> {
			console.log('takePhoto time', Date.now() - time)
			imagePath.value = res.tempImagePath
			console.log('takePhoto', res.tempImagePath)
		}
	} as TakePhotoOption)
}
const setZoom = ()=>{
	context.setZoom({
		zoom: Math.random() * 10,
		success: (res:SetZoomSuccessCallbackResult)=> {
			console.log('setZoom', res.errMsg, res.zoom)
		}
	} as CameraContextSetZoomOption)
}

const startRecord = ()=>{
	context.startRecord({
		success(res: GeneralCallbackResult){
			console.log('startRecord')
		}
	} as CameraContextStartRecordOption)
}
const stopRecord = ()=>{
	context.stopRecord({
		success(result: StopRecordSuccessCallbackResult){
			console.log('stopRecord', result.tempThumbPath)
		}
	} as CameraContextStopRecordOption)
}
let listener = context.onCameraFrame()
const startFrame = ()=>{
	listener.start() 
}
const stopFrame = ()=>{
	listener.stop()
}

Props

因为直接参照小程序camera组件,所以可以直接按camera文档来。但不支持扫码。扫码可以使用lime-scan

参数说明类型默认值
focus是否开启点击对焦booleanfalse

事件

参数说明类型默认值
@click(event:UniEvent) => {}UniEvent

API

因为直接参照小程序createcameracontextAPI,所以可以直接按createcameracontext文档来。
onCameraFrame里的回调中的data为ImageProxy

ts
context.onCameraFrame((frame)=>{
	// 这里是 ImageProxy
	frame.data
})

源代码

组件源码