颤振LBS至KG应用程序未注册“转换”提交

Question

我正在做我的第一个颤振应用程序，我想以LBS作为输入，并显示为KG。

我创建了两个双变量，一个用于_lbs，另一个用于_kg值。

我有一个将lbs输入转换为kg输出的方法。

然而，当我按下转换按钮时，我的应用程序中什么也没有发生。

​

​

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final appTitle = 'LBS to KG converter';

    return MaterialApp(
      title: appTitle,
      home: Scaffold(
        appBar: AppBar(
          title: Text(appTitle),
        ),
        body: MyCustomForm(),
      ),
    );
  }
}

// Create a Form Widget
class MyCustomForm extends StatefulWidget {
  @override
  MyCustomFormState createState() {
    return MyCustomFormState();
  }
}

// Create a corresponding State class. This class will hold the data related to
// the form.
class MyCustomFormState extends State<MyCustomForm> {
  final _formKey = GlobalKey<FormState>();
  double _lbs;
  double _kg;

  void _convert(){
    setState(() {
      _kg = _lbs * 0.45359237;
    });

  }

  @override
  Widget build(BuildContext context) {
    return new Form(

      key: _formKey,
      child: Column(
        children: <Widget>[

          /*- LBS ---------------- */
          new Row(
            children: <Widget>[
              Flexible(
                child: Padding(
                  padding: const EdgeInsets.only(
                      top: 2.0, left: 10.0),
                  child: new Text(
                    "LBS:",
                    style: new TextStyle(fontSize: 18.0),
                  )
                ),
              ),
              Flexible(
                child: Padding(
                  padding: const EdgeInsets.only(
                      top: 2.0, left: 10.0),
                  child: new TextField(decoration: InputDecoration(
                      hintText: '$_lbs'
                  ),)

                ),
              )
            ],
          ),



          /*- KG ----------------- */
          new Row(
            children: <Widget>[
              Flexible(
                child: Padding(
                    padding: const EdgeInsets.only(
                        top: 2.0, left: 10.0),
                    child: new Text(
                      "KG:",
                      style: new TextStyle(fontSize: 18.0),
                    )
                ),
              ),
              Flexible(
                child: Padding(
                    padding: const EdgeInsets.only(
                        top: 2.0, left: 10.0),
                    child: new TextField(decoration: InputDecoration(
                        hintText: '$_kg'
                    ),)

                ),
              )
            ],
          ),

          /*- Convert ---------------- */
          new Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Flexible(
                child: Padding(
                  padding: const EdgeInsets.only(
                      top: 15.0, right: 10.0, left: 10.0),
                  child: GestureDetector(
                    onTap: _convert,
                    child: new Container(
                        alignment: Alignment.center,
                        height: 60.0,
                        decoration: new BoxDecoration(
                            color: Color(0xFF18D191),
                            borderRadius: new BorderRadius.circular(9.0)),
                        child: new Text("Convert",
                            style: new TextStyle(
                                fontSize: 20.0, color: Colors.white))),
                  ),
                ),
              )
            ],
          )
        ],
      ),
    );
  }
}

1)对于我在应用程序中遗漏了什么，有什么建议吗？

( 2) "hintText“是显示价值的最佳方法吗？难道没有"TextField.value“吗？

Answer 1

final lbsController = TextEditingController();
final kgController = TextEditingController();

void _convert(){
_lbs = lbsController.text; // just add checking for digital input there
  setState(() {
    _kg = _lbs * 0.45359237;
  });
}

在build内部

lbsController.text = _lbs;
kgController.text = _kg;
...
child: new TextField(controller: lbsController, ...