Flutter USB视频类摄像头访问插件flutter_uvc_camera的使用

发布于 1周前 作者 songsunli 来自 Flutter

Flutter USB视频类摄像头访问插件 flutter_uvc_camera 的使用

flutter_uvc_camera 是一个基于 AndroidUSBCamera 的 Flutter 插件,用于在 Flutter 应用中使用外部摄像头设备。请注意,该插件仅支持 Android 平台。

前言

  • 仅支持 Android 平台。
  • 如果目标 Android 版本为 10(API 级别 29),需要将 targetSdkVersion 设置为 27 或更低版本。
  • 已知问题:Redmi Note 10 可能存在问题。

使用步骤

1. 添加依赖

pubspec.yaml 文件中添加 flutter_uvc_camera 插件的依赖:

dependencies:
  flutter_uvc_camera: last_version

请确保替换 last_version 为最新发布的版本号。

2. 配置 Android 项目

添加权限

AndroidManifest.xml 文件中添加以下权限:

<uses-permission android:name="android.permission.USB_PERMISSION" />
<uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-feature android:name="android.hardware.usb.host" />
<uses-feature android:name="android.hardware.camera"/>
<uses-feature android:name="android.hardware.camera.autofocus"/>
<!-- Add other necessary permissions here -->

build.gradle 中添加 Maven 仓库

android/build.gradle 文件中添加 JitPack 仓库:

allprojects {
    repositories {
        // other repositories
        maven { url "https://jitpack.io" }
    }
}

添加 Intent 过滤器和 Meta-data

为了检测 USB 设备插入并启动应用程序,请在 MainActivityintent-filter 中添加以下内容,并引用相应的 XML 文件:

<intent-filter>
    <action android:name="android.hardware.usb.action.USB_DEVICE_ATTACHED" />
</intent-filter>
<meta-data
    android:name="android.hardware.usb.action.USB_DEVICE_ATTACHED"
    android:resource="@xml/device_filter" />

device_filter.xml 文件示例:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <usb-device vendor-id="1234" product-id="5678" class="255" subclass="66" protocol="1" />
</resources>

3. 使用示例

以下是一个简单的示例代码,展示了如何使用 flutter_uvc_camera 插件来显示 UVC 摄像头的图像:

import 'package:flutter/material.dart';
import 'package:flutter_uvc_camera/uvc_camera_controller.dart';
import 'package:flutter_uvc_camera/uvc_camera_view.dart';

class CameraTest extends StatefulWidget {
  const CameraTest({super.key});

  @override
  State<CameraTest> createState() => _CameraTestState();
}

class _CameraTestState extends State<CameraTest> {
  UVCCameraController? cameraController;

  @override
  void initState() {
    super.initState();
    cameraController = UVCCameraController();
    cameraController?.msgCallback = (state) {
      showCustomToast(state);
    };
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('UVC Camera Example'),
        ),
        body: Center(
          child: UVCCameraView(
              cameraController: cameraController!,
              width: 300,
              height: 300),
        ),
      ),
    );
  }
}

问题

Release 模式下遇到 NoSuchMethodError

如果在发布模式下运行时遇到 NoSuchMethodError,请在 proguard-rules.pro 文件中添加以下规则:

-keep class com.jiangdg.uvc.UVCCamera {
    native <methods>;
    long mNativePtr;
}
-keep class com.jiangdg.uvc.IStatusCallback {
    *;
}

并在 build.gradle 文件中启用 ProGuard 规则:

buildTypes {
    release {
        proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        minifyEnabled true
    }
}

注意事项

  • 确保在使用插件之前配置好所需的权限,否则插件可能无法正常工作。
  • 目前该插件支持在 Flutter 项目中使用外部摄像头,但可能存在一些限制和兼容性问题,请根据实际需求进行测试和调整。

提交问题

如果您在使用过程中遇到任何问题或有任何建议,请在 GitHub Issues 上提交问题。


