How can i add a network handling/placeholder in networkimage when the url return null?

  body: Center(
        child: ListView.builder(
            itemCount: users.length,
            itemBuilder: (BuildContext context, int index) {
              User user = users[index];
              return ListTile(
                  title: Text(user.firstName),
                
                  subtitle: Text(user.role),
                  leading: CircleAvatar(
                    backgroundImage: NetworkImage(user.avatar.toString()),
                     errorWidget: (context, url, error) =>  //this part not working
                     Icon(Icons.error),
                  ),
                  onTap: () {});
            })));

CodePudding user response：

There are two way to show network image with error handling:

One: use Image.network

Container(
          clipBehavior: Clip.antiAlias,
          height: 100,
          decoration: BoxDecoration(shape: BoxShape.circle),
          child:
              Image.network('wawdasda', errorBuilder: (context, object, trace) {
            return Container(
              color: Colors.red,
            );
          }),
        )

Two:

Container(
          clipBehavior: Clip.antiAlias,
          height: 100,
          decoration: BoxDecoration(shape: BoxShape.circle),
          child: Image(
            errorBuilder: (context, object, trace) {
              return Container(
                color: Colors.red,
              );
            },
            image: NetworkImage(
              'asdasdas',
            ),
          ),
        )

CodePudding user response：

Use following code.

body: Center(
        child: ListView.builder(
            itemCount: users.length,
            itemBuilder: (BuildContext context, int index) {
              User user = users[index];
              return ListTile(
                  title: Text(user.firstName),
                
                  subtitle: Text(user.role),
                  leading: CircleAvatar(
                    backgroundImage: Image.network('ImageURL....',
                            errorBuilder: (context, exception, stackTrace) {
                              return const Icon(Icons.error);
                            },
                          ), 
                  onTap: () {});
            })));