Home > OS >  Widget is not updating even after notifying listeners
Widget is not updating even after notifying listeners

Time:03-19

Icons.favorite is not changing even after nofitifying listeners. Below is the code of the class that has a mixin of ChangeNotifier. I created a list of users in UserPosts which, but I did not include in here because I don't think there's a problem there. It returns the list as required

class UserPost with ChangeNotifier {
  final String? id;
  final String? name;
  final String? profileImage;
  final String? postImage;
  bool isFavorite;
  final int? likes;

  UserPost({
    this.likes,
    this.profileImage,
    this.id,
    this.name,
    this.postImage,
    this.isFavorite = false,
  });
  void switchFav(String? id) {
    UserPost user = UserPosts()._users.firstWhere((post) => post.id == id);
    user.isFavorite = !user.isFavorite;
    notifyListeners();
  }
}

And below is also the code that listens to the change. I've got below a Listview builder.

class UserPostItem extends StatelessWidget {
  const UserPostItem({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final userPost = Provider.of<UserPosts>(context, listen: false);
    return ListView.builder(
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      itemCount: userPost.users.length,
      itemBuilder: (context, i) {
        // final singleUserPost = userPost.users.firstWhere((post) => post.id == userPost.users[i].id);
        return Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Row(
                    children: [
                      Padding(
                        padding: const EdgeInsets.only(right: 8.0),
                        child: CircleAvatar(
                          backgroundImage:
                              NetworkImage(userPost.users[i].profileImage!),
                        ),
                      ),
                      Text(
                        userPost.users[i].name!,
                        style: Theme.of(context).textTheme.bodyMedium,
                      ),
                    ],
                  ),
                  const Icon(Icons.more_horiz)
                ],
              ),
            ),
            SizedBox(
              height: 330,
              child: Image.network(
                userPost.users[i].postImage!,
                fit: BoxFit.cover,
              ),
            ),
            Container(
              margin: const EdgeInsets.only(top: 10, right: 10),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Row(
                    children: [
                      const SizedBox(
                        width: 10,
                      ),
                      Consumer<UserPost>(
                        builder: (context, post, child) => GestureDetector(
                          onTap: () {
                            
                            post.switchFav(userPost.users[i].id);
                          },
                          child: Icon(post.isFavorite
                              ? Icons.favorite
                              : Icons.favorite_border),// This part is supposed to the new favorite icon.
                        ),
                      ),
                      const SizedBox(
                        width: 10,
                      ),
                      Image.asset(
                        'assets/icons/chat.png',
                        scale: 1.4,
                      ),
                      const SizedBox(
                        width: 10,
                      ),
                      Image.asset(
                        'assets/icons/send.png',
                        scale: 1.3,
                      ),
                    ],
                  ),
                  const Icon(Icons.bookmark_outline),
                ],
              ),
            ),
            Container(
              margin: const EdgeInsets.only(left: 10, top: 10, bottom: 8),
              child: Text('${userPost.users[i].likes} likes',
                  style: Theme.of(context).textTheme.bodySmall),
            ),
            Row(
              children: [
                Row(
                  children: [
                    const SizedBox(
                      width: 10,
                    ),
                    CircleAvatar(
                      backgroundImage:
                          NetworkImage(userPost.users[i].profileImage!),
                      radius: 10,
                    ),
                    const SizedBox(
                      width: 8,
                    ),
                    const Text(
                      'Add a comment...',
                      style: TextStyle(color: Colors.grey),
                    ),
                  ],
                ),
              ],
            ),
            const SizedBox(
              height: 15,
            )
          ],
        );
      },
    );
  }
}

CodePudding user response:

You need to use setState around your switchFav to force the widget to rebuild.

onTap: () {          
   setState(() {           
      //You action to rebuild the widget must be here like this
      post.switchFav(userPost.users[i].id);


   });
},

CodePudding user response:

Try have to setState while you want to update element on the widget

onTap: () {          
   setState(() {           
      post.switchFav(userPost.users[i].id);
   });
},
  • Related