单击按钮动态更改文本Widget文本

Question

这是我的密码。我从Firebase获取值TotalVotes，并在一个Text-widget中显示它的值，我希望在任何人点击按钮并更新Text小部件时增加TotalVotes计数。但是我无法更新Text-widget，只有刷新页面后才能更新Text-widget的值。

Row(
  children: <Widget>[
    Text("Total Votes: $TotalVotes",
        style: TextStyle(color: Colors.white, fontSize: 12)),
    SizedBox(width: 30),
    FadeAnimation(
      2,
      Container(
          decoration: BoxDecoration(
              color: Color(0xFFF1f94aa).withOpacity(.6),
              borderRadius: BorderRadius.circular(8)),
          child: Padding(
            padding: const EdgeInsets.all(4.0),
            child: FadeAnimation(
                3,
                InkWell(
                  child: ItemIcon(Icons.favorite_border, "  Vote"),
                  onTap: () {
                    DatabaseReference database = FirebaseDatabase
                        .instance
                        .reference()
                        .child("Vote")
                        .child(Name);

                    database.once().then((DataSnapshot dataSnapshot) {
                      print(dataSnapshot.value['TotalVotes']);
                      String totalvote = (int.parse(
                                  dataSnapshot.value['TotalVotes']) +
                              1)
                          .toString();
                      database.child("TotalVotes").set(totalvote);
                      setState(() {
                        TotalVotes = totalvote;
                      });
                      Fluttertoast.showToast(
                          msg: 'Voted Successfully');
                    });
                  },
                )),
          )),
    ),
  ],
),

整体Widget代码

Widget VoteForTomorrowUi(String ImageUrl,String Name,String Price,String TotalVotes,)<------------------------------------
  {

    return
      FadeAnimation(2,Container(
        margin: EdgeInsets.only(right: 20),
    height: 210,
    width: 220,
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(20),
          color: Color(0xFFF082938)
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[

          Expanded(
            child: Container(
              width: 220,
              padding: EdgeInsets.all(10),
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(20),
                  image: DecorationImage(
                      image: NetworkImage(ImageUrl),
                      fit: BoxFit.fill
                  )
              ),
            ),
          ),
    Container(
      margin: EdgeInsets.all(10),
      height: 51,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text("Price: "+Price, style: TextStyle(
              color: Colors.white,
              fontSize: 12
          )),
          SizedBox(height: 5),
          Row(
            children: <Widget>[
              Text("Total Votes: $TotalVotes" ,style: TextStyle(
                  color: Colors.white,
                  fontSize: 12
              )),
              SizedBox(width: 30),
              FadeAnimation(2, Container(
                  decoration: BoxDecoration(color:Color(0xFFF1f94aa).withOpacity(.6),borderRadius: BorderRadius.circular(8)

                  ),
                  child: Padding(
                    padding: const EdgeInsets.all(4.0),
                    child: FadeAnimation(3,InkWell(
                        child: beacheItemIcon(Icons.favorite_border, "  Vote"),
                      onTap: (){
                          DatabaseReference database = FirebaseDatabase.instance.reference()
                              .child("VoteForTomorrow").child(Name);

                          database.once().then((DataSnapshot dataSnapshot){

                                  print(dataSnapshot.value['TotalVotes']);
                                  String totalvote = (int.parse(dataSnapshot.value['TotalVotes'])+1).toString();
                                  database.child("TotalVotes").set(totalvote);
                                  setState(() {
                                    TotalVotes = totalvote;  <--------------------------
                                  });
                                  Fluttertoast.showToast(msg: 'Voted Successfully');



                          });
                      },

                    )
                    ),
                  )),
              ),
            ],
          )
    ])
    )

        ],
      ),

      ) );
  }

淡色动画

class FadeAnimation extends StatelessWidget {
  final double delay;
  final Widget child;

  FadeAnimation(this.delay, this.child);

  @override
  Widget build(BuildContext context) {
    final tween = MultiTrackTween([
      Track("opacity").add(Duration(milliseconds: 500), Tween(begin: 0.0, end: 1.0)),
      Track("translateY").add(
        Duration(milliseconds: 500), Tween(begin: -130.0, end: 0.0),
        curve: Curves.easeOut)
    ]);

    return ControlledAnimation(
      delay: Duration(milliseconds: (500 * delay).round()),
      duration: tween.duration,
      tween: tween,
      child: child,
      builderWithChild: (context, child, animation) => Opacity(
        opacity: animation["opacity"],
        child: Transform.translate(
          offset: Offset(0, animation["translateY"]), 
          child: child
        ),
      ),
    );
  }
}

这里是TotalVotes

  void initState() {
    super.initState();
    DatabaseReference postRef = FirebaseDatabase.instance.reference().child("Category");
    DatabaseReference postRef2 = FirebaseDatabase.instance.reference().child("VoteForTomorrow");
    postRef2.once().then((DataSnapshot dataSnapshot2){
      var Keys = dataSnapshot2.value.keys;
      var Datas = dataSnapshot2.value;

      voteForTomorrowList.clear();
      for(var individualKey in Keys)
        {
          VoteForTomorrow voteForTomorrow = new VoteForTomorrow(
            Datas[individualKey]['ImageUrl'],
            Datas[individualKey]['Name'],
            Datas[individualKey]['Price'],
            Datas[individualKey]['TotalVotes'],

          );
          voteForTomorrowList.add(voteForTomorrow);
        }

      setState(() {

      });
    });

，这就是我如何称呼投票人的方式

VoteForTomorrowUi(voteForTomorrowList[index].ImageUrl, voteForTomorrowList[index].Name, voteForTomorrowList[index].Price, voteForTomorrowList[index].TotalVotes);

Answer 1

没有看到您的代码作为一个整体，我可能仍然有点困惑，但我使用您的小部件和FutureBuilder，这是可行的。

 @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: FutureBuilder<DataSnapshot>(
          future: FirebaseDatabase.instance
              .reference()
              .child("VoteForTomorrow")
              .child('Name')
              .child('TotalVotes')
              .once(),
          builder:
              (BuildContext context, AsyncSnapshot<DataSnapshot> snapshot) {
            return Center(
              child: VoteForTomorrowUi(
                'https://static.photocdn.pt/images/articles/2017/11/29/articles/2017_8/iStock-641093712-min.jpg',
                'Name',
                'Price',
                snapshot.data.value,
              ),
            );
          }),
    );
  }
}

我只是为其他值放置了一些虚拟数据，但小部件是相同的，我唯一能想到的是，如果您正确地读取和写入所有数据，那么每次小部件生成时，您都必须重新初始化TotalVotes，这就是为什么您得到相同的值。