使用方法

安卓UVC摄像头UTS原生插件集成了同一个组件可在一个页面多次加载不同摄像头，插件支持自定义摄像头排版，同时集成了录像、拍照、设置镜像、亮度调节，摄像头设备按钮监听等功能，拍照可自定义水印，插件支持uniapp和uniapp x，支持vue2和vue3的选项式和组合式

使用建议

在app启动的时候可以先调用API的清除缓存功能，因为插件中使用了持久性缓存，有可能在app异常退出的时候加载的摄像头在缓存中导致摄像头再次加载时失败

联系作者

关注微信公众号可联系作者

插件地址

权限

android.permission.CAMERA
android.hardware.camera
android.hardware.camera.autofocus
android.permission.WRITE_EXTERNAL_STORAGE
android.permission.READ_EXTERNAL_STORAGE
android.hardware.usb.host

API用法

在使用插件的地方引入以下代码：

uniappx

import * as module from "@/uni_modules/leven-uts-uvc"

组件用法

在使用插件的地方引入以下代码：

uniappx

vue

<leven-uts-uvc ref="refLevenUvc" style="flex:1; height: 300px;" :config="config" @onEvent="onEvent"
  @onError="onError">
</leven-uts-uvc>

//组件的引用
const refLevenUvc = ref<LevenUtsUvcElement | null>(null)

页面内容

API页面

uniappx

vue

<template>
  <view>
    <button type="primary" @click="ApiClearCache">清除缓存</button>
    <button type="primary" @click="requestPermissions">申请插件所需权限</button>
    <button type="primary" @click="getDeviceList">获取摄像头列表</button>
    <!-- <button type="primary" @click="requestUsbPermission">获取摄像头权限</button> -->
    <button type="primary" @click="ApiUsbStatusListener">监听usb状态</button>
  </view>
</template>

<script setup>
  import * as module from "@/uni_modules/leven-uts-uvc"

  //监听usb状态
  function ApiUsbStatusListener() {
    module.usbStatusListener({
      success: (res : any) => {
        console.log(res)
      }
    })
  }

  // //获取摄像头权限
  // function requestUsbPermission() {
  //   module.requestUsbPermission(res => {
  //     console.log(res)
  //   })
  // }

  //获取摄像头列表
  function getDeviceList() {
    module.getDeviceList({
      success: (res : any) => {
        console.log(res)
      },
      fail: (res : any) => {
        console.log(res)
      }
    })
  }

  //申请插件所需权限
  function requestPermissions() {
    module.requestPermissions({
      success: (res : any) => {
        console.log(res)
      },
      fail: (res : any) => {
        console.log(res)
      }
    })
  }

  //清除缓存
  function ApiClearCache() {
    module.clearCache({
      success: (res : any) => {
        console.log(res)
      }
    })
  }
</script>

<style>

</style>

组件页面

uniappx

vue

<template>
  <!-- #ifdef APP -->
  <scroll-view style="flex:1">
  <!-- #endif -->
    <view>
      <view style="width: 750rpx; height: 300px; position: relative;">
        <leven-uts-uvc ref="refLevenUvc" style="flex:1; height: 300px;" :config="config" @onEvent="onEvent"
          @onError="onError">
        </leven-uts-uvc>
      </view>
      <view>
        <button type="primary" @click="open">开启摄像头</button>
        <button type="primary" @click="close">关闭摄像头</button>
        <button type="primary" @click="startPreview">开启预览</button>
        <button type="primary" @click="stopPreview">关闭预览</button>
        <button type="primary" @click="startRecording">开始录像</button>
        <button type="primary" @click="stopRecording">结束录像</button>
        <button type="primary" @click="takePicture">拍照</button>
        <button type="primary" @click="getDeviceList">获取摄像头列表</button>
        <button type="primary" @click="switchCamera">切换摄像头</button>
        <button type="primary" @click="fullScreen">全屏</button>
        <button type="primary" @click="getBrightnessPercent">获取摄像头亮度百分比</button>
        <button type="primary" @click="setBrightnessPercent">设置摄像头亮度百分比</button>
        <button type="primary" @click="getContrastPercent">获取摄像头的对比度百分比</button>
        <button type="primary" @click="setContrastPercent">设置摄像头对比度百分比</button>
        <button type="primary" @click="setMirror">设置镜像</button>
        <button type="primary" @click="getPreviewSize">获取预览分辨率</button>
        <button type="primary" @click="getSupportedSizeList">获取支持的分辨率</button>
        <button type="primary" @click="setButtonCallback">监听按钮</button>
      </view>
    </view>
  <!-- #ifdef APP -->
  </scroll-view>
  <!-- #endif -->
