在 Textfield 中自动添加两个数字并在第三个 Textfield Flutter 中显示结果答案

【问题标题】：Automatically Add Two Numbers In Textfield and show the result in a third Textfield Flutter在 Textfield 中自动添加两个数字并在第三个 Textfield Flutter 中显示结果
【发布时间】：2021-09-23 04:22:54
【问题描述】：

我有两个接受数字输入的文本字段。我想在用户在文本字段中输入数字并实时在第三个文本字段中显示结果时计算两个文本字段的总和。这是我迄今为止尝试过的。

void _calculation() {
    setState((){
      _total = int.parse(_quantityController.text) * int.parse(feedPrice.text);
    },
    );
    print(_total);
  }

并在第三个文本字段中显示结果

TextField(
                readOnly: true,
                textAlign: TextAlign.center,
                decoration: InputDecoration(
                    hintText: _total.toString(),
                ),
              ),

我将总数作为字符串传递给 Textfield 提示字段。我错过了什么或我做错了什么？

【问题讨论】：

您需要在onChanged 的其他TextFields 的属性中调用_calculation()
我的问题比我说的要复杂一些。因此，我将把它作为一个新问题提出。我将把这个问题和这个答案留在这里，供以后想参考的人参考。

标签： android flutter setstate

【解决方案1】：

您在设置 hintText 时做错了。因为提示文本表明该字段接受哪种输入。

您应该将文本设置为文本字段，而不是像这样的提示文本

文本：_total.toString()

【讨论】：

我刚试了，没用。
你把那个代码放在哪里了
您应该将代码放在第三个文本字段中
如果您希望在更改您拥有的任何文本字段的值并在第三个文本视图中获取更新的总和结果时这样做。您必须添加文本视图的侦听器和侦听器方法 onchanged 或类似的东西。您必须在它们中调用计算（）函数并在计算函数中设置文本字段三中的值

【解决方案2】：

演示小部件


class ApplicantsX extends StatefulWidget {
  const ApplicantsX({Key? key}) : super(key: key);

  @override
  State<ApplicantsX> createState() => _ApplicantsXState();
}

class _ApplicantsXState extends State<ApplicantsX> {
  double a = 0;
  double b = 0;

  final TextEditingController controller = TextEditingController();

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        TextField(onChanged: (value) {
          final x = double.tryParse(value);

          setState(() {
            a = x ?? 0; // handle null and String

            controller.text = (a + b).toStringAsFixed(2);
          });
        }),
        TextField(onChanged: (value) {
          final x = double.tryParse(value);

          setState(() {
            b = x ?? 0;

            controller.text = (a + b).toStringAsFixed(2);
          });
        }),
        TextField(
          controller: controller,
          readOnly: true,
        )
      ],
    );
  }
}

【讨论】：

【解决方案3】：

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class _YourPageState extends State<YourPage> {
  int _age1 = 0, _age2 = 0, _totalAge = 0;
  final firstNumber = TextEditingController();
  final secondNumber = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Padding(
        padding: const EdgeInsets.all(32.0),
        child: Column(
          children: <Widget>[
            TextField(
              controller: firstNumber,
              textInputAction: TextInputAction.next,
              keyboardType: TextInputType.number,
              onSubmitted: (String value) {},
            ),
            TextField(
              controller: secondNumber,
              textInputAction: TextInputAction.next,
              keyboardType: TextInputType.number,
              onSubmitted: (String value) {},
            ),
            Text(
              'Sum is: ${firstNumber.text + secondNumber.text}',
              textAlign: TextAlign.center,
              style: const TextStyle(fontWeight: FontWeight.bold),
            )
          ],
        ),
      ),
    );
  }
}

【讨论】：

我没有尝试过这个答案，但是通读一遍，这可能是这里最简单的答案。问题是我的问题比我说的要复杂一些。因此，我将把它作为一个新问题提出。我将把这个问题和这个答案留在这里，供以后想参考的人参考。

【解决方案4】：

重置所有文本字段值和结果后，当我在任何文本字段中输入一个新数字时，该数字将添加到先前的结果中，因此，您能否给出未考虑的先前结果的代码。

【讨论】：

这应该是一条评论。
这并不能真正回答问题。如果您有其他问题，可以点击提问。要在此问题有新答案时收到通知，您可以follow this question。一旦你有足够的reputation，你也可以add a bounty 来引起对这个问题的更多关注。 - From Review