web-dev-qa-db-ja.com

Flutter-失敗した場合のデフォルトの画像をImage.networkに

Image.network（）によって起動された例外を制御して、デフォルトのAssetImageを提供できる方法はありますか？

androidasynchronousnetworkingdartflutter
9
Jesús Martín

それはあなたのユースケースに依存しますが、それを行う1つの方法は、ロードする予定のイメージに対してFadeInImageのプロパティを持つ img を使用することです。 placeholder、まあ、プレースホルダー

new FadeInImage(image: new NetworkImage(url), placeholder: new AssetImage(assetName)

また、画像が読み込まれるまでリッスンし、画像のフェッチが解決されるまで自分でプレースホルダーを表示することもできます。

疑似コード

bool _loaded = false;
  var img = new Image.network(src);
  var placeholder = new AssetImage(assetName)

-----------> go to initState()  

    @override
      void initState() {
          img.image.resolve(ImageConfiguration()).addListener((i,b){
            mounted?setState((){
              _loaded = true;
            }):null;
          });
          super.initState();
        }

-----------> go where you build your widget 
        _loaded? img:placeholder
4
aziza

あなたはFadeInImage.assetNetworkで行うことができます

 child: new Container(
      child: FadeInImage.assetNetwork(
          placeholder: 'place_holder.jpg',
          image:url
      )
  )

pubspec.yaml

  assets:
  - assets/place_holder.jpgT
0
Lay Leangsros

問題：

何らかの理由で画像が正常に読み込まれなかった場合、Image.Networkはエラーウィジェットを表示する機能を提供していません。これは、URLが常に正しいことを意味しますか？

Flutterチームは画像ウィジェットに関する新しいビデオを13-01-2020（ https://www.youtube.com/watch?v=7oIAs-0G4mw ）にアップロードしましたが、それでも解決策はありませんでした。フラッターチームがこの問題をすぐに解決してくれることを願っています。

解決策：URLから画像をロードするための多くの機能を備えたキャッシュネットワーク画像を使用できます。キャッシュされたネットワークイメージの詳細については、次のURLにアクセスしてください。

https://pub.dev/packages/cached_network_image

パッケージのサンプルコード：

CachedNetworkImage(   
imageUrl: "http://via.placeholder.com/200x150",  
imageBuilder: 
(context, imageProvider) => 
    Container(
     decoration: BoxDecoration(
      image: DecorationImage(
          image: imageProvider,
          fit: BoxFit.cover,
          colorFilter:
              ColorFilter.mode(Colors.red, BlendMode.colorBurn)),
     ),   
    ),   
 placeholder: (context, url) => 
   CircularProgressIndicator(),  
 errorWidget: (context, url, error) 
  => Icon(Icons.error),
),
0
Wajid khan