Desarrollar una aplicación Pomodoro Timer en Flutter

En esto tutorial de aleteo, aprenderemos cómo crear una aplicación de temporizador pomodoro usando Flutter. La técnica pomodoro es un método de gestión del tiempo que ayuda a mejorar la productividad al dividir el trabajo en intervalos. Con Flutter, podemos construir fácilmente un temporizador pomodoro aplicación que permite a los usuarios establecer duraciones de trabajo y descanso, realizar un seguimiento de su progreso y mantenerse concentrados en sus tareas. ¡Comencemos y sumergámonos en el mundo del desarrollo de aplicaciones Flutter!

Construyendo un Temporizador Pomodoro La aplicación en Flutter implica la creación de un temporizador simple con intervalos para los períodos de trabajo y descanso. A continuación se muestra un tutorial paso a paso con fragmentos de código para ayudarle a comenzar.

Paso 1: configurar un proyecto de Flutter

Asegúrate de tener Flutter instalado. Si no, sigue las guía de instalación oficial.

Crea un nuevo proyecto de Flutter usando el siguiente comando:

flutter create pomodoro_timer

Navegue al directorio del proyecto:

cd pomodoro_timer

Paso 2: agregar dependencias

Abre tu pubspec.yaml archivo y agregue las siguientes dependencias para el temporizador y el sonido:

dependencies:
  flutter:
    sdk: flutter
  percent_indicator: ^3.0.1
  audioplayers: ^0.20.1

Correr flutter pub get para instalar las dependencias.

Paso 3: diseñar la interfaz de usuario

Reemplace el contenido de lib/main.dart con el siguiente código:

import 'package:flutter/material.dart';
import 'package:percent_indicator/percent_indicator.dart';
import 'package:audioplayers/audioplayers.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Pomodoro Timer',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: PomodoroTimer(),
    );
  }
}

class PomodoroTimer extends StatefulWidget {
  @override
  _PomodoroTimerState createState() => _PomodoroTimerState();
}

class _PomodoroTimerState extends State<PomodoroTimer> {
  bool isRunning = false;
  int workDuration = 25 * 60; // 25 minutes
  int breakDuration = 5 * 60; // 5 minutes
  int currentDuration = 25 * 60; // Initial duration

  final AudioPlayer audioPlayer = AudioPlayer();
  final String soundPath="assets/bell.mp3";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Pomodoro Timer'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            CircularPercentIndicator(
              radius: 200.0,
              lineWidth: 10.0,
              percent: 1 - (currentDuration / workDuration),
              center: Text(
                formatDuration(currentDuration),
                style: TextStyle(fontSize: 24.0),
              ),
              progressColor: Colors.blue,
            ),
            SizedBox(height: 20.0),
            ElevatedButton(
              onPressed: () {
                if (isRunning) {
                  resetTimer();
                } else {
                  startTimer();
                }
              },
              child: Text(isRunning ? 'Reset' : 'Start'),
            ),
          ],
        ),
      ),
    );
  }

  void startTimer() {
    setState(() {
      isRunning = true;
    });

    const oneSec = const Duration(seconds: 1);
    Timer.periodic(
      oneSec,
      (Timer timer) {
        if (currentDuration < 1) {
          playSound();
          if (isWorkTime()) {
            currentDuration = breakDuration;
          } else {
            currentDuration = workDuration;
          }
          timer.cancel();
          startTimer();
        } else {
          setState(() {
            currentDuration -= 1;
          });
        }
      },
    );
  }

  void resetTimer() {
    setState(() {
      isRunning = false;
      currentDuration = workDuration;
    });
  }

  bool isWorkTime() {
    return currentDuration == breakDuration;
  }

  String formatDuration(int durationInSeconds) {
    int minutes = durationInSeconds ~/ 60;
    int seconds = durationInSeconds % 60;
    return '$minutes:${seconds.toString().padLeft(2, '0')}';
  }

  Future<void> playSound() async {
    int result = await audioPlayer.play(soundPath, isLocal: true);
    if (result == 1) {
      // success
    } else {
      // failure
    }
  }
}

Paso 4: agregar sonido

Descarga un sonido de campana en formato MP3 y colócalo en el assets carpeta de su proyecto. Actualizar el pubspec.yaml archivo para incluir el archivo de sonido:

flutter:
  assets:
    - assets/bell.mp3

Paso 5: ejecuta la aplicación

Ejecute su aplicación Flutter usando el siguiente comando:

flutter run

Ahora, debería tener una aplicación Pomodoro Timer simple que muestra un indicador de progreso circular y le permite iniciar/restablecer el temporizador. La aplicación reproducirá un sonido de campana cuando el temporizador llegue a cero.

No dude en personalizar aún más la aplicación según sus preferencias y requisitos.