A way to show fallback image when the image is unavailable

[suztomo]

Thank you for maintaining this great library.

I’m looking for a way to show a fallback image when the specified GCS URL is unavailable. In my app there’s a possibility that a image is deleted in GSC but it is still referenced by FirebaseImage widget.

Current behavior I observed in my app: FirebaseImage uses cached data if available; otherwise it throws exception (no image). I wish there’s a way to show some error-indicating image in such case.

If it’s not available right now, I’m thinking to contribute a PR.

[lukepighetti]

@suztomo I would be in support of this PR, personally. We have a use case where we show the avatar FileImage from onboarding if we have it, otherwise we show a FirebaseImage, but if it's not available we'd like to show a "anonymous user" style avatar.

[suztomo]

With Flutter 1.17 stable release, Image widget has now has errorBuilder property.

https://api.flutter.dev/flutter/widgets/Image/errorBuilder.html

To me it seems that FirebaseImage is not the optimal place to handle image loading error. I might revisit this later (as I haven't tried Flutter 1.17), but closing this issue for now.

[mocha234]

@suztomo Hello. By any chance, any other workaround if want to maintain using FirebaseImage?

[suztomo]

@mocha234 No. Did you try the errorBuilder.

https://api.flutter.dev/flutter/widgets/Image/errorBuilder.html

[mocha234]

@suztomo

Works on Image, Image.network, Image.asset etc. as per docs, But not in FirebaseImage, I'm thinking of trying to edit the package from my side and see how it goes, advisable?

[suztomo]

Your observation indicates that FirebaseImage has not implemented certain features to tell error state. I’m afraid that I don’t have answer to that. Maybe worth a new GitHub issue?

[mocha234]

@suztomo Finally found a way.

By using FadeInImage ,

I got it by:

          FadeInImage(
                      placeholder: 
                     FirebaseImage('gs://XXXXXX.appspot.com/0.jpg'),

                      image: 
                      FirebaseImage('gs://XXXXXXX.appspot.com/$someID.jpg'),
                      imageErrorBuilder: (
                    BuildContext context,
                    Object error,
                    StackTrace stackTrace
                  )
                  {
                    print("error");
                  //  return Text("error");
                    return Image(image : AssetImage('assets/testimage.jpg')) ;
                    
                    
                    },

                    )

Glad that I still can use this package, as the features really cool, and suitable for my current project.

[suztomo]

Great. Thank you for sharing the solution!

[mocha234]

@suztomo But the downfall is, I can't put animation in the placeholder, e.g. Flare loading bar etc.