Question

我正在开发一个应用程序，在主屏幕上，我有一个按钮，打开另一个屏幕，在一个方法内。在那个屏幕上我想做一些计算，比如取用户输入和更新文本字段，点击按钮时调用 calculateAmount 方法，更新变量 total ，反映在文本字段上但是文本字段没有更新，它只在按键完成后才更新...如何才能完成此任务。 这是我的代码：

    import 'package:flutter/material.dart';
    void main() {

      runApp(new MaterialApp(
          debugShowCheckedModeBanner: false,
        home: new homePage()
      ));
    }

    class homePage extends StatefulWidget {

      @override
      homePageState  createState() => new homePageState();
    }
    class homePageState extends State<homePage> {

    double metal = 0.0;
    double total = 0.0;

      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          appBar: new AppBar(
            title: new Text("APP-Title",), backgroundColor: Colors.orange),
           body: new Container(
            child: new Center(
                child: new Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[

                    new Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[

                        new Expanded(child: new RaisedButton.icon(
                          color: Colors.orange,
                          icon: const Icon(
                            Icons.info, size: 25.0, color: Colors.white,),
                          label: new Text('Calculate', style: new TextStyle(
                              color: Colors.white
                              )),
                          onPressed: () {
                            calculateWindow();
                          ),),
                   ],
                )
              ],
            )
        ),
      ),
    );
  }
 void calculateWindow(){
    Navigator.of(context).push(
      new MaterialPageRoute(
        builder: (context) {
          return new Scaffold(
            appBar: new AppBar(
              title: new Text('Calculator'),
              backgroundColor: Colors.orange,
            ),
            body: new ListView(
              children: <Widget>[

                new Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    new Container(
                      height: 50.0,
                      width: 360.0,
                      decoration: new BoxDecoration(
                        color: Colors.orange,
                        shape: BoxShape.rectangle,
                      ),
                      child: new Center(
                        child: new Row(
                          children: <Widget>[
                            new Expanded(
                              child: new Container(
                                child:  new Text("Gold & Silver in Sold & Ornaments",
                                  style: textStyle,
                                  textAlign: textAlign
                                ),
                              ),
                            ),
                            new Container(
                              height: 40.0,
                              width: 80.0,
                              decoration:  new BoxDecoration(
                                  color: Colors.white),
                              child: new TextField(
                                  keyboardType: TextInputType.number,
                                  onSubmitted : (String value) {
                                    try {
                                      metal = double.parse(value.toString());
                                      print(total);
                                    } catch (exception) {
                                      metal = 0.0;
                                    }
                                  }
                              ),
                            ),
                          ],
                        ),
                      ),
                      ),

                  ],
                new Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    new Expanded(
                      child: new Container(
                          width: 50.0,
                          child: new RaisedButton.icon(
                            color: Colors.grey,
                            icon: const Icon(
                              Icons.check, size: 25.0, color: Colors.white,),
                            label: new Text('Calculate', style: new TextStyle(
                                color: Colors.white,
                               )),
                            onPressed: calculateAmount,
                          ),
                      ),
                    ),
                  ],
                ),
                new Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    new Container(
                      height: 50.0,
                      width: 350.0,
                      decoration: new BoxDecoration(
                        color: Colors.blueGrey,
                        shape: BoxShape.rectangle,
                      ),
                      child: new Center(
                        child: new Row(
                          children: <Widget>[
                            new Expanded(
                              child: new Container(
                                child:  new Text("Total Amount:",
                                  style: new TextStyle(
                                  color: Colors.white,),
                                  textAlign: TextAlign.left,),
                              ),
                            ),
                            new Container(

                              child: new Text(
                                '$total',
                                textAlign: TextAlign.left,
                                overflow: TextOverflow.ellipsis,
                                style: textStyle,
                                textDirection: TextDirection.ltr,
                              )
                            ),
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          );
        },
      ),
    );
  }
 void calculateAmount(){

    setState((){
      total =  metal + 0.025;

    });
  }
}

Answer 1

我真的不明白你想要的输出是什么，但是这个例子可能有助于向你展示代码中出错的地方。

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.16/moment-timezone.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.16/moment-timezone-with-data.js"></script>

Answer 2

您的代码存在很多问题。

如果要从TextField中读取数据，请使用控制器。
On Button Pressed在setState（）方法中进行计算。
由于您希望在Text中再次显示计算值，您必须创建一个StateFullWidget，以便在调用setState（）时，它将被重新呈现并显示更新的值。

我希望它会对你有所帮助。

单击按钮更新flutter中的文本字段

2 个答案: