Flutter LBS到KG应用未注册“转换”提交

时间:2018-10-24 18:04:48

标签: dart flutter

我正在做我的第一个Flutter应用,我想将LBS作为输入并将其显示为KG。

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

我有一种将磅输入转换为公斤输出的方法。

但是,当我按下“转换”按钮时,我的应用程序没有任何反应。

enter image description here

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”吗?

1 个答案:

答案 0 :(得分: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, ...