Question

最小代码：

File _file;

Future<void> _pickImage() async {
  final image = await ImagePicker.pickImage(source: ImageSource.camera);

  if (image != null) {
    final file = File("${(await getApplicationDocumentsDirectory()).path}/image.png");
    await file.writeAsBytes(await image.readAsBytes());
    setState(() => _file = file); // `_file = image` works though
  }
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    floatingActionButton: FloatingActionButton(child: Icon(Icons.camera_alt), onPressed: _pickImage),
    body: _file == null ? Container() : Image.file(_file),
  );
}

Watch video

如您所见，一旦我选择了图像，它就可以工作，但是第二次选择它时，它就不起作用，而且我也不会遇到任何错误。谁能帮忙吗？

Answer 1

您需要三件事：

首先，您必须使用ImageProvider及其evict()方法：

var image = FileImage(File('someImage.jpg'));

然后，您需要Image小部件，该小部件在ImageProvider之上使用，并且还分配唯一的key，以便在每次调用build()方法时变得“不同”：

child: Image(
  image: image,
  key: UniqueKey(),
),

最后，在覆盖someImage.jpg之后，您必须调用evict()方法：

// part of your _pickImage() method
// here someImage.jpg contains updated content
image.evict();
setState(() {});

更新：实际上，您不需要var image = FileImage(File('someImage.jpg'));-您可以直接在Image小部件中以image: FileImage(File('someImage.jpg'))的形式使用它，并在图像后调用FileImage(File('someImage.jpg')).evict()被覆盖

ImagePicker，如何再次设置图像？

1 个答案: