搜索插件、代码仓与 APP 分类

custom_timer 封面
插件详情v0.2.3

custom_timer

一个用于创建可自定义计时器的 Flutter 包,支持控制器。

AndroidiOSWebmacOSWindowsLinux
近 30 天下载
1110
喜欢数
147
Pub 分数
150

安装插件

flutter pub add custom_timer

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

一个 Flutter 包,使开发者能够创建高度可定制的计时器,并内置控制器功能。它支持实时更新、精确的时间控制,并能无缝集成到跨多个平台的 Flutter 应用中。该计时器可通过专用控制器暂停、恢复、重置和监控,非常适合用于倒计时、秒表功能或任何基于时间的 UI 组件。设计灵活且易于使用,适用于 Android、iOS、Web、macOS、Windows 和 Linux。

适合场景

  • 倒计时计时器
  • 计时器应用
  • 限时用户交互
  • 实时进度跟踪
  • 互动式学习应用
  • 游戏计时器

主要特点

  • 可自定义的计时器持续时间
  • 内置的状态管理控制器
  • 暂停、恢复和重置功能
  • 跨平台兼容性
  • 实时回调事件
  • 与 Flutter 小部件的轻松集成

适合对象

  • 开发时间敏感功能的开发者
  • 需要精确时间控制的应用程序
  • 教育类或生产力工具
  • 游戏化应用
  • 需要动态时间显示的UI组件

使用建议

  • 需要手动处理计时器生命周期
  • 可能需要额外的逻辑来处理复杂的调度
  • 未针对超出常规使用场景的高频更新进行优化
  • 内置样式选项有限(需要自定义组件组合)

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

Custom Timer ⌛

A Flutter package to create a customizable timer.


🎉 Features

  • Timer controller.
  • Auto count up / down timer.
  • Custom builder.
  • Millisecond support.

📌 Usage


example1


Add SingleTickerProviderStateMixin to your stateful widget. 👇

class _MyAppState extends State<MyApp> with SingleTickerProviderStateMixin {

Then define a CustomTimer controller

late CustomTimerController _controller = CustomTimerController(
  vsync: this,
  begin: Duration(hours: 24),
  end: Duration(),
  initialState: CustomTimerState.reset,
  interval: CustomTimerInterval.milliseconds
);

And you are ready to use the timer:

CustomTimer(
  controller: _controller,
  builder: (state, time) {
    // Build the widget you want!🎉
    return Text(
      "${time.hours}:${time.minutes}:${time.seconds}.${time.milliseconds}",
      style: TextStyle(fontSize: 24.0)
    );
  }
)

Now you can use the controller methods:

_controller.reset();
_controller.start();
_controller.pause();
_controller.finish();

_controller.add(Duration(minutes: 30));
_controller.subtract(Duration(minutes: 30));
_controller.jumpTo(Duration(hours: 12));

You can also set the begin or end, even with the counter running:

_controller.begin = Duration();
_controller.end = Duration(hours 12);

And add listeners to state changes or just use the properties when you need them:

_controller.state.addListener(() {
  print(_controller.state.value); // 👉 CustomTimerState.paused
  print(_controller.remaining.value.hours); // 👉 12h
});

Remember to dispose when you are no longer using it.


🔧 Installation

Add this to your package's pubspec.yaml file:

dependencies:
  custom_timer: ^0.2.3

Install it:

$ flutter pub get

Import the package in your project:

import 'package:custom_timer/custom_timer.dart';

🙇 Author


Hi there 👋 This package is in development so if you find a bug or have a suggestion please let me know so we can improve it! 😃 If you want to motivate me to continue, you can give me a cup of coffee ☕ and I will get a lot of energy out of it.


Buy Me A Coffee

所属分类

源码仓库

使用此插件的项目