MyCamera/pages/index/index.uvue

<template>
	<!-- #ifdef APP -->

	
	<scroll-view class="page-scroll-view">
	<!-- #endif -->
		<view>
			<!-- <video class="video" :src=videoPath :controls="true"></video> -->				
			<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="_addFrameCallback">设置监听</button>
			<button @click="_startFrame">开启监听</button>
			<button @click="_stopFrame">关闭监听</button>
			<xf-camera style="height:750rpx; background-color: red;" @error="onError" :flash="flash"
				:position="device"></xf-camera>
			<image v-if="imagePath" mode="aspectFit" :src="imagePath"></image>
		</view>
	<!-- #ifdef APP -->
	</scroll-view>
	<!-- #endif -->
</template>

<script>
	import {
		//createCameraContext,
		stopCameraFrame,
		startCameraFrame,
		onCameraFrameListener,
		takePhoto,
		startRecord,
		stopRecord,
		setZoom,
		TakePhotoOption,
		TakePhotoSuccessCallbackResult,
		CameraContextSetZoomOption,
		SetZoomSuccessCallbackResult,
		CameraContextStartRecordOption,
		GeneralCallbackResult,
		CameraContextStopRecordOption,
		StopRecordSuccessCallbackResult,
		OnCameraFrameCallbackResult,
		CameraFrameListenerStartOption,
		StopOption,
		OnCameraFrameListenerOption
	} from '@/uni_modules/MY-cameraUTS'
	

	export default {
		data() {
			return {
				yanse: "red",
				widthNum: 750,
				heightNum: 200,
				
				flash: "on",
				device: "front",
				imagePath: "",
				videoPath: "https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4"
			}
		},
		onLoad() {

		},
		methods: {
			onError(res : any) {
				console.log(res)
			},
			_toggleFlash() {
				this.flash = this.flash == 'on' ? 'off' : 'on'
				console.log(this.flash)
			},
			_toggledevice() {
				this.device = this.device == 'back' ? 'front' : 'back'
				console.log(this.device)

			},
			_takePhoto() {
				takePhoto({
					success: (res : TakePhotoSuccessCallbackResult) => {
						console.log('takePhoto', res)
						this.imagePath = res.tempImagePath;
						// _previewImage();
					},
					fail: (res : GeneralCallbackResult) => {
						console.log('takePhoto', res)
					}
				} as TakePhotoOption)
			},
			// _previewImage() {
			// 	console.log('previewImage')
			// 	// uni.previewImage({
			// 	// 	urls: [this.imagePath],
			// 	// 	complete(e : any) {
			// 	// 		console.log(JSON.stringify(e))
			// 	// 	}
			// 	// });
			// 	uni.previewImage({
			// 		urls: ["https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png"],
			// 		current: 0,
			// 		indicator: "number",
			// 		loop: true,
			// 		complete(e : any) {
			// 			console.log(JSON.stringify(e))
			// 		}
			// 	} as PreviewImageOptions)
			// },
			_setZoom() {
				setZoom({
					zoom: Math.random() * 10,
					success: (res : SetZoomSuccessCallbackResult) => {
						console.log('setZoom', res.errMsg, res.zoom)
					},
					complete: (res : GeneralCallbackResult) => {
						console.log('setZoom', res)
					},
				} as CameraContextSetZoomOption)
			},
			_startRecord() {
				startRecord({
					success(res : GeneralCallbackResult) {
						console.log('startRecord', res)
					},
					complete(res : GeneralCallbackResult) {
						console.log('startRecord', res)
					},
				} as CameraContextStartRecordOption)
			},
			_stopRecord() {
				let that = this;
				stopRecord({
					success(result : StopRecordSuccessCallbackResult) {
						console.log('stopRecord', result.tempVideoPath)
						that.videoPath = result.tempVideoPath;
						
						// startVideo({
						// 	url: result.tempVideoPath,
						// 	isAutoPlay: true,
						// 	isLive: false,
						// 	//headers: { "key1": 1, "key2": 2 },
						// 	// options: { "op1": 1, "op2": 2 },
						// 	success: (res) => {
						// 		console.log(res)
						// 	}
						// } as StartVideoOption);
					}
				} as CameraContextStopRecordOption)
			},
			_addFrameCallback() {
				onCameraFrameListener({
					success: (res : OnCameraFrameCallbackResult) => {
						console.log('onCameraFrame', res)
					}
				} as OnCameraFrameListenerOption)
			},
			_startFrame() {
				startCameraFrame({
					success: (res : GeneralCallbackResult) => {
						console.log('startCameraFrame', res)
					}
				} as CameraFrameListenerStartOption)
			},
			_stopFrame() {
				stopCameraFrame({
					success: (res : GeneralCallbackResult) => {
						console.log('stopCameraFrame', res)
					}
				} as StopOption)
			}
		}
	}
</script>

<style>
	.video {
		width: 100%;
		height: 200px;
	}
</style>