如何聆听颤动中的焦点变化？

Question

在Android中，我们可以调用setOnFocusChangeListener()，在onFocusChanged()方法中做一些事情，但是flutter不提供onFocus()像GestureDetector中的onTap()接口或 RawKeyboardListener 中的 onKey()。

我读过关于 focus 的 flutter api，https://docs.flutter.io/flutter/widgets/FocusManager-class.html 但是我找不到实现我的请求的方法，谁能帮帮我？

Answer 1

我想您正在寻找 FocusNode class。使用addListener方法添加监听焦点变化的监听函数。

例子
声明并定义 FocusNode

 var focusNode = FocusNode();
  @override
  void initState() {
    focusNode.addListener(() {
      print(focusNode.hasFocus);
    });
    super.initState();
  }

在文本字段中使用焦点节点

TextField(
            focusNode: focusNode,
          ),

输出

当文本框成为焦点时，你会得到 true 否则 false

Answer 2

使用`FocusNode`

这是一个完全正确的答案。 addListener 应该在 initState() 中，而不是 build()，因为这会导致每次构建小部件时都添加一个侦听器，而您很可能不希望这样。

import 'package:flutter/material.dart';

class SomeWidget extends StatefulWidget {
  @override
  _SomeWidgetState createState() => _SomeWidgetState();
}

class _SomeWidgetState extends State<SomeWidget> {
  final _focusNode = FocusNode();
    
  @override
  void initState() {
    super.initState();
    _focusNode.addListener(() {
      print("Has focus: ${_focusNode.hasFocus}");
    });
  }
    
  @override
  Widget build(BuildContext context) {
    return TextField(focusNode: _focusNode);
  }
    
  @override
  void dispose() {
    _focusNode.dispose();
    super.dispose();
  }
}

使用`flutter_hooks`包

如果您有机会使用 flutter_hooks 软件包，这里有一个专用的 useFocusNode 挂钩。

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

class SomeWidget extends HookWidget {
  @override
  Widget build(BuildContext context) {
    final focusNode = useFocusNode();
    useEffect(() {
      focusNode.addListener(() {
        print("Has focus: ${focusNode.hasFocus}");
      });
      return; // You need this return if you have missing_return lint
    }, [focusNode]);

    return TextField(focusNode: focusNode);
  }
}

Answer 3

此外，您还可以使用 Focus 小部件。

Focus(
  child: TextFormField(...),
  onFocusChange: (hasFocus) {
    if(hasFocus) {
      // do stuff
    }
  },
)

如何聆听颤动中的焦点变化？

How to listen focus change in flutter?

focus

dart

flutter

使用FocusNode

使用flutter_hooks包

使用`FocusNode`

使用`flutter_hooks`包