更多关于Flutter USB视频类摄像头访问插件flutter_uvc_camera的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter USB视频类摄像头访问插件flutter_uvc_camera的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是一个关于如何使用 flutter_uvc_camera 插件来访问 USB 视频类摄像头的 Flutter 代码示例。flutter_uvc_camera 是一个用于 Flutter 的插件,它允许你通过 USB 接口访问 UVC (USB Video Class) 兼容的摄像头。

首先,确保你已经在 pubspec.yaml 文件中添加了 flutter_uvc_camera 依赖:

dependencies:
  flutter:
    sdk: flutter
  flutter_uvc_camera: ^最新版本号 # 请替换为最新的版本号

然后运行 flutter pub get 来获取依赖。

接下来,是一个基本的 Flutter 应用示例,展示如何使用 flutter_uvc_camera 插件:

import 'package:flutter/material.dart';
import 'package:flutter_uvc_camera/flutter_uvc_camera.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter UVC Camera Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: CameraScreen(),
    );
  }
}

class CameraScreen extends StatefulWidget {
  @override
  _CameraScreenState createState() => _CameraScreenState();
}

class _CameraScreenState extends State<CameraScreen> {
  late FlutterUvcCamera _camera;
  late FlutterUvcCameraController? _controller;

  @override
  void initState() {
    super.initState();
    _camera = FlutterUvcCamera();
    _initializeCamera();
  }

  Future<void> _initializeCamera() async {
    // 请求摄像头权限
    bool hasPermission = await _camera.requestPermission();
    if (!hasPermission) {
      print("Camera permission denied");
      return;
    }

    // 初始化摄像头控制器
    _controller = await FlutterUvcCameraController.initialize(
      camera: _camera,
      resolutionPreset: ResolutionPreset.medium, // 可选参数,设置分辨率
    );

    // 当控制器初始化完成后,开始预览
    if (mounted) {
      setState(() {});
      _controller!.startImageStream((image) {
        // 在这里处理从摄像头获取的图像数据
        // 例如,将图像显示在 Image.memory 组件中
        print("Received image: ${image.lengthInBytes} bytes");
      });
    }
  }

  @override
  void dispose() {
    _controller?.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter UVC Camera'),
      ),
      body: Center(
        child: _controller == null || !_controller!.value.isInitialized
            ? CircularProgressIndicator()
            : Stack(
                alignment: Alignment.center,
                children: [
                  // 这里可以添加一个 Image.memory 组件来显示图像
                  // 例如: Image.memory(_latestFrame), 其中 _latestFrame 是从 _controller!.startImageStream 获取的最新帧
                  Container(
                    color: Colors.black,
                  ),
                  Text(
                    'Camera Preview',
                    style: TextStyle(color: Colors.white),
                  ),
                ],
              ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () async {
          if (_controller!.value.isStreamingImages) {
            await _controller!.stopImageStream();
          } else {
            await _controller!.startImageStream((image) {
              // 处理图像数据
              print("Received image: ${image.lengthInBytes} bytes");
            });
          }
        },
        tooltip: 'Toggle Camera Preview',
        child: Icon(
          _controller!.value.isStreamingImages ? Icons.pause : Icons.play_arrow,
        ),
      ),
    );
  }
}

注意事项:

  1. 权限处理:在实际应用中,你可能需要更细致地处理权限请求和拒绝的情况。
  2. 错误处理:代码示例中没有包含错误处理逻辑,例如初始化摄像头失败时的处理。
  3. 图像显示:代码示例中并未实际显示图像,只是打印了图像数据的字节大小。你需要自己实现图像显示逻辑,例如使用 Image.memory 组件。
  4. 插件版本:确保你使用的是最新版本的 flutter_uvc_camera 插件,因为 API 可能会随版本更新而变化。

这个示例提供了一个基础框架,你可以根据需要进行扩展和修改。

回到顶部