How to convert SI Units in Flutter

Viewed 402

I'm trying to make a simple app to convert units like weight, speed... How can I get the input from the text Field and convert it (if it's 1 kilogram, then multiply by 1000 and display on the next text field). I'm trying to get it to work both ways. so if a person inputs in the 2nd field it will convert and output to the 1st. how can I make a if statements on flutter. thanks for the help. the code is below.

class Weight extends StatefulWidget {

  @override
  _WeightState createState() => _WeightState();
}

class _WeightState extends State<Weight> {
  String _value1;
  String _value2;
  final myController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Material(
      child: new Center(
        child: new Column(
          children: [
            new Padding(padding: EdgeInsets.only(top: 50.0)),
            new DropdownButton(
              items: [
                DropdownMenuItem(child: Text("Kilogram"),
                  value: "Kilogram",
                  onTap: (){

                  },),
                DropdownMenuItem(child: Text("gram"),
                  value: "gram",
                  onTap: (){

                  },),
              ],
              onChanged: (String value){
                setState((){

                  _value1 = value;
                  print("$value");
                });
              },
              hint: Text('Select Item'),
              value: _value1,

            ),
            new TextField(
              controller: myController,
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: ("Enter amount in $_value1"),
              ),
            ), //Add Text Field
            
            new Padding(padding: EdgeInsets.only(top: 50.0)),

            new DropdownButton(
              items: [
                DropdownMenuItem(child: Text("Kilogram"),
                  value: "kilogram",
                  onTap: (){
                  },),
                DropdownMenuItem(child: Text("gram"),
                  value: "Gram",
                  onTap: (){
                  },),
              ],
              onChanged: (String value){
                setState((){

                  _value2 = value;
                  print("$value");
                });
              },
              hint: Text('Select Item'),
              value: _value2,
            ),
            new TextField(
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: ("Enter amount in $_value2"),
              ),
            ),  //Add Text Field

            new Padding(padding: EdgeInsets.only(top: 50.0)),
            new RaisedButton(onPressed: (){
            },
              child: new Text("Convert", style: TextStyle(
                fontSize: 25.0,
                color: Colors.black,
              ),),
              padding: EdgeInsets.all(8.0),
              elevation: 15.0,
            )],),),);}}

enter image description here

1 Answers

You don't need an if statement to do what you want, but two controllers. I wanted to give you an idea of how you can implement it.

            //At the top of the class
            TextEditingController _controller1;
            TextEditingController _controller2;
            static final Map<String,double> changes= {
               "gram-kilogram": 1000,
               "kilogram-gram": 0.001
            };

            initState(){
              super.initState();
              controller=TextEditingController();
              controller2=TextEditingController();
            }
            dispose(){
              super.dispose();
              controller.dispose();
              controller2.dispose();
            }

            //TEXT FIELDS
            new TextField(
              controller: controller;
              onChanged: (text) => {
                controller2.text=(int.parse(text)*changes[value1+"-"+value2]).toString();
              }
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: ("Enter amount in $_value2"),
              ),
            ),  //Add Text Field

            new TextField(
              controller: controller2;
              onChanged: (text) => {
                controller.text=(int.parse(text)*changes[value2+"-"+value1]).toString();
              }
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: ("Enter amount in $_value2"),
              ),
            ),  
Related