Flutter使用scan:^1.6.0读取二维码仅热重载后更新UI求助

你的问题出在错误地将异步逻辑放在了setState的同步回调中。setState的回调函数是同步执行的，里面的await操作不会触发状态更新——当异步操作完成时，setState的回调已经执行完毕，UI不会自动刷新，只有热重载后才会读取到更新后的res值。

修改后的代码如下：

class _ReadFromImgState extends State<ReadFromImg> {
  File? image;
  final ImagePicker picker = ImagePicker();
  String res = '';

  Future pickImage() async {
    // 先执行所有异步操作，拿到结果
    final pickedImage = await picker.pickImage(source: ImageSource.gallery);
    if (pickedImage == null) return;
    
    final tmpfile = File(pickedImage.path);
    final scanResult = await Scan.parse(pickedImage.path);
    
    // 调用setState更新状态，触发UI重建
    setState(() {
      image = tmpfile;
      res = scanResult ?? ''; // 增加空值判断，避免直接赋值null报错
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Center(
          child: ElevatedButton(
              onPressed: pickImage,
              child: const Text("选择图片")),
        ),
        const SizedBox(height: 20), // 增加间距优化布局
        Center(
          child: Text(res.isEmpty ? '暂无解析结果' : res),
        ),
      ],
    ));
  }
}

关键改动说明： #

• 把异步操作（选择图片、解析二维码）从setState回调中移出，先完成所有异步逻辑再更新状态
• 增加空值处理scanResult ?? ''，避免Scan.parse返回null时的异常
• 优化UI细节，增加默认提示文本和间距，提升用户体验

修改后，用户选择图片并完成二维码解析后，setState会立即触发UI重建，解析结果就能即时显示在屏幕上了。

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