Flutter键盘工具插件 keyboard_utils_fork 的使用

keyboard_utils_fork 是一个用于检查键盘可见性和高度的Flutter插件。本文将详细介绍如何使用这个插件，并提供一个完整的示例demo。

安装

按照官方安装指南进行操作即可。

如何使用

1. 导入包

首先，在您的Dart文件中导入必要的包：

import 'package:keyboard_utils/keyboard_utils.dart';
import 'package:keyboard_utils/keyboard_listener.dart';

2. 创建KeyboardUtils实例

创建一个KeyboardUtils实例：

KeyboardUtils _keyboardUtils = KeyboardUtils();

3. 添加监听器

接下来，为KeyboardUtils添加监听器：

final int _idKeyboardListener = _keyboardUtils.add(
    listener: KeyboardListener(
        willHideKeyboard: () {
            // 键盘隐藏时执行的代码
            print('Keyboard hidden');
        }, 
        willShowKeyboard: (double keyboardHeight) {
            // 键盘显示时执行的代码
            print('Keyboard shown with height $keyboardHeight');
        }
    )
);

4. 处理资源释放

记得在适当的时候调用dispose方法来清理资源：

_keyboardUtils.unsubscribeListener(subscribingId: _idKeyboardListener);
if (_keyboardUtils.canCallDispose()) {
    _keyboardUtils.dispose();
}

5. 使用KeyboardAware Widget

除了直接使用监听器外，还可以使用KeyboardAware widget来获取当前键盘的状态：

import 'package:keyboard_utils/widgets.dart';

Widget buildSampleUsingKeyboardAwareWidget() {
    return Center(
      child: Column(
        children: <Widget>[
          TextField(),
          TextField(
            keyboardType: TextInputType.number,
          ),
          TextField(),
          SizedBox(
            height: 30,
          ),
          KeyboardAware(
            builder: (context, keyboardConfig) {
              return Text('Is keyboard open: ${keyboardConfig.isKeyboardOpen}\n'
                  'Height: ${keyboardConfig.keyboardHeight}');
            },
          ),
        ],
      ),
    );
}

6. 使用KeyboardConfigInheritedWidget

为了在整个widget树中共享KeyboardConfig，可以使用KeyboardConfigInheritedWidget。

示例Demo

以下是一个完整的示例应用，展示了如何使用keyboard_utils_fork插件：

import 'package:flutter/material.dart';
import 'package:keyboard_utils/keyboard_utils.dart';
import 'package:keyboard_utils/keyboard_listener.dart';
import 'package:keyboard_utils/widgets.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MainPage(),
    );
  }
}

class MainPage extends StatefulWidget {
  const MainPage({Key? key}) : super(key: key);

  [@override](/user/override)
  _MainPageState createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  late KeyboardUtils _keyboardUtils;
  late int _idKeyboardListener;

  [@override](/user/override)
  void initState() {
    super.initState();
    _keyboardUtils = KeyboardUtils();
    _idKeyboardListener = _keyboardUtils.add(
      listener: KeyboardListener(
        willHideKeyboard: () {
          print('Keyboard hidden');
        },
        willShowKeyboard: (double keyboardHeight) {
          print('Keyboard shown with height $keyboardHeight');
        },
      ),
    );
  }

  [@override](/user/override)
  void dispose() {
    _keyboardUtils.unsubscribeListener(subscribingId: _idKeyboardListener);
    if (_keyboardUtils.canCallDispose()) {
      _keyboardUtils.dispose();
    }
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Keyboard Utils Example'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            TextField(),
            TextField(
              keyboardType: TextInputType.number,
            ),
            TextField(),
            SizedBox(height: 30),
            KeyboardAware(
              builder: (context, keyboardConfig) {
                return Text(
                    'Is keyboard open: ${keyboardConfig.isKeyboardOpen}\n'
                    'Height: ${keyboardConfig.keyboardHeight}');
              },
            ),
          ],
        ),
      ),
    );
  }
}