Adding a sleep timer in Flutter is one of the simplest ways to make your audio or radio app feel thoughtful and professional. Many people listen to music, podcasts or live radio in bed. Without a timer, the audio keeps playing all night, drains the battery and uses data. In this guide, you will learn how a sleep timer works, how to build one step by step, and how to give your users a smooth experience.
You do not need to be an expert. If you know basic Flutter widgets and have an audio player working in your app, you are ready to go.
Why Your Audio App Needs a Sleep Timer
A sleep timer is a small feature, but listeners notice it. It shows that you understand how people actually use your app.
- Saves battery: The audio stops when the user no longer needs it.
- Saves mobile data: This matters a lot for live streaming radio apps.
- Builds trust: Users feel in control of their listening.
- Better reviews: Missing features like this often appear in app store complaints.
For radio stations and podcast creators, a sleep timer is now almost expected. It is worth the short time it takes to build.
How a Sleep Timer in Flutter Works
The idea is simple. The user picks a duration, the app counts down, and when the time reaches zero, the app pauses or stops the audio.
The main building blocks
- A Timer: Dart's dart:async library gives you the Timer class. A periodic timer can tick every second.
- A remaining time value: A Duration that shrinks with each tick.
- State updates: So the screen can show the countdown, for example "Stopping in 14:32".
- Your audio player: Whatever package you use, such as just_audio, needs a pause or stop call.
Keeping these pieces separate makes your code easier to test and change later.
Step-by-Step: Building the Timer Logic
Let us build a small controller class that handles the countdown. Keeping logic outside your widgets is a good habit.
Step 1: Create a sleep timer controller
Create a class that extends ChangeNotifier. Inside it, store a nullable Timer called _timer and a Duration called remaining. Also keep a reference to a callback, such as onFinished, which will pause your player.
Step 2: Start the countdown
Add a start(Duration duration) method. It should:
- Cancel any existing timer first, so two timers never run at once.
- Set remaining to the chosen duration.
- Create Timer.periodic(const Duration(seconds: 1), (t) { ... }).
- Inside the tick, subtract one second from remaining and call notifyListeners().
- When remaining reaches zero, cancel the timer and call onFinished.
Step 3: Cancel the timer
Add a cancel() method that calls _timer?.cancel(), sets _timer to null, resets remaining to zero and notifies listeners. Also cancel it inside dispose() to avoid memory leaks. Forgetting to cancel timers is one of the most common Flutter bugs.
Step 4: Add a gentle fade-out
Stopping audio suddenly can wake a sleeping listener. A nicer approach is to lower the volume during the last 10 to 15 seconds. For example, when remaining is under 10 seconds, set the player volume to remaining.inSeconds / 10. After pausing, restore the volume to its normal level so the next session starts correctly.
Designing a Friendly Sleep Timer Screen
Good logic is only half the job. The user interface should be quick and obvious, because people use it when they are tired.
UX tips that work well
- Offer presets: 5, 15, 30, 45 and 60 minutes cover most needs. A bottom sheet with simple list tiles works well.
- Add "End of track" if it makes sense: For podcasts or music, this is popular. For live radio, it is not needed.
- Show the countdown clearly: Display remaining time near the play button, formatted as minutes and seconds.
- Make cancelling easy: One tap should turn the timer off.
- Use a clear icon: A moon or bedtime icon is widely understood.
Use an AnimatedBuilder or a state management package like Provider to listen to your controller. That way only the countdown text rebuilds every second, not the whole screen.
Handling Background Playback and Edge Cases
This is where many apps fall short. A user starts the timer, locks the phone, and the audio never stops. Let us avoid that.
Background behaviour
When your app goes to the background, the operating system may suspend Dart code. If your audio keeps playing through a background audio service, such as audio_service together with just_audio, it is safer to run the timer logic inside that service handler. This keeps the countdown alive while the audio plays.
Another reliable trick is to store the end time (now plus duration) instead of only counting ticks. Each tick, calculate the remaining time from the clock. If ticks are delayed, the timer still finishes at the right moment.
Edge cases to test
- The user pauses audio manually before the timer ends. Decide whether the timer should keep running or cancel.
- The user changes the station or track. The timer should usually continue.
- The app is closed completely. Make sure no stray timer remains.
- A phone call interrupts playback. Check that the timer still behaves sensibly afterwards.
Always test on real Android and iOS devices, not just the emulator. Background rules differ between platforms.
Save Time With a Ready-Made Flutter Radio App
Building a sleep timer in Flutter is a great learning exercise. But if you run a radio station or want to launch a listening app quickly, building every feature from scratch can take weeks.
The Single Radio Flutter app for Android and iOS already includes a sleep timer, a music-reactive visualizer and AdMob support. You can use it as your app or as a reference to see how these features fit together. You can also browse all our scripts and apps for other radio and directory solutions.
Need your stream online too? Anow Hosting offers SonicPanel radio hosting plans on the hosting page, so your app and stream can work together smoothly.
Final Thoughts
A sleep timer in Flutter takes only a small amount of code, yet it makes a big difference to your listeners. Start with a clean controller, add a gentle fade-out, design a simple screen, and test background playback carefully. Your users will sleep better, and your app reviews may improve too.
Want a custom audio or radio app with features like this built for you? Our team can help. Explore our Flutter App Development service and let us turn your idea into a polished app for Android and iOS.
Frequently asked questions
What is a sleep timer in a Flutter app?
It is a feature that stops or pauses audio playback after a time the user chooses, such as 15, 30 or 60 minutes. It is common in radio, podcast and music apps.
Which Dart class should I use for a sleep timer?
The Timer class from dart:async works well. Use a periodic timer to update the countdown every second, and cancel it when the user turns the timer off.
Will the sleep timer work when the app is in the background?
Dart timers can stop when the system suspends your app. Pair the timer with an audio package that supports background playback, such as just_audio with audio_service, and test on real Android and iOS devices.
Should the audio fade out before stopping?
Yes, a gentle fade over the last few seconds feels much nicer than a sudden stop. You can lower the player volume step by step before pausing.
Can I get a radio app that already has a sleep timer?
Yes. The Single Radio Flutter app sold by Anow Hosting includes a sleep timer, music visualizer and AdMob support for Android and iOS.
