Flutter：如何在Container内添加控制相机闪光灯的FloatingActionButton

不需要额外引入torch类的包，camera库本身就提供了控制闪光灯的API。以下是修改后的完整代码，添加了闪光灯开关的FloatingActionButton：

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

class CameraScreen extends StatefulWidget {
  CameraScreen({Key? key, required this.controller}) : super(key: key);
  final CameraController controller;

  @override
  _CameraScreenState createState() => _CameraScreenState();
}

class _CameraScreenState extends State<CameraScreen> {
  // 跟踪闪光灯状态
  bool _isFlashOn = false;

  // 切换闪光灯方法
  Future<void> _toggleFlash() async {
    try {
      // 检查当前相机是否支持闪光灯并切换状态
      if (widget.controller.value.flashMode == FlashMode.torch) {
        await widget.controller.setFlashMode(FlashMode.off);
        setState(() => _isFlashOn = false);
      } else {
        await widget.controller.setFlashMode(FlashMode.torch);
        setState(() => _isFlashOn = true);
      }
    } catch (e) {
      // 处理相机未初始化、设备不支持闪光灯等异常
      debugPrint("闪光灯切换失败: $e");
    }
  }

  @override
  Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size.width;

    return Container(
      child: ShaderMask(
        shaderCallback: (rect) {
          return LinearGradient(
                  begin: Alignment.topCenter,
                  end: Alignment.center,
                  colors: [Colors.black, Colors.transparent])
              .createShader(Rect.fromLTRB(0, 0, rect.width, rect.height / 4));
        },
        blendMode: BlendMode.darken,
        child: Transform.scale(
          scale: 1.0,
          child: AspectRatio(
            aspectRatio: MediaQuery.of(context).size.aspectRatio,
            child: OverflowBox(
              alignment: Alignment.center,
              child: FittedBox(
                fit: BoxFit.fitHeight,
                child: Container(
                  width: size,
                  height: size / widget.controller.value.aspectRatio,
                  child: Stack(
                    children: <Widget>[
                      CameraPreview(widget.controller),
                      // 闪光灯开关按钮，定位在右下角
                      Positioned(
                        bottom: 20,
                        right: 20,
                        child: FloatingActionButton(
                          onPressed: _toggleFlash,
                          backgroundColor: _isFlashOn ? Colors.amber : Colors.grey[800],
                          child: Icon(
                            _isFlashOn ? Icons.flash_on : Icons.flash_off,
                            color: Colors.white,
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }

  @override
  void dispose() {
    // 页面销毁时自动关闭闪光灯
    widget.controller.setFlashMode(FlashMode.off);
    super.dispose();
  }
}

关键说明： #

• 利用camera库的setFlashMode方法控制闪光灯，FlashMode.torch对应常亮模式，FlashMode.off对应关闭状态
• 通过_isFlashOn变量跟踪状态，同步更新按钮的图标和背景色
• 在dispose方法中关闭闪光灯，避免页面销毁后闪光灯持续亮起
• 添加异常捕获，处理相机未初始化、设备无闪光灯等场景的错误

内容的提问来源于stack exchange，提问作者Kassa Suhar