更新记录
1.0.1(2024-12-10)
1、升级稳定性。
2、新增分辨率设置。
3、新增摄像头旋转。
4、新增demo apk。
4、更新使用方法。
1.0.0(2024-10-18)
新版本上传
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 4.29,Android:6.0,iOS:不支持,HarmonyNext:不确定 |
× |
× |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
鸿蒙元服务 |
× |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
× |
× |
× |
× |
× |
× |
× |
× |
× |
使用示例
<template>
<view>
<view class="camera">
<laowu-uvccamera v-if="showCamera" class="camera-uvc" @captureSuccess="captureSuccess" @deviceList="getDeviceList"
ref="laowuCameraUvc" style="width: 360px;height: 265px;" />
<view class="camera-list">
<view class="item-camera" @click="openCamera(index as Int)" v-for="(item,index) in cameraList" :key="index">
设备:
ID: {{item['id']}},
name: {{item['name']}},
manufacturerName:{{ item['manufacturerName'] }},
productName:{{item['productName']}},
vendorId:{{item['vendorId']}},
productId:{{item['productId']}},
</view>
</view>
<view class="button-list">
<view class="button-item" @click="capture">
拍照
</view>
<view class="button-item" @click="getSupportedSizeList">
获取支持的分辨率
</view>
<view class="button-item" @click="rotateBy">
旋转摄像头
</view>
</view>
</view>
</view>
</template>
<script>
import Size from "com.serenegiant.usb.Size";
import JSONObject from "org.json.JSONObject";
type VForObject = {
index : number,
id : number,
name : string,
manufacturerName : string,
productName : string,
version : string,
serialNumber : string,
vendorId : number,
productId : number
}
export default {
data() {
return {
showCamera: false,
cameraList: [] as Array<VForObject>,
initCamera: false
}
},
onLoad() {
this.showCamera = true
},
methods: {
// 拍照成功回调
captureSuccess(e : UTSJSONObject) {
console.log(e)
},
// 获取支持的分辨率
getSupportedSizeList() {
if (!this.initCamera) {
uni.showToast({
title: '请先打开摄像头',
icon: 'none'
});
return;
}
let size : MutableList<Size> = (this.$refs['laowuCameraUvc'] as LaowuUvccameraElement).getSupportedSizeList();
console.log(size)
},
// 获取设备列表回调
getDeviceList(str : string) {
let list = JSON.parse(str)
this.cameraList = [];
for (let i = 0; i < (list as Array).length; i++) {
let row = (list[i] as UTSJSONObject)
this.cameraList.push({
id: row['id'] as number,
index: row['index'] as number,
name: row['name'] as string,
manufacturerName: row['manufacturerName'] as string,
productName: row['productName'] as string,
version: row['version'] as string,
serialNumber: row['serialNumber'] as string,
vendorId: row['vendorId'] as number,
productId: row['productId'] as number
} as VForObject)
}
},
// 旋转摄像头
rotateBy() {
if (!this.initCamera) {
uni.showToast({
title: '请先打开摄像头',
icon: 'none'
});
return;
}
(this.$refs['laowuCameraUvc'] as LaowuUvccameraElement).rotateBy(90);
},
// 拍照
capture() {
if (!this.initCamera) {
uni.showToast({
title: '请先打开摄像头',
icon: 'none'
});
return;
}
(this.$refs['laowuCameraUvc'] as LaowuUvccameraElement).capture();
},
// 打开摄像头 摄像头编号
openCamera(cameraIndex : Int) {
this.initCamera = true;
// 第二个参数是分辨率,支持的分辨率可以通过getSupportedSizeList方法获得,
let _fpsList : Int[] = [30, 15, 10];
let previewSize : Size = new Size(7, 800, 600, 30, _fpsList);
(this.$refs['laowuCameraUvc'] as LaowuUvccameraElement).startApp(cameraIndex, previewSize);
}
}
}
</script>
<style>
.camera {}
.camera-uvc {
margin: auto;
}
.item-camera {
width: 80%;
margin: auto;
margin-bottom: 20px;
margin-top: 10px;
}
.button-list {
width: 80%;
margin: auto;
margin-bottom: 20px;
margin-top: 10px;
}
</style>
演示查看
