Reload network Images in a listView after failed load in flutter

Question

I am trying to query some data from fire store into a listView. Each fire store document has a file field containing a url of an image stored in fore storage. below is the code for getting the image at the url:

Image.network(
                              imageUrl,
                              // fit: BoxFit.scaleDown,
                              width: MediaQuery.of(context).size.width,
                              fit: BoxFit.cover,
                              frameBuilder: (context, child, frame,
                                      bool wasSynchronouslyLoaded) =>
                                  wasSynchronouslyLoaded
                                      ? child
                                      : SizedBox(
                                          height: MediaQuery.of(context)
                                                  .size
                                                  .height *
                                              0.7,
                                          child: AnimatedOpacity(
                                            child: child,
                                            opacity: frame == null ? 0 : 1,
                                            duration:
                                                const Duration(seconds: 2),
                                            curve: Curves.easeOut,
                                          ),
                                        ),
                              loadingBuilder:
                                  (context, child, loadingProgress) =>
                                      (loadingProgress == null)
                                          ? child
                                          : Container(
                                              height: MediaQuery.of(context)
                                                      .size
                                                      .height *
                                                  0.7,
                                              child: Center(
                                                child:
                                                    CircularProgressIndicator(),
                                              ),
                                            ),
                              errorBuilder: (context, error, stackTrace) =>
                                  Container(
                                height: MediaQuery.of(context).size.height *
                                    0.7,
                                width: MediaQuery.of(context).size.width,
                                child: Column(
                                  mainAxisAlignment:
                                      MainAxisAlignment.center,
                                  children: [
                                    Text("failed to load image!"),
                                    ElevatedButton(
                                        onPressed: () {
                                          
                                        },
                                        child: Text("tap to reload"))
                                  ],
                                ),
                              ),
                            )

I want that incase any of the images failed to load, the user can reload the image by pressing the elevated button in the errorBuilder. I have have tried out this solution here and here but they are not working. Will be very grateful for any help. thank you!