Flutter 表单构建器 - FormBuilderImagePicker答案

【问题标题】：Flutter form builder - FormBuilderImagePickerFlutter 表单构建器 - FormBuilderImagePicker
【发布时间】：2021-03-21 10:03:36
【问题描述】：

我让我的用户从图库或使用相机将图像上传到我的应用程序。然后将图像作为字符串存储在 SQflite 数据库中

FormBuilderImagePicker(
  name: 'photo',
  decoration: InputDecoration(labelText: 'Upload Image'),
  maxImages: 1,
  onSaved:(val){
    try{
      selectedImg = val.first;
      imageBytes = selectedImg.readAsBytesSync(); // convert to bytes
      base64Image = base64Encode(imageBytes); // convert to string
      object.photo = base64Image;
    }catch(e){
      print(e);
    }
  }
),

此代码在 flutter_form_builder v3 上运行良好，现在在迁移到 v4 后，val 的值永远不会更新到所选图像，因为我收到以下错误：

E/flutter (24620): [ERROR:flutter/lib/ui/ui_dart_state.cc(177)] Unhandled Exception: NoSuchMethodError: The getter 'iterator' was called on null.
E/flutter (24620): Receiver: null
E/flutter (24620): Tried calling: iterator

E/flutter (24620): #0      Object.noSuchMethod (dart:core-patch/object_patch.dart:51:5)
E/flutter (24620): #1      new FormBuilderImagePicker.<anonymous closure>.<anonymous closure>.<anonymous closure>.<anonymous closure> (package:flutter_form_builder/src/fields/form_builder_image_picker.dart:187:58)
E/flutter (24620): #2      _ImageSourceBottomSheetState._onPickImage (package:flutter_form_builder/src/widgets/image_source_sheet.dart:89:33)
E/flutter (24620): <asynchronous suspension>
E/flutter (24620): #3      _ImageSourceBottomSheetState.build.<anonymous closure> (package:flutter_form_builder/src/widgets/image_source_sheet.dart:111:28)
E/flutter (24620): #4      _InkResponseState._handleTap (package:flutter/src/material/ink_well.dart:993:19)
E/flutter (24620): #5      _InkResponseState.build.<anonymous closure> (package:flutter/src/material/ink_well.dart:1111:38)
E/flutter (24620): #6      GestureRecognizer.invokeCallback (package:flutter/src/gestures/recognizer.dart:183:24)
E/flutter (24620): #7      TapGestureRecognizer.handleTapUp (package:flutter/src/gestures/tap.dart:598:11)
E/flutter (24620): #8      BaseTapGestureRecognizer._checkUp (package:flutter/src/gestures/tap.dart:287:5)
E/flutter (24620): #9      BaseTapGestureRecognizer.acceptGesture (package:flutter/src/gestures/tap.dart:259:7)
E/flutter (24620): #10     GestureArenaManager.sweep (package:flutter/src/gestures/arena.dart:157:27)
E/flutter (24620): #11     GestureBinding.handleEvent (package:flutter/src/gestures/binding.dart:362:20)
E/flutter (24620): #12     GestureBinding.dispatchEvent (package:flutter/src/gestures/binding.dart:338:22)
E/flutter (24620): #13     RendererBinding.dispatchEvent (package:flutter/src/rendering/binding.dart:267:11)
E/flutter (24620): #14     GestureBinding._handlePointerEvent (package:flutter/src/gestures/binding.dart:295:7)
E/flutter (24620): #15     GestureBinding._flushPointerEventQueue (package:flutter/src/gestures/binding.dart:240:7)
E/flutter (24620): #16     GestureBinding._handlePointerDataPacket (package:flutter/src/gestures/binding.dart:213:7)
E/flutter (24620): #17     _rootRunUnary (dart:async/zone.dart:1206:13)
E/flutter (24620): #18     _CustomZone.runUnary (dart:async/zone.dart:1100:19)
E/flutter (24620): #19     _CustomZone.runUnaryGuarded (dart:async/zone.dart:1005:7)
E/flutter (24620): #20     _invoke1 (dart:ui/hooks.dart:265:10)
E/flutter (24620): #21     _dispatchPointerDataPacket (dart:ui/hooks.dart:174:5)

我已经尝试调试了几个小时，但没有成功，任何帮助将不胜感激！

【问题讨论】：

你确定 val 不为空吗？另外，你能在 catch 块中捕捉到这个异常吗？
在所有其他表单字段中，val 的值都会在更改时毫无问题地更新，是的，catch 按预期工作，但同样，在包的 v3 上。
所以我找到了一个办法：看来现在你必须设置 FormBuilderImagePicker 的 initialValue: []，它才能工作

标签： android flutter dart flutter-form-builder

【解决方案1】：

根据package's Changelog for version [4.2.0] (Dec 29, 2020)（见截图），开发人员“从包中删除了图像选择器字段 - 移至separate form_builder_image_picker package。”

如果你赶时间，一个快速的选择是使用早期版本的包，但这不是一个很好的长期解决方案，所以你可能想要正确实施更新版本。

【讨论】：