Question

我正在使用ImagePicker从图库中提取图像，如下所示：

ImageProvider backgroundImage;
String customImageFile;
File _image;

Future getImage() async {
  var image = await ImagePicker.pickImage(source: ImageSource.gallery);

  setState(() {
    _image = image;
  });

  customImageFile = _image.toString();
  SharedPreferences prefs = await SharedPreferences.getInstance();
  prefs.setString('customImageFile', customImageFile);
}

如您所见，我正在尝试将图像文件的URI存储到SharedPreferences中，以实现持久性，并在这样的应用程序中显示它：

Container(
  decoration: BoxDecoration(
    color: Colors.blueAccent,
      image: DecorationImage(
        image: _image == null ? backgroundImage :  FileImage(_image),
        fit: BoxFit.fill,
      ),
    ),
),

问题是我似乎无法获得customImageFile的字符串值来实际正确加载图像。

编辑：实际上，我可能偶然发现了原因，直到使用了字符串的打印转储，我才注意到这一点。实际的字符串是这样的：

File: '/storage/emulated/0/Download/images.jpeg'

不只是：

'/storage/emulated/0/Download/images.jpeg'

如果我可以在这里使用String的话，它可能会起作用。我在网上找不到有关如何忽略字符串的前6个字符的任何信息。在Java和Visual Basic中这样做很容易，但是我找不到该方法。

更新：设法将字符串减少为：

'/storage/emulated/0/Download/images.jpeg'

使用：

customImageFile = customImageFile.substring(6);

但现在它向我显示此错误：

Cannot open file, path = ''/storage/emulated/0/Download/images.jpeg'' (OS Error: No such file

因此我可以将子字符串值增加到7以删除第一个撇号，如何删除字符串的最后一个字符？

Answer 1

您应该首先检查该路径中是否存在该文件。然后，您可以使用如下所示的文件构造器加载图像。

var file = File(imagePath);
if(file.existsSync()){
    return Image.file(file);
}

Answer 2

我将Request Url直接包含在Image.network（）小部件中，并且有效。

这是代码：

Widget _buildImage() {

    return FadeInImage(
      image: NetworkImage(
          'https://www.google.com/url?sa=i&source=images&cd=&ved=2ahUKEwik1L3zwqziAhXRZCsKHSWiDYsQjRx6BAgBEAU&url=https%3A%2F%2Funsplash.com%2Fsearch%2Fphotos%2Fcountry&psig=AOvVaw2SLubeS_2uHAib1sXXcfRX&ust=1558524613660099'),

    );
  }

并且图像类具有用于该文件的文件构造函数-

https://docs.flutter.io/flutter/widgets/Image/Image.file.html

Image.file(File(path))

Answer 3

好的，所以我终于使它工作了，并将在这里为所有想要这样做的人提供完整的代码部分：

使用ImagePicker从库中提取图像，并将URI保存到SharedPreferences中以保持持久性：

ImageProvider backgroundImage;
String customImageFile;
File _image;

  Future getImage() async {
   var image = await ImagePicker.pickImage(source: ImageSource.gallery);

   setState(() {
     _image = image;
   });

   customImageFile = _image.toString();
   SharedPreferences prefs = await SharedPreferences.getInstance();
   prefs.setString('customImageFile', customImageFile);
}

如何在构建方法中显示图像，其中backgroundImage是要在用户选择自定义文件之前显示的占位符：

Container(
  decoration: BoxDecoration(
    color: Colors.blueAccent,
    image: DecorationImage(
      image: _image == null ? backgroundImage :  FileImage(_image),
      fit: BoxFit.fill,
    ),
  ),
),

现在customImageFile将不是合适的String值，以便再次从图库中找到此图像，因此我们需要编辑String以使其看起来像可以使用的东西。原始的customImageFile字符串：

File: '/storage/emulated/0/Download/images.jpeg'

修复：

customImageFile = customImageFile.substring(6);
customImageFile = customImageFile.replaceAll("'", "");

现在使我们的String看起来像这样：

/storage/emulated/0/Download/images.jpeg

我们现在可以将以前的建议用于其中，例如：

setState(() {
  _image =  File(customImageFile);
});

经过测试，工作正常。因此，现在我们可以使用存储在SharedPreferences中的String在应用程序启动时加载以前选择的图像。我将一个loadPreferences（）方法放入处理所有这类事情的initState（）中，进行处理。

希望这对某人有帮助，因为我在网上找不到任何相关信息。

Flutter：显示来自URI字符串或文件对象的图像

3 个答案: