如何解决文本字段中有两个键盘光标的问题？

Question

https://i.stack.imgur.com/YKClg.png
I have multiple textfields and I have written code that expects that clearing index 0, ie the first textfield in the list, will set the focus back to the first textfield, but contrary to expectations, the cursor moves to the second field. text field. , and why do I see two cursors when I click on another textfield in this state? `

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:todolist/dataForm.dart';

class TodoCase extends StatefulWidget {
  final String title;
  const TodoCase({
    Key? key,
    required this.title,
  }) : super(key: key);

  @override
  State<TodoCase> createState() => _TodoCaseState();
}

class _TodoCaseState extends State<TodoCase> {
  List<ToDoDataForm> toDoLineList = [];
  final FocusScopeNode textListScopeNode = FocusScopeNode();
  final ScrollController toDoScrollController = ScrollController();
  List<TextEditingController> textEditController = [];
  List<FocusNode> keyBoardFocusNode = [];
  List<FocusNode> textFocusNode = [];
  Future<void> scrollToEnd() async {
    await Future.delayed(const Duration(milliseconds: 100));
    toDoScrollController.animateTo(
      toDoScrollController.position.maxScrollExtent,
      duration: const Duration(milliseconds: 400),
      curve: Curves.ease,
    );
  }

  @override
  Widget build(BuildContext context) {
    void addList() {
      setState(() {
        toDoLineList.add(ToDoDataForm(todoData: ""));
        scrollToEnd();
      });
    }

    Widget renderTextFormField(ToDoDataForm dataForm, int index) {
      return Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Checkbox(
              value: dataForm.isDone,
              onChanged: (value) {
                setState(() {
                  dataForm.isDone = value!;
                });
              }),
          Flexible(
            child: KeyboardListener(
              focusNode: keyBoardFocusNode[index],
              onKeyEvent: (value) {
                if (value.logicalKey == LogicalKeyboardKey.backspace &&
                    dataForm.todoData.isEmpty) {
                  setState(() {
                    if (index != 0) {
                      textFocusNode[index - 1].requestFocus();
                      toDoLineList.removeAt(index);
                      textFocusNode.removeAt(index);
                      keyBoardFocusNode.removeAt(index);
                      textEditController.removeAt(index);
                    } else if (index == 0 && toDoLineList.length == 1) {
                      toDoLineList.removeAt(index);
                      textFocusNode.removeAt(index);
                      textEditController.removeAt(index);
                      keyBoardFocusNode.removeAt(index);
                    } else if (index == 0 && toDoLineList.length != 1) {
                      FocusScope.of(context)
                          .requestFocus(textFocusNode[index + 1]);
                      toDoLineList.removeAt(index);
                      textFocusNode.removeAt(index);
                      textEditController.removeAt(index);
                      keyBoardFocusNode.removeAt(index);
                    }
                  });
                  print(textFocusNode);
                }
              },
              child: TextField(
                decoration: const InputDecoration(
                  border: InputBorder.none,
                ),
                autofocus: false,
                controller: textEditController[index],
                focusNode: textFocusNode[index],
                onChanged: (value) {
                  //print('edit : $index');
                  dataForm.todoData = value;
                  //print(textFocusNode);
                },
              ),
            ),
          )
        ],
      );
    }

    return SizedBox(
      width: 180,
      height: 200,
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                widget.title,
                style: const TextStyle(
                  color: Colors.black,
                  fontSize: 24,
                ),
              ),
              IconButton(
                onPressed: addList,
                icon: const Icon(Icons.add),
                padding: EdgeInsets.zero,
                iconSize: 20,
              ),
            ],
          ),
          Container(
            height: 1,
            color: Colors.black,
          ),
          Expanded(
            child: ListView.builder(
              itemCount: toDoLineList.length,
              controller: toDoScrollController,
              itemBuilder: ((context, index) {
                if (textEditController.length - 1 < index) {
                  print(index);
                  textEditController.add(TextEditingController(
                      text: toDoLineList[index].todoData));
                  textFocusNode.add(FocusNode());
                  textFocusNode[index].unfocus();
                  keyBoardFocusNode.add(FocusNode());
                }
                print(index);
                print(textFocusNode);
                return renderTextFormField(toDoLineList[index], index);
              }),
            ),
          ),
        ],
      ),
    );
  }
}

`

i try to focusNode List move to glover and textfield wrap FocusScopeNode and many try things but i can't solve this problem...

Answer 1

This issue happens ONLY when the same TextEditingController is passed to different text fields. Check if the text fields are getting different TextEditingController or not.