</template>

<script lang="uts" setup>
  import JSONObject from 'com.alibaba.fastjson.JSONObject';
  import { resultCallback } from '../../uni_modules/leven-uts-uvc/utssdk/app-android/common/resultObject'
  const config = ref<JSONObject>(new JSONObject())
  const refLevenUvc = ref<LevenUtsUvcElement | null>(null)
  //摄像头列表
  const deviceList = ref<JSONObject[] | null>(null)
  //当前摄像头索引
  const deviceIndex = ref<Number>(0)
  //镜像模式
  const mirror = ref<Number>(0)
  onMounted(() => {
    nextTick(() => {
      const config : JSONObject = new JSONObject();
      //视图的圆角值
      config.put("radius", 10)
      refLevenUvc.value?.startLoad(config)
    })
  })
  //**********************************方法*********************************
  //监听按钮
  function setButtonCallback() {
    refLevenUvc.value?.setButtonCallback()
  }
  //获取支持的分辨率
  function getSupportedSizeList() {
    refLevenUvc.value?.getSupportedSizeList()
  }
  //获取预览分辨率
  function getPreviewSize() {
    refLevenUvc.value?.getPreviewSize()
  }
  //设置镜像
  function setMirror() {
    mirror.value++;
    if (mirror.value > 4) {
      mirror.value = 0;
    }
    const params : JSONObject = new JSONObject();
    params.put("mirror", mirror.value);
    refLevenUvc.value?.setMirror(params)
  }
  //设置摄像头对比度百分比
  function setContrastPercent() {
    const params : JSONObject = new JSONObject();
    params.put("percent", 30);
    refLevenUvc.value?.setContrastPercent(params)
  }
  //获取摄像头的对比度百分比
  function getContrastPercent() {
    refLevenUvc.value?.getContrastPercent()
  }
  //设置摄像头亮度百分比
  function setBrightnessPercent() {
    const params : JSONObject = new JSONObject();
    params.put("percent", 30);
    refLevenUvc.value?.setBrightnessPercent(params)
  }
  //获取摄像头亮度百分比
  function getBrightnessPercent() {
    refLevenUvc.value?.getBrightnessPercent()
  }
  //全屏
  function fullScreen() {
    refLevenUvc.value?.fullScreen()
  }
  //切换摄像头
  function switchCamera() {
    if (deviceList.value == null || deviceList.value.length == 0) {
      uni.showToast({
        title: "请先获取摄像头列表",
        icon: "none"
      })
      return;
    }
    deviceIndex.value++;
    if (deviceIndex.value >= deviceList.value.length) {
      deviceIndex.value = 0;
    }
    const deviceName = deviceList.value[deviceIndex.value].getString("deviceName")
    const params : JSONObject = new JSONObject();
    params.put("deviceName", deviceName)
    refLevenUvc.value?.switchCamera(params)
  }
  //获取摄像头列表
  function getDeviceList() {
    refLevenUvc.value?.getDeviceList()
  }

  //拍照
  function takePicture() {
    //拍照参数
    const params : JSONObject = new JSONObject();
    //是否返回base64数据，默认：false
    params.put("base64", false);
    //水印参数，不添加水印可以不设置此参数
    const waterParams : JSONObject = new JSONObject();
    //水印内容
    waterParams.put("text", "这是一条测试水印");
    //文本颜色，默认：白色
    waterParams.put("color", "#FFFFFF")
    //文本大小，默认：20
    waterParams.put("textSize", 40)
    //文本样式，NORMAL：常规(默认)，BOLD：加粗，ITALIC：斜体，BOLD_ITALIC：斜体加粗
    waterParams.put("typeFace", "NORMAL");
    //是否使用抗锯齿功能，默认：true
    waterParams.put("antiAlia", true)
    //透明度（0~255），默认：128
    waterParams.put("alpha", 128)
    //水印位置，0：左上角(默认)，1.右上角，2.左下角，3.右下角
    waterParams.put("position", 2)
    //水印左边距，默认：40
    waterParams.put("leftMargin", 40)
    //水印右边距，默认：40
    waterParams.put("rightMargin", 40)
    //水印上边距，默认：40
    waterParams.put("topMargin", 40)
    //水印下边距，默认：40
    waterParams.put("bottomMargin", 40)
    //水印
    const water : JSONObject[] = [];
    water.push(waterParams)
    params.put("water", water);
    refLevenUvc.value?.takePicture(params);
  }
  //结束录像
  function stopRecording() {
    refLevenUvc.value?.stopRecording();
  }
  //开始录像
  function startRecording() {
    refLevenUvc.value?.startRecording();
  }
  //关闭预览
  function stopPreview() {
    refLevenUvc.value?.stopPreview();
  }
  //开启预览
  function startPreview() {
    refLevenUvc.value?.startPreview();
  }
  //关闭摄像头
  function close() {
    refLevenUvc.value?.close();
  }
  //开启摄像头
  function open() {
    refLevenUvc.value?.open();
  }
  //**********************************事件*********************************
  //通用事件
  function onEvent(e : JSONObject) {
    console.log(e)
    //事件名称
    const event : String = e.getString("event");
    //事件结果数据
    const result : JSONObject = e.getJSONObject("data")
    //结果的code值，0：成功，其他：失败
    const code : Int = result.getInteger("code");
    //结果的数据
    const data : JSONObject = result.getJSONObject("data");
    if (code != 0) {
      return;
    }
    //结果的消息，一般code不为0时的错误消息
    switch (event) {
      case "onOpen":
        //相机打开事件
        break
      case "onClose":
        //相机关闭事件
        break
      case "onStopPreview":
        //关闭预览
        break
      case "onStartPreview":
        //开启预览
        break
      case "onStartRecording":
        //开始录像
        break
      case "onStopRecording":
        //结束录像
        break
      case "onTakePicture":
        //拍照
        break
      case "onGetDeviceList":
        //获取摄像头列表
        //摄像头列表
        deviceList.value = [];
        // deviceList.value = data.getJSONArray("deviceList")
        const devices = data.getJSONArray("deviceList")
        devices.forEach((item : any) => {
          const obj = item as JSONObject
          deviceList.value?.push(obj)
        })
        break
      case "onSwitchCamera":
        //切换摄像头
        break
      case "onFullScreen":
        //全屏
        break
      case "onQuitFullScreen":
        //退出全屏
        break
      case "onGetBrightnessPercent":
        //获取当前摄像头亮度百分比
        break
      case "onSetBrightnessPercent":
        //设置当前摄像头亮度百分比
        break
      case "onGetContrastPercent":
        //获取当前摄像头的对比度百分比
        break
      case "onSetContrastPercent":
        //设置当前摄像头对比度百分比
        break
      case "onSetMirror":
        //设置镜像
        break
      case "onGetPreviewSize":
        //获取当前预览分辨率
        break
      case "onGetSupportedSizeList":
        //获取支持的分辨率
        break
      case "onSetButtonCallback":
        //设置按钮回调事件
        break
      case "onButton":
        //按钮点击事件
        break
      case "onAttach":
        //摄像头插入
        break
      case "onDeviceOpen":
        //打开设备
        break
      case "onCameraOpen":
        //打开摄像头
        break
      case "onCameraClose":
        //关闭摄像头
        break
      case "onDeviceClose":
        //关闭设备
        break
      case "onDetach":
        //断开连接
        break
      case "onCancel":
        //取消设备
        break
      case "onRecordingResult":
        //视频录制结果
        break
    }
  }
  //错误事件
  function onError(e : any) {
    console.log(e)
  }
</script>

<style>

</style>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305

通用事件

使用方法 ​

使用建议 ​

联系作者 ​

插件地址 ​

权限 ​

API用法 ​

组件用法 ​

页面内容 ​

API页面 ​

组件页面 ​

使用方法

使用建议

联系作者

插件地址

权限

API用法

组件用法

页面内容

API页面

组件页面