Flutter键盘隐藏插件keyboard_dismisser的使用

keyboard_dismisser 是一个简单的Flutter包，当在键盘外部执行手势时可以隐藏键盘。

功能 Features

• 默认情况下，在点击非激活小部件时会隐藏键盘。
• 支持同时处理多个手势。
• 支持Flutter的 GestureDetector 中所有可用的手势。
• 支持通过滑动方向来隐藏键盘。
• 可以应用于整个页面，只需将其包裹在 Scaffold 之外。
• 可以应用于整个应用程序，只需将其包裹在 MaterialApp、WidgetsApp 或 CupertinoApp 之外。
• 可自定义拖动手势开始行为和手势命中测试行为。
• 可以从语义树中排除。

使用方法 Usage

此包暴露了一个名为 KeyboardDismisser 的无状态组件。您可以将您的组件用它包裹起来，这样您的组件就可以在执行手势时隐藏键盘了。

Widget build(BuildContext context) => KeyboardDismisser(
    child: Scaffold(
        body: ...,
    ),
);

KeyboardDismisser 接受一个 gestures 参数，这是一个 GestureType 枚举类型的列表。通过这种方式，你可以传递任何你想要用于键盘隐藏的手势。默认情况下，KeyboardDismisser 在点击外部时隐藏键盘，但它也可以同时处理多种手势。

Widget build(BuildContext context) => KeyboardDismisser(
    gestures: [GestureType.onTap, GestureType.onPanUpdateDownDirection],
    child: Scaffold(
        body: ...,
    ),
);

开始使用 Getting started

在你的Flutter项目的 pubspec.yaml 文件中添加以下依赖：

dependencies:
  keyboard_dismisser: "^[LATEST_VERSION]"

然后运行 $ flutter pub get。在你的库中添加以下导入：

import 'package:keyboard_dismisser/keyboard_dismisser.dart';

示例代码 Example Code

下面是一个完整的示例代码，展示了如何在应用中使用 keyboard_dismisser 插件。

import 'package:flutter/material.dart';
import 'package:keyboard_dismisser/keyboard_dismisser.dart';

void main() => runApp(ExampleApp());

class ExampleApp extends StatelessWidget {
  const ExampleApp({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) => MaterialApp(
        title: 'Keyboard Dismisser',
        theme: ThemeData(primarySwatch: Colors.blue),
        home: ExamplePage(),
      );
}

class ExamplePage extends StatelessWidget {
  const ExamplePage({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) => KeyboardDismisser(
        gestures: [
          GestureType.onTap,
          GestureType.onPanUpdateDownDirection,
        ],
        child: Scaffold(
          appBar: AppBar(
            title: Text('KeyboardDismisser example'),
          ),
          body: Padding(
            padding: const EdgeInsets.symmetric(
              horizontal: 24,
              vertical: 48,
            ),
            child: TextField(
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: 'Tap to show the keyboard',
                hintText: 'Tap elsewhere or swipe down to dismiss',
              ),
            ),
          ),
        ),
      );
}

以上就是关于 keyboard_dismisser 插件的全部内容，希望对您有所帮助。如果您有任何问题或建议，请随时提出。