Flutter使用image_picker时相机图片无法添加到XFile列表如何解决

问题根因 #

你代码里的_imageFileList和pickedFile都声明为可空列表，初始值为null，首次调用相机拍照走非多选分支时，因为列表还没有被初始化，_imageFileList?.add(file!)和pickedFile?.add(file!)的空安全调用会直接跳过执行，自然没有元素被添加到列表里，所以读取长度就是null。
只有先选相册图片走多选分支时，pickMultiImage会返回已初始化的列表赋值给两个变量，后续再调用相机add才会正常执行。

正确实现方案 #

• 第一步：初始化时直接给列表赋空列表默认值，不要留空
  把原来的声明改成：

List<XFile> _imageFileList = [];
List<XFile> pickedFile = [];
XFile? file;

不需要声明为可空，避免后续空调用问题。

• 第二步：修改多选分支的赋值逻辑，可根据需求选择覆盖原有列表还是追加新选中的图片
• 第三步：修改单张拍照分支的逻辑，先判断返回的file不为空再添加到列表中

完整修改后代码参考 #

List<XFile> _imageFileList = [];
List<XFile> pickedFile = [];
XFile? file;
final ImagePicker _picker = ImagePicker();

void getImageFile(ImageSource source, bool multimage) async {
  if(multimage) {
    pickedFile = await _picker.pickMultiImage(
      maxWidth: double.infinity,
      maxHeight: double.infinity, 
      imageQuality: 10
    ) ?? [];
    setState(() {
      // 如果不需要保留之前的选中项，就放开下面的清空逻辑
      // _imageFileList.clear();
      _imageFileList.addAll(pickedFile);
      print('image selected');
      Navigator.of(context).pop();
      Flushbar(
        message:  'length of imagelist ${_imageFileList.length}',
        duration:  Duration(seconds: 5),
      )..show(context);
    });
  } else{
    file = await _picker.pickImage(
      source: source, 
      maxWidth: double.infinity,
      maxHeight: double.infinity, 
      imageQuality: 10
    );
    setState(() {
      if (file != null) {
        pickedFile.add(file!);
        _imageFileList.add(file!);
      }
      print('camera image selected');
      Navigator.of(context).pop();
      Flushbar(
        message:  'length of imagelist ${_imageFileList.length}',
        duration:  Duration(seconds: 5),
      )..show(context);
    });
  }
}

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