密码输入被键盘隐藏

如何解决密码输入被键盘隐藏

我创建了六位密码文件组件，它在较大尺寸的模拟器中按预期工作正常，但当我使用小尺寸模拟器检查时，密码输入被键盘隐藏。

child: TextField(
            enableInteractiveSelection: false,focusNode: focusNode,controller: widget.controller,keyboardType: TextInputType.number,inputFormatters: <TextInputFormatter>[FilteringTextInputFormatter.digitsOnly],style: const TextStyle(
              height: 0.1,color: Colors.transparent,),decoration: const Inputdecoration(
              focusedErrorBorder: transparentBorder,errorBorder: transparentBorder,disabledBorder: transparentBorder,enabledBorder: transparentBorder,focusedBorder: transparentBorder,helperStyle: TextStyle(
                color: Colors.transparent,fillColor: Colors.transparent,border: InputBorder.none,cursorColor: Colors.transparent,showCursor: false,maxLength: widget.maxLength,onChanged: _onTextChanged,

解决方法

使用 SingleChildScrollView 和属性 reverse: true 将整个列包裹在脚手架中。

像这样：

,

你能检查一下这个包裹吗：keyboard_visibility 您可以获得键盘的状态并基于该状态隐藏/显示您的文本小部件。考虑以下代码：

class _LoginPageState extends State<LoginPage> {
  bool _isKeyboardVisible = false;
  StreamSubscription _subscription;

  @override
  void initState() {
    super.initState();

    _subscription =
        KeyboardVisibilityController().onChange.listen((bool visible) {
      setState(() => _isKeyboardVisible = visible);
    });
  }

  @override
  void dispose() {
    _subscription.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Visibility(
          visible: !_isKeyboardVisible,child: Text("Your header text"),),Visibility(
          visible: !_isKeyboardVisible,child: Text("Your description text"),)
        TextField(
          ...
        ) // Your PIN widgets
      ]
    );
  }
}