如何从几个文本字段定义文本字段并从自定义数字键盘输入数据（颤动）

Question

我有几个文本字段和一个自定义数字键盘。我想将自定义按钮中的数字添加到现在处于焦点的文本字段中。我如何定义现在处于焦点的文本字段以及如何访问此 focused 控制器以将文本放入其中？谢谢有谁能帮助我...

这是我的 texfield 小部件：

class InputValue extends StatelessWidget {
  final String name;
  final String units;
  final double width;
  TextEditingController textFieldController = TextEditingController();

  InputValue(
      {required this.name,
      required this.units,
      this.width = 70,
      required this.textFieldController});

  @override
  Widget build(BuildContext context) {
    String labelText = name + units;

    return Container(
      padding: EdgeInsets.symmetric(vertical: 5),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Container(
            margin: EdgeInsets.symmetric(vertical: 5),
            height: 30,
            width: width,
            child: TextField(
              keyboardType: TextInputType.none,
              controller: textFieldController,
              maxLines: 1,
              style: TextStyle(fontSize: 11),
              decoration: InputDecoration(
                  contentPadding: EdgeInsets.fromLTRB(5, 1, 5, 1.0),
                  labelText: labelText,
                  enabledBorder: OutlineInputBorder(
                    borderSide: const BorderSide(width: 1, color: Colors.blue),
                    borderRadius: BorderRadius.circular(5),
                  ),
                  focusedBorder: OutlineInputBorder(
                    borderSide: const BorderSide(width: 1, color: Colors.green),
                    borderRadius: BorderRadius.circular(5),
                  )),
            ),
          ),
        ],
      ),
    );
  }
}

这是我的数字键盘按钮：

class NumberPadButton extends StatelessWidget {
  final String symbol;
  final TextEditingController controller;
  final Function onChange;
  final Function? onSubmit;
  NumberPadButton(
      {required this.symbol,
      required this.controller,
      required this.onChange,
      this.onSubmit});

  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: GestureDetector(
        onTap: () {
          controller.text = symbol!;
          onChange();
        },
        child: Container(
          margin: EdgeInsets.all(1),
          padding: EdgeInsets.all(2),
          decoration: BoxDecoration(
              color: buttonBackgroundColor,
              borderRadius: BorderRadius.circular(1)),
          child: Center(
              child: Text(
            symbol!,
            style: TextStyle(fontSize: 15, fontWeight: FontWeight.w700),
          )),
        ),
      ),
    );
  }
}

这是我的状态课程：

class _MainViewState extends State<MainView> {
  @override
  Widget build(BuildContext context) {
    TextEditingController sideAController = TextEditingController();
    TextEditingController sideBController = TextEditingController();
    TextEditingController sideCController = TextEditingController();
    TextEditingController alphaController = TextEditingController();
    TextEditingController bettaController = TextEditingController();
    TextEditingController gammaController = TextEditingController();
    TextEditingController numberPadController = TextEditingController();

    return Column(
      children: [
        Container(
          padding: EdgeInsets.all(5),
          child: TriangleDrawing(
            triangle: widget.triangle,
          ),
        ),
        Container(
          margin: EdgeInsets.symmetric(horizontal: 20),
          child: Column(
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  InputValue(
                    name: 'side c',
                    units: '',
                    textFieldController: sideCController,
                  ),
                  InputValue(
                    name: 'side b',
                    units: '',
                    textFieldController: sideBController,
                  ),
                  InputValue(
                    name: 'side a',
                    units: '',
                    textFieldController: sideAController,
                  ),
                ],
              ),
              // SizedBox(
              //   height: 15,
              // ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  InputValue(
                    name: alphaSymbol,
                    units: degreeSymbol,
                    textFieldController: alphaController,
                  ),
                  InputValue(
                    name: bettaSymbol,
                    units: degreeSymbol,
                    textFieldController: bettaController,
                  ),
                  InputValue(
                    name: gammaSymbol,
                    units: degreeSymbol,
                    textFieldController: gammaController,
                  ),
                ],
              ),
            ],
          ),
        ),
        // TriangelPictureW(),
        SizedBox(
          height: 5,
        ),
        
        SizedBox(
          height: 5,
        ),
        Center(child: Text(widget.triangle.message)),
        Expanded(
          child: Container(
            margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: [
                Expanded(
                  child: Row(
                    children: [
                      NumberPadButton(
                        symbol: '1',
                        controller: numberPadController,
                        onChange: () {
                          if (FocusScope.of(context).hasFocus) {
//HERE SHOULD I DEFINE A TEXTFIELD?
//TEXTFIELD_IN_FOCUS.text += numberPadController.text;
                          } 
                          
                        },
                      ),
                      NumberPadButton(
                        symbol: '2',
                        controller: numberPadController,
                        onChange: () {
                        },
                      ),
                      
                    ],
                  ),
                ),
                
                Expanded(
                  child: Row(
                    children: [
                      NumberPadButton(
                        symbol: 'Calculate',
                        controller: numberPadController,
                        onChange: () {},
                      ),
                    ],
                  ),
                )
              ],
            ),
          ),
        )
      ],
    );
  }
}

Answer 1

我为每个文本字段创建了

focusNode

和

TextEditingController

，然后将它们添加到

Map

。点击按钮时，我会浏览所有文本字段并使用焦点所在的文本字段：

TextEditingController sideAController = TextEditingController();
  TextEditingController sideBController = TextEditingController();
  TextEditingController sideCController = TextEditingController();
  TextEditingController alphaController = TextEditingController();
  TextEditingController bettaController = TextEditingController();
  TextEditingController gammaController = TextEditingController();
  TextEditingController numberPadController = TextEditingController();

  final sideANode = FocusNode();
  final sideBNode = FocusNode();
  final sideCNode = FocusNode();

  final alphaNode = FocusNode();
  final bettaNode = FocusNode();
  final gammaNode = FocusNode();
  Map<FocusNode, TextEditingController> focusNodes = {};

  focusNodes = {
      sideANode: sideAController,
      sideBNode: sideBController,
      sideCNode: sideCController,
      alphaNode: alphaController,
      bettaNode: bettaController,
      gammaNode: gammaController
    };

现在您只需检查并使用它即可：

void addSymbol(String symbol) {
    focusNodes.forEach((key, value) {
      key.hasFocus ? changeText(value, symbol) : null;
    });
  }

---

_{此答案作为问题的编辑发布如何从几个文本字段定义文本字段并从自定义数字键盘（颤动）中输入数据（已解决）由OP KiriLL Sabko在CC BY-SA下4.0.}