Flutter: отображать локальное изображение, если сетевое изображение не найдено или при его загрузке возникает ошибка?

Question

Center(
                child: CachedNetworkImage(
                  imageUrl: "http:/ sosme link here",
                  errorWidget: (context, url, error) => Icon(Icons.error),
                  fadeInCurve: Curves.easeIn ,
                  fadeInDuration: Duration(milliseconds:1000),
                  fadeOutCurve: Curves.easeOut,
                  fadeOutDuration: Duration(milliseconds:500),
                  imageBuilder: (context, imageProvider) => Container(
                    height: 250.0,
                    width: 250.0,
                    decoration: BoxDecoration(
                    border: Border.all(
                    color: Colors.black,
                    ),
                    borderRadius: BorderRadius.all(Radius.circular(10)),
                    color: Colors.white,
                    image: DecorationImage(
                    image: imageProvider,
                    fit: BoxFit.cover,
                    ),
                    ),
                  ),
                ),
              ),  

Моя цель - загрузить изображение с URL-адреса, который может существовать, а может и не существовать. Если URL не существует, загрузите изображение ресурса. Пытался вставить сюда изображение актива, но не помогло. Как я и думал, если есть ошибка при загрузке, это означает, что изображение не найдено или что-то еще. Поэтому я хочу вместо этого отображать локальное изображение.

Есть предложения?

errorWidget: (context, url, error) => Icon(Icons.error),

Ошибка при использовании изображения ресурса

Answer 1

Вы можете использовать FadeInImage виджет для вашего варианта использования ..

Вот вам образец ..

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final title = 'Fade in images';

    return MaterialApp(
      title: title,
      home: Scaffold(
        appBar: AppBar(
          title: Text(title),
        ),
        body: Center(
          child: FadeInImage.assetNetwork(
            placeholder: 'assets/loading.gif',
            image: 'https://picsum.photos/250?image=9',
          ),
        ),
      ),
    );
  }
}

Вы можете получить дополнительную информацию на официальном сайте .

Answer 2

Убедитесь, что изображение существует в папке ресурсов по пути. , например:

errorWidget: (context, url, error) => Image.asset('assets/images/image.jpg'),

И объявите этот путь внутри pubspec.yaml файла. Например:

assets:
    - assets/images/image.png