如何在 onPress 颤动之前根据条件更改 listView 加载时 IconButton 的颜色？

Question

我有一个ListView 的帖子，并且在每一行或每个帖子中都有IconButton。现在用户可以喜欢任何帖子。我需要检查用户是否喜欢某个帖子，并且该帖子就像IconButton 将是蓝色的。用户不喜欢的帖子，IconButton 颜色将为灰色。我需要在帖子列表加载时检查它。

列表：

    children: <Widget> [
        Row(
           children: <Widget>[
           new IconButton(
           icon: new Icon(Icons.thumb_up),

           // documentId = list[index].id;
           // want to get documentId in this way from here and pass this documentId to the method like  checkPostLikedOrNot(documentId); 
           //  checkFeedLikedOrNot(documentId ); 
           // want to call this method here and check the conditon    
           
          color:(isPressed) ? Color(0xff007397) : Color(0xff9A9A9A),
           onPressed: (){
             print(widget.userId); // userId
             documentId = list[index].id;
             _counter = list[index].data()["like_count"];
             _incrementCounter(); // updating table with userId in this method
              },
            ),
          ],
        ),
      ],

检查方法：

    checkFeedLikedOrNot(documentId) async{
      DocumentReference docRef = FirebaseFirestore.instance.collection('post').doc(documentId);
      DocumentSnapshot docSnapshot = await docRef.get();
      List likedUser = docSnapshot.data()['liked_user_id'];
      if(likedUser.contains(widget.userId) == true){
         print('user already exist=='+ widget.userId);
         //color will be blue
      }else{
         //color will be grey
    }
  }

大楼ListView

return ListView.builder(
                  shrinkWrap: true,
                  primary: false,
                  itemCount: list.length,
                  itemBuilder:(context, index)  {
                    print(index);
                    return Card(
                      elevation: 5,
                      shape: Border(bottom: BorderSide(color: Colors.lightBlue, width: 5)),
                        child: Column(
                            children: <Widget> [
                              ListTile(

我该怎么做？

Answer 1

关于提高安全性的说明：您的 API 应该有一种方法来检查用户是否喜欢 userId 和 postId 的帖子（或通过分页获取给定 userId 的所有喜欢帖子的 ID）。这不是获取所有喜欢帖子的用户的好方法。

您可以使用FutureBuilder。

检查方法应该返回Future<bool>

   Future<bool> checkFeedLikedOrNot(documentId) async {
      DocumentReference docRef = FirebaseFirestore.instance.collection('post').doc(documentId);
      DocumentSnapshot docSnapshot = await docRef.get();
      List likedUser = docSnapshot.data()['liked_user_id'];
      return likedUser.contains(widget.userId);
  }

那么你可以使用FutureBuilder得到Icon

  Widget getIcon(documentId) {
    return FutureBuilder<bool>(
      builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
        Color color = Colors.grey; // set proper default color
        if (snapshot != null && snapshot.connectionState == ConnectionState.done &&
            snapshot.hasData != null) {
          color = Colors.blue; // set proper "liked" color
        }
        return Icon(
            Icons.thumb_up,
            color: color,
          );
      },
      future: checkFeedLikedOrNot(documentId),
    );
  }

并在IconButton中使用这个方法

new IconButton(
           icon: getIcon(list[index].id),

           // documentId = list[index].id;
           // want to get documentId in this way from here and pass this documentId to the method like  checkPostLikedOrNot(documentId); 
           // checkFeedLikedOrNot(documentId ); 
           // want to call this method here and check the conditon    
           
          color:(isPressed) ? Color(0xff007397) : Color(0xff9A9A9A),
           onPressed: (){
             print(widget.userId); // userId
             documentId = list[index].id;
             _counter = list[index].data()["like_count"];
             _incrementCounter(); // updating table with userId in this method
              },
            ),