Flutter キーボードの高さを取得するサンプル

2023年10月18日

環境
Windows11 pro 64bit
Flutter 3.3.7

構文
MediaQuery.of(context).viewInsets.bottom;
「MediaQuery.of(context).viewInsets.bottom」の値を取得します。
キーボードの高さを取得するには、MediaQueryを使います。

使用例

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

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