Flutter隔离区计时器插件isolate_timer的使用

Flutter 隔离区计时器插件 isolate_timer 的使用

该包提供了一个在隔离区运行的计时器逻辑，通过 BLoC 管理。

开始使用

这个包提供了一个 BLoC cubit，用于管理一个在隔离区运行的计时器。

使用示例

以下是一个完整的示例，展示了如何使用 isolate_timer 插件来创建和管理计时器。

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Isolate Timer Example'),
        ),
        body: Center(
          child: TimerWidget(),
        ),
      ),
    );
  }
}

class TimerWidget extends StatefulWidget {
  [@override](/user/override)
  _TimerWidgetState createState() => _TimerWidgetState();
}

class _TimerWidgetState extends State<TimerWidget> {
  late TimerCubit _timerCubit;

  [@override](/user/override)
  void initState() {
    super.initState();
    
    // 创建一个从 startTime 到 finishTime 运行的计时器
    final startTime = DateTime(2024, 11, 20, 10);
    final finishTime = DateTime(2024, 11, 20, 10, 0, 50);
    _timerCubit = TimerCubit(startTime, finishTime);

    // 创建一个从现在开始并持续给定时间的计时器
    final durationTimerCubit = TimerCubit.duration(Duration(minutes: 5));
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        // 显示总时长
        Text(
          'Total Duration: ${_timerCubit.maxDuration.inSeconds} 秒',
          style: TextStyle(fontSize: 20),
        ),
        SizedBox(height: 20),
        // 重启计时器
        ElevatedButton(
          onPressed: () {
            _timerCubit.reset();
          },
          child: Text('Restart Timer'),
        ),
        SizedBox(height: 20),
        // 显示格式化后的时长
        Text(
          'Formatted Duration: ${durationToMinutes(_timerCubit.maxDuration)}',
          style: TextStyle(fontSize: 20),
        ),
      ],
    );
  }

  [@override](/user/override)
  void dispose() {
    _timerCubit.close();
    super.dispose();
  }
}

代码解释

1. 导入必要的库：

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

2. 创建应用入口：

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

3. 定义应用主体：

   class MyApp extends StatelessWidget {
     [@override](/user/override)
     Widget build(BuildContext context) {
       return MaterialApp(
         home: Scaffold(
           appBar: AppBar(
             title: Text('Isolate Timer Example'),
           ),
           body: Center(
             child: TimerWidget(),
           ),
         ),
       );
     }
   }
   

4. 定义计时器小部件：

   class TimerWidget extends StatefulWidget {
     [@override](/user/override)
     _TimerWidgetState createState() => _TimerWidgetState();
   }
   

5. 初始化计时器：

   class _TimerWidgetState extends State<TimerWidget> {
     late TimerCubit _timerCubit;
   
     [@override](/user/override)
     void initState() {
       super.initState();
       
       // 创建一个从 startTime 到 finishTime 运行的计时器
       final startTime = DateTime(2024, 11, 20, 10);
       final finishTime = DateTime(2024, 11, 20, 10, 0, 50);
       _timerCubit = TimerCubit(startTime, finishTime);
   
       // 创建一个从现在开始并持续给定时间的计时器
       final durationTimerCubit = TimerCubit.duration(Duration(minutes: 5));
     }
   

6. 构建 UI：

   [@override](/user/override)
   Widget build(BuildContext context) {
     return Column(
       mainAxisAlignment: MainAxisAlignment.center,
       children: [
         // 显示总时长
         Text(
           'Total Duration: ${_timerCubit.maxDuration.inSeconds} 秒',
           style: TextStyle(fontSize: 20),
         ),
         SizedBox(height: 20),
         // 重启计时器
         ElevatedButton(
           onPressed: () {
             _timerCubit.reset();
           },
           child: Text('Restart Timer'),
         ),
         SizedBox(height: 20),
         // 显示格式化后的时长
         Text(
           'Formatted Duration: ${durationToMinutes(_timerCubit.maxDuration)}',
           style: TextStyle(fontSize: 20),
         ),
       ],
     );
   }
   

7. 释放资源：

   [@override](/user/override)
   void dispose() {
     _timerCubit.close();
     super.dispose();
   }