首页 > 解决方案 > Flutter - 如何通过布尔返回更改图标的颜色?

问题描述

我有一个函数可以检查 Firestore 中收藏了哪些书籍,书籍屏幕有一个星形图标,我使用 isFavorite 函数检查打开的书籍是否被用户收藏,如果是,则返回 true 并且图标需要将其颜色更改为黄色,如果不是,则返回 false 并且颜色需要为黑色,但颜色不会改变。

updateFavorite 功能可以完美地在触摸图标时从 Firestore 添加和删除最喜欢的书。

InkWell(
          child: Icon(
            Icons.star,
            size: 30,
            color: isFavorite == true ? Colors.yellow
            : Colors.black,
          ),
          onTap: (){

            model.updateFavorite(model.getUserId(), document.documentID);
          },
        ),

==============

Future<bool> isFavorite() async{

            firebaseUser = await _auth.currentUser();

            DocumentSnapshot favoritesRef = await Firestore.instance.collection("users")
                .document(firebaseUser.uid).get();

            if(favoritesRef.data["favorites"].contains(document.documentID)){

              return true;
            }
            else {

              return false;
            }

          }

==============

      Future<bool> updateFavorite(Future<DocumentReference> uid, String bookId) async{

        firebaseUser = await _auth.currentUser();

        DocumentReference favoritesRef = Firestore.instance.collection("users")
            .document(firebaseUser.uid);

        return Firestore.instance.runTransaction((Transaction tx) async{

          DocumentSnapshot postSnapshot = await tx.get(favoritesRef);
          if(postSnapshot.exists){

            if(!postSnapshot.data["favorites"].contains(bookId)){
              await tx.update(favoritesRef, <String, dynamic>{
                "favorites": FieldValue.arrayUnion([bookId])

              });
              // Delete de bookId from Favorites
            } else {
              await tx.update(favoritesRef, <String, dynamic>{
                "favorites": FieldValue.arrayRemove([bookId])
              });

            }

          }

        }).then((result){
          print(firebaseUser.uid);
          print(bookId);
          return true;

        }).catchError((error){
          print("Error: $error");

          return false;
        });

      }

标签: dartfluttergoogle-cloud-firestoreboolean

解决方案


我建议你不要isFavorite()直接使用 from build。该build方法可能会不断被调用,并且它必须立即拥有所需的所有数据。(并且必须处理数据的缺失,例如,加载动画)

建议:

  • bool isFavorite在您的State班级中创建一个属性
  • 将您的方法更改isFavorite()_loadFavorite()
  • in ,而不是返回值,而是使用_loadFavorite()更新属性isFavoritesetState()
  • 呼入_loadFavorite()_initState()

对于 的默认值,您isFavorite可以将其定义为.initState()falsenullbuildnullIcon

如果需要,您可以附加listen到 firestore 引用以监视它是否被更改,如果发生更改,您也可以使用更新状态setState()


推荐阅读