ListView 中的新 TextFormField 无法聚焦

Question

我正在尝试制作用户可以添加的项目列表。 为了实现这一点，我决定使用一个 ListView 小部件，其中每一行都是一个 TextFormField 小部件。 我希望新添加的项目在绘制后立即获得焦点。

我遵循了这个食谱： https : //api.flutter.dev/flutter/widgets/Focus-class.html#widgets.Focus.3

哪里有注释解释在构建之前调用.requestFocus()应该没问题。

但是当我用TextFormField小部件替换ActionChip小部件时，新项目没有获得焦点。

这是我的代码：

class SettingsWidget extends StatefulWidget {

  SettingsWidget(this.addIngredientsListener);

  final StreamController<String> addIngredientsListener;
  @override
  SettingsWidgetState createState() => SettingsWidgetState();
}

class SettingsWidgetState extends State<SettingsWidget> {
  final List<Widget> children = new List<Widget>();
  final List<FocusNode> childFocusNodes = new List<FocusNode>();

  @override
  void initState() {
    super.initState();
      widget.addIngredientsListener.stream.listen(_addChild);
    _addChild("init");
    _addChild("init");
  }

  @override
  void dispose() {
    super.dispose();
    childFocusNodes.forEach((node) => node.dispose());
  }

  void _addChild(String caller) {
    setState(() {

    String text = 'CHILD ${children.length}';

    // Calling requestFocus here creates a deferred request for focus, since the
    // node is not yet part of the focus tree.
    FocusNode newNode = FocusNode(debugLabel: 'Child ${children.length}')..requestFocus();
    childFocusNodes
        .add(newNode);

    TextEditingController textController = TextEditingController(
        text: text);

    children.add(
      TextFormField(
        autofocus: false,
        focusNode: newNode,
        controller: textController
    ));

    newNode.requestFocus();
    });
  }

  @override
  Widget build(BuildContext context) {
    Widget widget = ListView.separated(
        padding: const EdgeInsets.all(16.0),
        itemCount: children.length,
        itemBuilder: (context, i) {
          return children[i];
        },
      separatorBuilder: (BuildContext context, int index) => const Divider());
    return widget;
  }
}

我已成功手动请求关注列表中现有的 TextFormFields。 正因为如此，我认为一定有什么东西阻止了新人获得焦点。

我有一个解决方法，其中手动添加的 TextFormFields 具有autofocus: true而由initState()则没有。 只是让我觉得手动请求关注新项目不起作用。

我也在S/O 上看到了这个问题，其中线程等待几毫秒来调用requestFocus() 。 它也适用于我。

真的没有比线程睡眠焦点调用更好的选择了吗？

版本：

[✓] Flutter (Channel stable, v1.12.13+hotfix.9, on Linux, locale en_GB.UTF-8)
    • Flutter version 1.12.13+hotfix.9 at /opt/flutter
    • Framework revision f139b11009 (5 months ago), 2020-03-30 13:57:30 -0700
    • Engine revision af51afceb8
    • Dart version 2.7.2

Answer 1

您确实首先需要解决一些编译错误：

• 删除没有右括号的孤独setState(() {
• 从..requestFocus();删除多余的点..requestFocus();

之后，再次测试，看看事情是否开始工作。