如何听键盘在屏幕上 Flutter ?

ehxuflar  于 2023-06-07  发布在  Flutter
关注(0)|答案(6)|浏览(460)

我正在构建一个移动的应用程序,我想删除一个小部件时,键盘出现在屏幕上,即当输入文本字段的焦点。
我尝试使用RawKeyboardListener,但似乎不起作用,我的代码如下:

new Container(
  child: new RawKeyboardListener(
    focusNode: new FocusNode(),
    onKey: (input) => debugPrint("*****KEY PRESSED"),
    child: new TextField(
      controller: new TextEditingController(),
    ),
  ),
);
9lowa7mx

9lowa7mx1#

您可以使用这个简单的检查:

MediaQuery.of(context).viewInsets.bottom == 0

当返回true时,键盘关闭,否则键盘打开。请注意,要获取整个屏幕的上下文(例如Scaffold),而不仅仅是一个小部件。
下面是如何将检查集成到代码中:

Visibility(
  child: Icon(Icons.add),
  visible: MediaQuery.of(context).viewInsets.bottom == 0,
)
wfsdck30

wfsdck302#

当文本字段被聚焦时,键盘将自动出现。所以你可以在focusnode中添加一个listner来监听焦点的变化并隐藏相应的widget。
示例:

void _listener(){
        if(_myNode.hasFocus){
          // keyboard appeared 
        }else{
          // keyboard dismissed
        }
    }

    FocusNode _myNode = new FocusNode()..addListener(_listner);

    TextField _myTextField = new TextField(
            focusNode: _mynNode,
            ...
            ...
        );

    new Container(
        child: _myTextField
    );
pdsfdshx

pdsfdshx3#

我用的是keyboard_visibility
然后我用KeyboardListener Package 了我的TextField,实现如下:

class KeyboardListener extends StatefulWidget {
  final Widget child;
  final void Function(bool) onChange;
  KeyboardListener({@required this.child, @required this.onChange});
  @override
  _KeyboardListenerState createState() => _KeyboardListenerState();
}

class _KeyboardListenerState extends State<KeyboardListener> {
  int _sId;
  KeyboardVisibilityNotification _kvn;

  @override
  void initState() {
    super.initState();
    _kvn = KeyboardVisibilityNotification();
    _sId = _kvn.addNewListener(
      onChange: widget.onChange,
    );
  }

  @override
  Widget build(BuildContext context) {
    return widget.child;
  }

  @override
  void dispose() {
    _kvn.removeListener(_sId);
    super.dispose();
  }
}
mec1mxoz

mec1mxoz4#

您可以使用此库keyboard_visibility:^0.5.6,在:https://pub.dev/packages/keyboard_visibility
要执行代码,请在initState()中插入
KeyboardVisibilityNotification.addNewListener( onChange: (bool visible) { print(visible); this.setState(() { keyboardIsOpen = visible; }); }, );
每当键盘打开或关闭时,库都会调用具有可见性布尔值的onChange方法。

yks3o0rb

yks3o0rb5#

检查键盘是否打开,可以使用WidgetsBinding.instance.window.viewInsets.bottom,由Deepak Raj回答

或者您可以用途:键盘VisibilityBuilder

作者:Andrey Gordeev

KeyboardVisibilityBuilder(
    builder: (context, child, isKeyboardVisible) {
      if (isKeyboardVisible) {
        // when keyboard is visible
        return mChild;
      } else {
        // when keyboard is invisible
        return SizedBox.shrink();
      }
      
    },
    child: mChild,
  )
6ie5vjzr

6ie5vjzr6#

每当用户按下或释放键盘上的键时调用回调的小部件。
RawKeyboardListener对于侦听原始键事件和表示为键的硬件按钮非常有用。通常用于游戏和其他使用键盘进行文本输入以外的用途的应用程序。
对于文本输入,请考虑使用EditableText,它与屏幕键盘和输入法编辑器(IME)集成。

const RawKeyboardListener({
Key key,
@required FocusNode focusNode,
@required ValueChanged<RawKeyEvent> onKey,
@required Widget child
})

创建接收原始键盘事件的小部件。
对于文本输入,请考虑使用EditableText,它与屏幕键盘和输入法编辑器(IME)集成。

执行情况

const RawKeyboardListener({
  Key key,
  @required this.focusNode,
  @required this.onKey,
  @required this.child,
}) : assert(focusNode != null),
     assert(child != null),
     super(key: key);

相关问题