Conditional statement not working on ListTile onTap Flutter-CodePudding

I'm trying to put a condition for image opener in my app. If image is null then it shouldn't do anything but if there is some image coming then it should open it in full screen image opener but its not working. I'm fetching data in ListView.builder. Not all images are going to be null from database because the image is optional so some images will be coming, some will be not I can't fetch them all and put them into the image viewer it'll show broken image view which I don't want.

Update: Debug log gives this when I tap on no image ListTile index

Image provider: NetworkImage("", scale: 1.0)
Image key: NetworkImage("", scale: 1.0)

Here's my ListTile:

ListTile(
                        onTap: () async {
                          if (snapshot.data?.docs[index].data()['image'] !=
                              null) {
                            Navigator.of(context).push(MaterialPageRoute(
                                builder: (context) => ImageOpener(
                                      imageProvider: Image.network(
                                        snapshot.data?.docs[index]
                                            .data()['image'],
                                        errorBuilder:
                                            (context, error, stackTrrace) {
                                          return const Icon(Icons.error);
                                        },
                                      ).image,
                                    )));
                          } else if (snapshot.data?.docs[index]
                                  .data()['image'] ==
                             "") {
                            ScaffoldMessenger.of(context).showSnackBar(
                                const SnackBar(
                                    content: Text('No image to show')));
                          } else {
                            ScaffoldMessenger.of(context).showSnackBar(
                                const SnackBar(
                                    content: Text('No image to show')));
                          }
                        },
                        subtitle: Text(
                          snapshot.data?.docs[index].data()['notificationbody'],
                          style: const TextStyle(
                              // fontSize: 15,
                              ),
                        ),
                        title: Text(snapshot.data?.docs[index]
                                ['notificationtext'] ??
                            "Loading..."),
                        leading: const Icon(Icons.notifications),
                        trailing: Image.network(
                          snapshot.data?.docs[index].data()['image'],
                          errorBuilder: (context, error, stackTrrace) {
                            return const Visibility(
                              visible: false,
                              child: Padding(
                                padding: EdgeInsets.all(8.0),
                                child: Icon(Icons.error),
                              ),
                            );
                          },
                        ),
                      ),

CodePudding user response：

it is because data() returns an abject you should convert it to a map

var data = snapshot.data?.docs[index].data() as Map<String,dynamic>;

then you can check now if data['image'] is null

CodePudding user response：

Check if the image url is not empty (not null) and if it is not empty you can call your Navigator.push

if (snapshot.data?.docs[index].data()['image'].isNotEmpty) {
                            Navigator.of(context).push(MaterialPageRoute(
                                builder: (context) => ImageOpener(
                                      imageProvider: Image.network(
                                        snapshot.data?.docs[index]
                                            .data()['image'],
                                        errorBuilder:
                                            (context, error, stackTrrace) {
                                          return const Icon(Icons.error);
                                        },
                                      ).image,
                                    )));
                          }else{
                            ScaffoldMessenger.of(context).showSnackBar(
                                const SnackBar(
                                    content: Text('No image to show')));
                          }