[Flutter]キーボードの高さを取得する(get keyboard height)には？

どうも、ちょげ(@chogetarou)です。

キーボードが表示されたときに、キーボードの高さを取得する方法を紹介します。

方法
使用例

方法

キーボードの高さを取得するには、MediaQueryを使います。

具体的には、「MediaQuery.of(context).viewInsets.bottom」の値を取得します。

final keyboardHeight = MediaQuery.of(context).viewInsets.bottom;

「MediaQuery.of(context).viewInsets.bottom」は、キーボードが表示されたときに、キーボードの高さを返します。

キーボードの高さを取得する方法には、「flutter_keyboard_size」や「flutter_persistent_keyboard_height」などのパッケージを使う方法もあります。

使用例

  @override
  Widget build(BuildContext context) {
    final keyboardHeight = MediaQuery.of(context).viewInsets.bottom;

    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          Text('Keyboard Height: $keyboardHeight'),
          Padding(
            padding: const EdgeInsets.all(30.0),
            child: TextField(
              decoration: InputDecoration(
                border: OutlineInputBorder(),
              ),
            ),
          ),
        ],
      ),
    );
  }