Флаттер: Сохранение и загрузка изображений из новой работы

#image #flutter #io #save #loading

Вопрос:

Мы стараемся сохранять, загружать и отображать изображения из сети, когда пользователь находится в автономном режиме

   void saveImage(String imageUrl, String imageName) async{
    File file = File(await getImagePath(mediaName));
    ByteData questionMediaData = await NetworkAssetBundle(Uri.parse(imageUrl)).load("");
    file.writeAsString(questionMediaData.buffer.asUint8List());
  }

  Future<Uint8List> loadImage(String mediaName) async{
    String path = imageUrl   mediaName;
    if(await File(path).exists()){
      File file = File(await getImagePath(path));
      return await file.readAsString();
    }
    return null;
  }

  Future<String> getImagePath(String imageName) async {
    Directory appDocumentsDirectory = await getApplicationDocumentsDirectory(); 
    String appDocumentsPath = appDocumentsDirectory.path;
    String filePath = '$appDocumentsPath/$imageName';
    return filePath;
  }
 

У нас есть класс ImageProvider:

     class OurImageProvider {

  static Widget getImage(String imageName, {BoxFit fit = BoxFit.cover, double width, double height, ImageType imageType = ImageType.standard}) {

    if(!hasText(imageName)){
      if(imageType == ImageType.content)
        return Image(
            image: AssetImage('assets/dummy_images/catalog_dummy.jpg'),
            fit: BoxFit.cover,
            width: width,
            height: height,
        );
      else
        return Container();
    }


    return Image.network(imageName, fit: fit, width: width, height: height,
      errorBuilder: (BuildContext context, Object exception, StackTrace stackTrace) {
        return getAltImage(imageName, width, height, fit);
      },

    );
  }

  static Image getDummyImage(double width, double height, BoxFit fit) => Image(image: AssetImage('assets/dummy_images/dummy.jpg'), width: width, height: height, fit: fit);

  static getAltImage(String imageName, double width, double height, BoxFit fit) async{
      var localImage = await LocalStorage.instance.loadImage(imageName);
      if(localImage != null){
        return Image.memory(localImage, fit: BoxFit.cover,width: width, height: height, errorBuilder: (BuildContext context, Object exception, StackTrace stackTrace) {
          return getDummyImage(width, height, fit);
        },);
      }
      return getDummyImage(width, height, fit);
    }
}
 

Наша проблема теперь в том, что я не нахожу способа исправить этот класс, так как getAltImage он должен быть асинхронным, и я не могу заставить getImage работу использоваться в качестве дочернего метода сборки…

Ответ №1:

Попробуйте добавить await :

 return Image.memory(await localImage,...);
 

Комментарии:

1. Это правильно, но не работает в нашем случае … Я перешел на вопрос с большим количеством кода, чтобы показать, в чем на самом деле заключается наша проблема — извините, подумал, что вопрос звучит более сжато…

Ответ №2:

FutureBuilder был решением в моем случае …

     return Image.network(url, fit: fit, width: width, height: height,
  errorBuilder: (BuildContext context, Object exception, StackTrace stackTrace) {
    return FutureBuilder(
      future: getAltImage(imageName, width, height, fit),
      builder: (context, snapshot){
        if(snapshot.hasData){
          print(snapshot.data.toString());
          return snapshot.data;
        }else{
          return Container();
        }
      }
    );
  },