更新记录

1.0.3（2026-03-12）

修复绘制框完全匹配识别到物品

1.0.2（2026-03-12）

修改文档

1.0.1（2026-03-12）

修改package

平台兼容性

uni-app(5.03)

安装

将 uni_modules/rd-camera 目录复制到项目的 uni_modules 目录下。

Vue2 使用示例

<template>
  <view class="container">
    <!-- 相机组件 -->
    <rd-YOLO 
      ref="camera"
      class="camera-preview"
      @onCameraReady="onCameraReady"
      @onModelLoaded="onModelLoaded"
      @onYoloDetectFull="onYoloDetectFull"
      @onImageDetectFull="onImageDetectFull"
      @onPhoto="onPhoto"
      @onError="onError"
    />

    <!-- 控制按钮 -->
    <view class="controls">
      <button @click="capturePhoto">拍照</button>
      <button @click="chooseFromAlbum">相册</button>
      <button @click="switchCamera">切换摄像头</button>
      <button @click="toggleFlash">闪光灯</button>
    </view>
    <image :src="img" style="width: 750rpx;height: 500rpx;"></image>
  </view>
</template>

<script>
export default {
  data() {
    return {
        img:'',
      isRecording: false,
      recordingDuration: 0,
      isCameraReady: false
    }
  },

  methods: {
    // 相机就绪回调
    onCameraReady(e) {
      console.log('相机已就绪', e.detail.message)
      this.isCameraReady = true
    },
    onModelLoaded({detail}){
        console.log(detail)
        // this.$refs.camera.startYoloDetection()
    },
    // 拍照
    capturePhoto() {
      if (!this.isCameraReady) {
        uni.showToast({ title: '相机未就绪', icon: 'none' })
        return
      }
      // 参数: true 保存到相册, false 只保存到缓存
      this.$refs.camera.takePhoto(false)
    },
    // 从相册选择图片
    chooseFromAlbum() {
      uni.chooseImage({
        count: 1,
        sizeType: ['original', 'compressed'],
        sourceType: ['album'],
        success: (res) => {
          const tempFilePaths = res.tempFilePaths
          console.log('选择的图片:', tempFilePaths[0])
          // 调用完整检测
          this.$refs.camera.detectImageFull(tempFilePaths[0])
        },
        fail: (err) => {
          console.log('选择图片失败:', err)
        }
      })
    },
    onPhoto({detail}){
        this.img = 'file://'+detail.path;
        console.log('截图保存到:', detail.path)
    },
    onYoloDetectFull({detail}){
        console.log(detail)
    },
    // 拍照结果回调
    onPhotoCaptured(e) {
      const { success, message, path } = e.detail
      if (success) {
        console.log('拍照成功，路径:', path)
        uni.showToast({ title: '拍照成功', icon: 'success' })
      } else {
        console.error('拍照失败:', message)
        uni.showToast({ title: message, icon: 'none' })
      }
    },
    // 监听完整结果
    onImageDetectFull(e) {
      const { path, results, imageWidth, imageHeight } = e.detail
      console.log(e.detail)
      this.img = path;
      results.forEach(item => {
        console.log(`检测到: ${item.label}, 置信度: ${(item.confidence * 100).toFixed(1)}%`)
        console.log(`位置: X:${item.x}, Y:${item.y}, 尺寸: 宽度:${item.width},高度:${item.height} ，原图尺寸: 宽度:${imageWidth},高度:${imageHeight}`)
      })
    },
    // 切换摄像头
    switchCamera() {
      this.$refs.camera.switchCamera()
    },
    // 切换闪光灯
    toggleFlash() {
      const result = this.$refs.camera.toggleFlash()
      uni.showToast({ 
        title: result ? '闪光灯已开启' : '闪光灯已关闭', 
        icon: 'none' 
      })
    },
    // 错误回调
    onError(e) {
      console.error('相机错误:', e.detail.message)
      uni.showToast({ title: e.detail.message, icon: 'none' })
    }
  }
}
</script>

<style>
.container {
  flex: 1;
}

.camera-preview {
  width: 750rpx;
  height: 500rpx;
}

.controls {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 20rpx;
}
</style>