Flutter拼写检查插件simple_spell_checker的使用

Flutter拼写检查插件simple_spell_checker的使用

简介

Simple Spell Checker 是一个简单但功能强大的拼写检查工具，允许开发者检测并高亮文本中的拼写错误。该插件支持多种语言，并且可以根据需要进行定制，适用于各种应用场景。

当前支持的语言

该插件默认支持以下语言：

• 德语 (de, de-ch)
• 英语 (en, en-gb)
• 西班牙语 (es)
• 加泰罗尼亚语 (ca)
• 阿拉伯语 (ar)
• 丹麦语 (da)
• 法语 (fr)
• 保加利亚语 (bg)
• 荷兰语 (nl)
• 韩语 (ko)
• 爱沙尼亚语 (et)
• 希伯来语 (he)
• 意大利语 (it)
• 挪威语 (no)
• 葡萄牙语 (pt)
• 俄语 (ru)

入门指南

添加依赖

在 pubspec.yaml 文件中添加 simple_spell_checker 依赖：

dependencies:
  simple_spell_checker: ^最新版本

注意：从 1.3.0 版本开始，所有词典已被移除并重新实现为单独的包。因此，您需要手动添加所需语言的词典包。请参考“当前支持的语言”部分。

如果使用这些包注册语言，请在使用 SimpleSpellChecker 之前调用相应的注册函数，以避免任何意外行为。

导入必要的组件并初始化拼写检查器

import 'package:simple_spell_checker/simple_spell_checker.dart';

// 初始化单语言拼写检查器
SimpleSpellChecker spellChecker = SimpleSpellChecker(
  language: 'en', // 当前用户使用的语言
  whiteList: <String>[],  // 白名单单词
  caseSensitive: false,   // 是否区分大小写
);

设置自定义词典

您可以使用 setLanguage 方法设置自定义词典：

import 'package:simple_spell_checker/simple_spell_checker.dart';

// 设置自定义语言词典
SimpleSpellChecker.setLanguage('sk', <String, int>{});

// 学习新单词
SimpleSpellChecker.learnWord('sk', 'word_that_will_be_registered');

// 移除已学习的单词
SimpleSpellChecker.unlearnWord('sk', 'word_that_will_be_removed');

注册默认支持的语言

import 'package:simple_spell_checker_en_lan/simple_spell_checker_en_lan.dart';
import 'package:simple_spell_checker_he_lan/simple_spell_checker_he_lan.dart';
import 'package:simple_spell_checker_ru_lan/simple_spell_checker_ru_lan.dart';

// 注册语言
SimpleSpellCheckerHeRegister.registerLan();
SimpleSpellCheckerRuRegister.registerLan();

// 注册英语（可以使用 `en` 或 `en-ch`）
SimpleSpellCheckerEnRegister.registerLan(preferEnglish: 'en');

// 移除语言
SimpleSpellCheckerHeRegister.removeLan();
SimpleSpellCheckerRuRegister.removeLan();
SimpleSpellCheckerEnRegister.removeLan();

检查函数

检查文本

使用 check() 方法分析字符串中的拼写错误，并返回包含拼写错误单词的 TextSpan 列表：

List<TextSpan>? result = spellChecker.check(
  'Your text here',
  wrongStyle: TextStyle(backgroundColor: Colors.red.withOpacity(0.2)), // 设置错误单词的样式
  commonStyle: TextStyle(your_normal_styles_for_non_wrong_words), // 设置正常单词的样式
);

使用自定义构建器检查文本

使用 checkBuilder<T>() 方法分析字符串中的拼写错误，并构建自定义小部件：

List<Widget>? result = spellChecker.checkBuilder<Widget>(
  'Your text here',
  builder: (word, isValid) {
    return Text(word, style: TextStyle(color: !isValid ? Colors.red : null));
  }
);

单词分词器自定义

创建自定义 Tokenizer

使用构造函数中的 wordTokenizer 参数或 setNewTokenizer() 和 setWordTokenizerToDefault() 方法设置自定义 Tokenizer 实例。默认情况下，MultiSpellChecker 和 SimpleSpellChecker 只接受 List<String> 类型的 Tokenizer 实现。

/// 自定义分词器
class CustomWordTokenizer extends Tokenizer<List<String>> {
  CustomWordTokenizer() : super(separatorRegExp: RegExp(r'\S+|\s+'));

  [@override](/user/override)
  bool canTokenizeText(String text) {
    return separatorRegExp!.hasMatch(text);
  }

  /// 将字符串分割成单词
  [@override](/user/override)
  List<String> tokenize(
    String content, {
    bool removeAllEmptyWords = false,
  }) {
    final List<String> words = separatorRegExp!.allMatches(content).map((match) => match.group(0)!).toList();
    return [...words];
  }
}

额外信息

语言管理

• setNewLanguageToState(String language)：覆盖当前拼写检查器的语言。仅适用于 SimpleSpellChecker 实例。

白名单管理

• SetNewWhiteList(List words)：覆盖当前白名单。
• addNewWordToWhiteList(String word)：向白名单添加新单词。
• whiteList：返回当前白名单状态。

状态管理

• toggleChecker()：启用或禁用拼写检查。如果禁用，check() 方法将始终返回 null。
• isActiveChecking()：返回拼写检查器的状态。

自定义选项

• checkBuilder：使用 checkBuilder() 方法以基于小部件的方式处理拼写错误。
• customLongPressRecognizerOnWrongSpan：为错误单词附加自定义手势识别器，以实现个性化交互。

流更新

SimpleSpellChecker 类提供了一个流（通过流 getter 获取），当拼写检查器状态发生变化时广播更新。这对于响应式 UI 更新非常有用。

spellChecker.languageStream.listen((event) {
  print("拼写检查语言状态已更新。");
});

释放资源

当不再需要 SimpleSpellChecker 时，确保正确释放它：

// 释放拼写检查器，释放后不可重复使用，否则会抛出错误
spellChecker.dispose();

// 或者，如果您不需要监听 StreamControllers，则可以释放它们
spellChecker.disposeControllers();

完整示例代码

以下是一个完整的示例代码，展示了如何在 Flutter 应用中使用 simple_spell_checker 插件：

import 'package:flutter/material.dart';
import 'package:simple_spell_checker/simple_spell_checker.dart';
import 'package:simple_spell_checker_en_lan/simple_spell_checker_en_lan.dart';

void main() {
  // 注册英语词典
  SimpleSpellCheckerEnRegister.registerLan();
  runApp(const MyApp());
}

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Simple Spell Checker'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late final SimpleSpellChecker _controller;
  late final SimpleSpellChecker _titleController;
  bool isFirst = true;

  [@override](/user/override)
  void dispose() {
    _controller.dispose();
    _titleController.dispose();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    final Size size = MediaQuery.sizeOf(context);
    
    if (isFirst) {
      isFirst = false;
      final language = Localizations.localeOf(context).languageCode;
      _controller = SimpleSpellChecker(
        language: language,
        whiteList: <String>[],
        caseSensitive: false,
      );
      _titleController = SimpleSpellChecker(
        language: language,
        whiteList: <String>[],
        caseSensitive: false,
      );
    }

    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(
          widget.title,
          style: const TextStyle(
            fontWeight: FontWeight.w800,
          ),
        ),
        centerTitle: true,
        actions: [
          IconButton(
            onPressed: () {
              _controller.toggleChecker();
              setState(() {});
            },
            icon: const Icon(
              Icons.document_scanner_sharp,
            ),
          ),
        ],
      ),
      body: SingleChildScrollView(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Center(
              child: Container(
                alignment: Alignment.center,
                width: size.width * 0.80,
                child: TextField(
                  controller: TextEditingController(text: 'What is Simple Spell Checker'),
                  maxLines: 1,
                  textAlign: TextAlign.center,
                  decoration: const InputDecoration(
                    disabledBorder: InputBorder.none,
                    border: InputBorder.none,
                    enabledBorder: InputBorder.none,
                  ),
                  style: const TextStyle(
                    fontWeight: FontWeight.bold,
                    fontSize: 20,
                  ),
                ),
              ),
            ),
            Divider(
              height: 2,
              indent: size.width * 0.10,
              endIndent: size.width * 0.10,
              color: Colors.black,
            ),
            Padding(
              padding: EdgeInsets.symmetric(
                vertical: 8.0,
                horizontal: size.width * 0.10,
              ),
              child: TextField(
                controller: TextEditingController(text: 'Simple Spell Checker is a simple but powerful spell checker, that allows to all developers detect and highlight spelling errors in text. It Allows customization of languages, providing efficient and adaptable spell-checking for various applications.'),
                maxLines: null,
                minLines: 10,
                decoration: const InputDecoration(
                  border: InputBorder.none,
                  hintText: 'Write something here',
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}