Flutter原生相机实现拍照、录制视频、扫描二维码和条码系列1

本系列的Flutter文章分为三篇，这个是第一篇
Flutter原生相机开发系列第一篇，原生相机拍照的使用方法

第一步首先要引入flutter官方的相机库可以放心使用，官方链接

camera: ^0.10.5+2

第二步创建拍照的页面，并在页面中创建CameraController，flutter的相机库把所有的操作都封装在CameraController中了

class _CameraPageState extends State<CameraPage> {
    CameraController? _controller;
    Future<void>? _initializeControllerFuture;//相机初始化的回调 是异步的

第三步在需要设置屏幕的方向，因为可以横屏也可以竖屏拍照

@override
  void initState() {
    super.initState();
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.landscapeLeft,
      DeviceOrientation.landscapeRight,
      DeviceOrientation.portraitUp,
    ]);
    _initCamera();//初始化相机参数
  }

第四步初始化flutter的CameraController

void _initCamera() async {
    final cameras = await availableCameras();//获取设备可用的相机列表
    final firstCamera = cameras.first;

    _controller = CameraController(
      firstCamera,
      ResolutionPreset.high,
    );
    _initializeControllerFuture = _controller!.initialize();//初始化是异步的所以用一个Future来赋值
    setState(() {});
  }

小提示
availableCameras()获取到的是CameraDescription对象的集合，这个对象是相机属性的集合

@immutable
class CameraDescription {
  /// Creates a new camera description with the given properties.
  const CameraDescription({
    required this.name,//名称
    required this.lensDirection,//相机朝向
    required this.sensorOrientation,//相机感应的方向,有效值是0, 90, 180, 270
  });

第五步在页面的build方法中接收相机的预览

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      appBar: AppBar(
        title: Text('TakePicture'),
      ),
      body: FutureBuilder<void>(//因为是异步的 所以用FutureBuilder
        future: _initializeControllerFuture,
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            return Center(
              child: CameraPreview(_controller!),//相机库中的预览Widget
            );
          } else {
            return const Center(child: CircularProgressIndicator());
          }
        },
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () async {
          final image = await _controller!.takePicture();//拍照也是异步的
          Navigator.push(context,CupertinoPageRoute(builder: (cxt){
            return ImageResultPage(path: image.path);//直接获取图片的存储path就可以了
          }));
        },
        child: Text('shoot'),
      ),
    );
  }

第六步记得要将CameraController释放掉，根据需求进行屏幕旋转

@override
  void dispose() {
    _controller?.dispose();
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.portraitUp,
    ]);
    super.dispose();
  }

最后需要注意，相机需要申请权限，我是直接用的permission_handler
引入第三方库

permission_handler: ^10.4.3

获取权限的代码

Future<bool> _requestCameraPermission() async {
    var status = await Permission.camera.status;
    if (status == PermissionStatus.granted) {
      return true;
    } else {
      status = await Permission.camera.request();
      if (status == PermissionStatus.granted) {
        return true;
      } else {
        return false;
      }
    }
  }
调用方法
bool isOK = await _requestCameraPermission();

本篇文章结束，欢迎各位交流~下一篇文章将讲述使用flutter原生Camera库实现视频的录制