UGTK cat mascotUGTKengine within an engine Request access

UGTK / Toolkit / Ui Module / Coroutine Timer Slider System Completed

Ui Module — UGTK

Coroutine Timer Slider System

Summary

The Coroutine Timer Slider System is a progress bar that fills itself over a duration: give it a number of seconds and it drives a Slider from 0 to 1, writes the percentage in a label, and calls you back when it is done.

It is the "hold to confirm", the "opening in 3 seconds", the loading bar of a fake wait — anywhere you need visible, interruptible progress without writing the coroutine yourself.


Content


Modules Dependencies

None inside UGTK. It uses Unity UI (Slider) and TextMeshPro.


Setup

Drop the CourutineTimerSlider prefab under your canvas — it already carries the slider and the percentage label wired to the component.

Adding the component by hand works too, as long as you assign both references: the Slider and the TMP_Text.

The two references are the whole setup, and both are mandatory: with either missing the coroutine logs an error and exits without invoking the callback. The prefab in Prefabs/ already has the slider and the label in place, which is why starting from it is the shorter route.


How To Use

timerSlider.StartTimer(5f, () => Debug.Log("Done!"));
timerSlider.StartTimer(3f);              // callback optional

StartTimer shows the slider and the label, fills over duration seconds writing the percentage each frame, snaps to exactly 100% at the end and then invokes the callback.

Good to know:


Testing Scene

Open Debug/CourutineTimerSliderScene.unity. A Canvas holds the CourutineTimerSlider prefab with Mn_CourutineTimerSlider wired to its own slider and to the TMP label inside the fill; TimerSliderTest carries Mn_CourutineTimerSliderTest. Both need Play Mode: the fill is a coroutine, and coroutines do not run with the editor stopped.

Press Play, then either use the 1s / 3s / 10s buttons in the component's own inspector, or right-click Mn_CourutineTimerSliderTest and pick from its context menu:

  1. Start Timer — the bar fills over Duration seconds and the label counts up to 100%. The callback logs when it arrives.
  2. Start Twice — starts a timer and immediately starts a second, shorter one. Only the second callback ever arrives: StartTimer stops the running coroutine before starting a new one, so anything waiting on the first is waiting forever. Worth knowing before wiring a "next level" callback to it.
  3. Freeze Time Scale mid-fill — the bar stops where it is. The coroutine runs on Time.deltaTime, so a pause menu that sets Time.timeScale = 0 freezes it too. Restore Time Scale and it carries on.

One thing that fails silently: with either the Timer Slider or the Percentage Text reference missing, the coroutine logs an error and exits without invoking the callback. Whatever was waiting on it waits forever, and there is nothing on screen to suggest why.


Technical Info

Path Content
Scripts/Mn_CourutineTimerSlider.cs The component: StartTimer(float, Action) and the internal coroutine that advances the slider and the percentage label
Prefabs/CourutineTimerSlider.prefab Slider and label already wired

© 2026 Marcello De Bonis. All rights reserved