0

Tenho um método que consulta livros que estejam favoritados no banco de dados do Firestore, a página do livro possui um ícone de estrela em cor preta, uso método isFavorite para consultar se o livro aberto está favoritado pelo usuário ou não, caso esteja ele deverá retornar true e mudar a cor do ícone para amarelo porém a alteração não acontece.

O método updateFavorite funciona perfeitamente adicionado e removendo o livro favorito do banco ao tocar no ícone, somente a cor dele que não consigo configurar.

       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)){
              print("SIM");
              return true;
            }
            else {
              print("NÃO");
              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");
          print("DEU RUIM");
          return false;
        });

      }
2
  • 2
    Olá você já tentou colocar dentro de um setState não estou vendo controle de estado
    – Jameson
    Commented 1/04/2019 às 0:39
  • 1
    Como disse o @Jameson não vi controle de estado no código. Tente fazer um tratamento para que após obter os dados da informação que vai usar na sua tela, possa fazer a chamada algum método de controle de estado. O "SetState" é o mais simples deles. No momento que ele for chamado o Flutter vai fazer o build novamente do componente, desenhando assim a cor correta. Commented 1/04/2019 às 23:46

1 Resposta 1

2

Bom, conforme já comentaram, aparentemente você não está controlando o estado da sua aplicação de forma correta, sendo assim após a execução do seu método updateFavorite() você não está avisando o Flutter que ele deve renderizar novamente seu Icon.

Eu percebi que você utiliza 2 Futures, 1 para atualizar o favorito, e outro no ícone para de fato verificar se é ou não um favorito para renderizar a cor. Nesse caso você pode utilizar também um FutureBuilder, Widget bem bacaninha que sempre atualiza quando o Future tem o seu resultado. Criei um exemplo para você ter ideia do funcionamento e adaptar para o seu uso.

main.dart

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  YourBusiness yourBusiness = new YourBusiness();

  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
          body: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  FutureBuilder(
                    future: yourBusiness.isFavorite(''),
                    builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
                      bool isFavorite = false;
                      if(snapshot.hasData) { // Verificar se o Future possui dado
                        isFavorite = snapshot.data;
                      }

                      return Icon(Icons.ac_unit,
                        size: 160.0,
                        color: isFavorite ? Colors.greenAccent: Colors.black,
                      );
                    }
                  ),
                  RaisedButton(
                    child: Text('CHANGE COLOR'),
                    onPressed: () {
                      yourBusiness.updateFavorite('').then((bool) {
                        setState(() {});
                      });
                    },
                  ),
                  RaisedButton(
                    child: Text('SET STATE'),
                    onPressed: () {
                      setState(() {});
                    },
                  )
                ],
              )
            ],
          ),
        )
    );
  }
}

your_business.dart

class YourBusiness {

  bool _isFavorite = false;

  Future<bool> isFavorite(String yourParams) async {
    await Future.delayed(Duration(seconds: 1));

    // DO YOUR STUFF HERE

    return _isFavorite;
  }

  Future<bool> updateFavorite(String yourParams) async {
    await Future.delayed(Duration(seconds: 1));

    // DO YOUR STUFF HERE

    _isFavorite = true;
    return _isFavorite;
  }

}

Resultado

Resultado

Leve em consideração que cada vez que você der update no estado deste Widget, o Future do Icon será executado novamente, o que não é uma boa ideia, mas você pode definir outras estratégias, então vai da lógica que você quer montar no seu App.

Aconselho a utilização de algum padrão para controle de estado da aplicação, como o Bloc.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .