Flutter数字墨迹识别插件google_mlkit_digital_ink_recognition的使用

简介

google_mlkit_digital_ink_recognition 是一个Flutter插件，用于使用 Google’s ML Kit Digital Ink Recognition 来识别数字表面上的手写文本和分类草图。它支持数百种语言。

注意事项

1. 平台支持：ML Kit仅支持移动平台（iOS和Android），Web或其他平台不受支持。
2. 维护声明：此插件不由Google赞助或维护，由对机器学习感兴趣的开发者创建。
3. 平台通道：插件通过平台通道与原生API通信，所有机器学习处理都在原生平台上进行。

要求

iOS

• 最低iOS部署目标：15.5.0
• Xcode 15.3.0或更新版本
• Swift 5
• 支持64位架构（x86_64 和 arm64）

在Xcode中排除armv7架构，并确保Podfile配置正确。

Android

• minSdkVersion: 21
• targetSdkVersion: 33
• compileSdkVersion: 34

使用方法

创建DigitalInkRecognizer实例

String languageCode = 'zh-Hans'; // BCP-47代码，例如中文简体
final digitalInkRecognizer = DigitalInkRecognizer(languageCode: languageCode);

处理墨迹

final p1 = StrokePoint(x: x1, y: y1, t: DateTime.now().millisecondsSinceEpoch);
final p2 = StrokePoint(x: x2, y: y2, t: DateTime.now().millisecondsSinceEpoch);

Stroke stroke1 = Stroke();
stroke1.points = [p1, p2];

Ink ink = Ink();
ink.strokes = [stroke1];

final List<RecognitionCandidate> candidates = await digitalInkRecognizer.recognize(ink);

for (final candidate in candidates) {
  final text = candidate.text;
  final score = candidate.score;
}

为了提高识别准确性，可以设置书写区域和上下文：

String preContext = 'Hello';
double width = 300.0;
double height = 400.0;

final context = DigitalInkRecognitionContext(
  preContext: preContext,
  writingArea: WritingArea(width: width, height: height),
);

final List<RecognitionCandidate> candidates = await digitalInkRecognizer.recognize(ink, context: context);

释放资源

await digitalInkRecognizer.close();

模型管理

创建模型管理器实例

final modelManager = DigitalInkRecognizerModelManager();

检查模型是否已下载

final bool isDownloaded = await modelManager.isModelDownloaded(model);

下载模型

final bool downloadSuccess = await modelManager.downloadModel(model);

删除模型

final bool deleteSuccess = await modelManager.deleteModel(model);

示例应用

你可以在这里找到完整的示例应用：example app

完整示例代码

下面是一个完整的示例代码，展示了如何使用 google_mlkit_digital_ink_recognition 插件来识别手写文本：

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Digital Ink Recognition')),
        body: DigitalInkRecognitionScreen(),
      ),
    );
  }
}

class DigitalInkRecognitionScreen extends StatefulWidget {
  @override
  _DigitalInkRecognitionScreenState createState() => _DigitalInkRecognitionScreenState();
}

class _DigitalInkRecognitionScreenState extends State<DigitalInkRecognitionScreen> {
  final TextEditingController _controller = TextEditingController();
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
  late DigitalInkRecognizer _digitalInkRecognizer;
  String _recognizedText = '';

  @override
  void initState() {
    super.initState();
    _initializeRecognizer();
  }

  Future<void> _initializeRecognizer() async {
    try {
      _digitalInkRecognizer = DigitalInkRecognizer(languageCode: 'zh-Hans');
      setState(() {});
    } catch (e) {
      print('Failed to initialize recognizer: $e');
    }
  }

  Future<void> _recognizeInk() async {
    if (_controller.text.isEmpty) return;

    final points = <StrokePoint>[
      StrokePoint(x: 100, y: 100, t: DateTime.now().millisecondsSinceEpoch),
      StrokePoint(x: 150, y: 150, t: DateTime.now().millisecondsSinceEpoch),
      // Add more points as needed
    ];

    final stroke = Stroke(points: points);
    final ink = Ink(strokes: [stroke]);

    final context = DigitalInkRecognitionContext(
      preContext: 'Hello',
      writingArea: WritingArea(width: 300, height: 400),
    );

    try {
      final candidates = await _digitalInkRecognizer.recognize(ink, context: context);
      if (candidates.isNotEmpty) {
        setState(() {
          _recognizedText = candidates.first.text;
        });
      }
    } catch (e) {
      print('Failed to recognize ink: $e');
    }
  }

  @override
  void dispose() {
    _digitalInkRecognizer.close();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        children: [
          TextField(
            controller: _controller,
            decoration: InputDecoration(labelText: 'Enter some text'),
          ),
          SizedBox(height: 16),
          ElevatedButton(
            onPressed: _recognizeInk,
            child: Text('Recognize Ink'),
          ),
          SizedBox(height: 16),
          Text('Recognized Text: $_recognizedText'),
        ],
      ),
    );
  }
}

这个示例展示了如何初始化 DigitalInkRecognizer，处理用户输入的墨迹数据，并识别手写文本。希望这能帮助你更好地理解和使用 google_mlkit_digital_ink_recognition 插件。

如果你有任何问题或需要进一步的帮助，请参考 issues 或提交新的问题。