Implementasi Timer yang Bisa Pause dengan PausableTimer di Flutter

Kamis, 2 Oktober 2025 2 menit baca

Mobile Development

Normalnya kita mengimplementasi Timer di Flutter sebagai berikut:

var counter = 3;
Timer.periodic(const Duration(seconds: 2), (timer) {
  print(timer.tick);
  counter--;
  if (counter == 0) {
    print('Cancel timer');
    timer.cancel();
  }
});

Timer tidak memiliki pause()#

Bayangkan saat membuat stopwatch yang nilainya didapat dari mengubah Duration yang telah ditempuh Timer ke String, tentu memerlukan variable untuk menyimpannya.

Timer bawaan Flutter tidak bisa ditunda untuk dilanjutkan pada event selanjutnya.

PausableTimer#

Solusinya adalah dengan menggunakan package PausableTimer.

PausableTimer memiliki beragam API yang lebih lengkap daripada Timer bawaan.

Method yang tersedia:

• start(): Untuk menjalankan timer
• pause(): Untuk menjeda timer
• reset(): Untuk memulai ulang, perlu di-start() lagi agar timer jalan
• cancel(): Untuk menghentikan, timer tidak bisa dijalankan lagi

Option tersedia yang juga berfungsi sesuai namanya:

• duration <Duration>
• elapsed <Duration>
• tick <int>
• isPaused <bool>
• isActive <bool>
• isExpired <bool>
• isCancelled <bool>

Berikut adalah contoh implementasinya:

import 'dart:async';
import 'package:pausable_timer/pausable_timer.dart';

void main() async {
  // We make it "late" to be able to use the timer in the timer's callback.
  late final PausableTimer timer;
  var countDown = 5;

  print('Create a periodic timer that fires every 1 second and starts it');
  timer = PausableTimer.periodic(
    Duration(seconds: 1),
        () {
      countDown--;

      if (countDown == 0) {
        timer.pause();
      }

      print('\t$countDown');
    },
  )..start();

  print('And wait 2.1 seconds...');
  print('(0.1 extra to make sure there is no race between the timer and the '
      'waiting here)');
  await Future<void>.delayed(timer.duration * 2.1);
  print('By now 2 events should have fired: 4, 3\n');

  print('We can pause it now');
  timer.pause();

  print('And we wait for 2 more seconds...');
  await Future<void>.delayed(timer.duration * 2);
  print("But our timer doesn't care while it's paused\n");

  print('So we start it again');
  timer.start();
  print('And wait for 3.1 seconds more...');
  await Future<void>.delayed(timer.duration * 3.1);
  print('And we are done: 2, 1 and 0 should have been printed');

  print('The timer should be unpaused, inactive, expired and not cancelled');
  print('isPaused: ${timer.isPaused}');
  print('isActive: ${timer.isActive}');
  print('isExpired: ${timer.isExpired}');
  print('isCancelled: ${timer.isCancelled}');

  print('We can now reset it and start it again, now for 3 seconds');
  countDown = 3;
  timer
    ..reset()
    ..start();
  print('And wait for 3.1 seconds...');
  await Future<void>.delayed(timer.duration * 3.1);
  print('And it should be done printing: 2, 1 and 0');
}

Begitulah cara menggunakan timer yang dapat di-pause di Flutter.