Flutter实时文本识别插件live_text的使用

Flutter 实时文本识别插件 live_text 的使用

简介

你是否遇到过需要更新UI文本但不想处理状态管理技术的情况？如果是这样，这个包非常适合你。

功能

• 更新文本轻松简单。
• 提供旧值和新值的回调。
• 可随时重置到初始值。

开始使用

在 pubspec.yaml 文件中添加 live_text 包，并开始使用实时文本功能。

安装

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

dependencies:
  live_text: <Latest Version>

使用示例

简单计数器示例

1. 创建 LiveTextController 实例：

   LiveTextController counterLiveTextController = LiveTextController(initialValue: "0");
   

2. 创建 LiveText 小部件并提供刚刚创建的 LiveTextController：

   LiveText(
     style: Theme.of(context).textTheme.headlineMedium,
     liveTextController: counterLiveTextController,
   ),
   

3. 提供增加和减少按钮的回调：

   void _incrementCounter() {
     // 增加计数值
     counterLiveTextController.setValue = 
       (int.parse(counterLiveTextController.getValue) + 1).toString();
   }
   
   void _decrementCounter() {
     // 减少计数值
     counterLiveTextController.setValue = 
       (int.parse(counterLiveTextController.getValue) - 1).toString();
   }
   

计时器示例

以下是一个完整的计时器应用程序示例代码：

import 'dart:async';

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

class TimerExample extends StatelessWidget {
  TimerExample({super.key});

  late LiveTextController timerLiveTextController = LiveTextController(
      initialValue: "00:00",
      onValueChanged: (String oldValue, String newValue) {
        print("Timer");
        print("Old Value $oldValue");
        print("New Value $newValue");
      });

  Timer? timer;

  void _toggleTimer() {
    if (timer == null) {
      DateTime futureTime = DateTime.now().add(const Duration(seconds: 120));

      timer ??= Timer.periodic(const Duration(milliseconds: 100), (_) {
        DateTime latestTime = DateTime.now();
        if (latestTime.isBefore(futureTime)) {
          timerLiveTextController.setValue =
              formatHHMMSS(futureTime.difference(latestTime).inSeconds);
        } else {
          _clearTimer();
        }
      });
    } else {
      _clearTimer();
    }
  }

  void _clearTimer() {
    timer?.cancel();
    timer = null;
    timerLiveTextController.resetValue();
  }

  String formatHHMMSS(int seconds) {
    final hours = (seconds / 3600).truncate();
    seconds = (seconds % 3600).truncate();
    final minutes = (seconds / 60).truncate();

    final hoursStr = (hours).toString().padLeft(2, '0');
    final minutesStr = (minutes).toString().padLeft(2, '0');
    final secondsStr = (seconds % 60).toString().padLeft(2, '0');

    if (hours == 0) {
      return '$minutesStr:$secondsStr';
    }

    return '$hoursStr:$minutesStr:$secondsStr';
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text("Timer"),
      ),
      body: SafeArea(
        child: Center(
          child: Column(
            children: [
              const Spacer(),
              LiveText(
                style: Theme.of(context).textTheme.headlineLarge,
                liveTextController: timerLiveTextController,
              ),
              const Spacer(),
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 16.0),
                child: Row(
                  children: [
                    const Spacer(),
                    FloatingActionButton(
                      onPressed: _toggleTimer,
                      tooltip: 'Start Timer',
                      child: const Icon(Icons.timer_outlined),
                    ),
                    const SizedBox(width: 10),
                    FloatingActionButton(
                      onPressed: _clearTimer,
                      tooltip: 'Stop Timer',
                      child: const Icon(Icons.timer_off_outlined),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}