Loading Bar

Overview

Loading Bar is an optional component that can be placed on any Image inside your loading screen prefab. You can open the Bars scene to see them all visually.

It supports two modes:

Idle animation that plays while loading
Progress mode that tracks the actual scene load percentage

Usage

You can either use provided presets, or create on your own.

Use Presets

Select a loading screen prefab and double-click to open it

Expand the Content section and click the Replace Loading Bar button

This will open a menu where you can select from any presets available in your project

You can alternatively drag and drop prefabs into the Loading Bar container the old-fashioned way.

Create New Presets

Add an Image component to a UI object inside your loader prefab

Add the Loading Bar component to the same object

Set a Bar Style and configure its settings

Enable Show Loading Progress if you want the bar to reflect real load progress

If barImage is left empty, the component attempts to find an Image on the same object automatically.

Bar Styles

Style	Description
`Radial`	A circular spinner. The fill amount oscillates and the image rotates, creating a smooth animated ring effect.
`Horizontal`	A horizontal bar that animates according to the configured `loopMode` in idle mode, or fills left to right in progress mode.
`Vertical`	Same as Horizontal but fills bottom to top.
`Fill`	A simple filled image. Animates its fill amount in idle mode using the configured `loopMode`, or maps directly to load progress.
`SpriteSheet`	Cycles through a list of sprites at a configurable frame rate. Supports both idle animation and progress-mapped frame selection.
`Sequential`	Animates a series of UI elements (grouped into phases) by scaling or fading them in sequence. Useful for dot-style or step indicators.

Properties

Style

Name	Type	Description
`barStyle`	`BarStyle`	The visual style of the bar.
`loopMode`	`BarLoopMode`	Controls how the idle animation loops. Only used by `Horizontal`, `Vertical`, and `Fill` styles. See the table below.
`rotationSpeed`	`float`	Speed multiplier for Radial rotation and the idle animation on Horizontal/Vertical/Fill styles.
`minFillAmount`	`float`	Minimum fill used by the Radial idle oscillation and as the indicator window size for other styles.
`maxFillAmount`	`float`	Maximum fill used by the Radial idle oscillation.

Loop Modes

Mode	Description
`Continuous`	The indicator sweeps forward in a single direction and wraps seamlessly back to the start.
`PingPong`	The indicator sweeps forward then reverses, bouncing back and forth.
`Ping Pong (Forward)`	Fills forward then unfills forward, creating a wipe-in / wipe-out effect.

Sprite Sheet

Name	Type	Description
`sprites`	`List<Sprite>`	Ordered list of sprites for the SpriteSheet style.
`frameRate`	`float`	Playback speed in frames per second.

Sequential

Name	Type	Description
`sequentialType`	`SequentialType`	How each phase element is animated: `Scale` resizes each target, `Fade` adjusts its alpha via a `CanvasGroup`.
`sequentialPhases`	`List<SequentialPhase>`	Ordered list of phases. Each phase holds a list of `RectTransform` targets that are animated together. Phases activate progressively as the animation or progress advances.

Loading Progress

Name	Type	Description
`showLoadingProgress`	`bool`	When enabled, the bar tracks real scene load progress instead of playing the idle animation.
`enableSmoothing`	`bool`	Smooths progress updates to avoid jarring jumps.
`smoothingDuration`	`float`	Duration of the smooth transition between progress values.
`smoothingCurve`	`AnimationCurve`	Easing curve applied to the smoothing lerp.

Fade Out

Name	Type	Description
`fadeOnComplete`	`bool`	When enabled, the bar fades out automatically once loading is complete. Applies regardless of whether `showLoadingProgress` is on.
`fadeDuration`	`float`	Duration in seconds for the fade-out. Set to `0` for an instant hide.

Progress Text

Name	Type	Description
`progressText`	`TMP_Text`	Optional text element to display the progress value.
`textFormat`	`string`	Format string for the text. Use `{0}` as the value placeholder (e.g. `{0}%`).
`displayFormat`	`DisplayFormat`	Numeric format for the progress value. See the table below.

Display Formats

Format	Example Output
`Fixed0`	`75`
`Fixed1`	`75.4`
`Fixed2`	`75.42`
`Fixed3`	`75.423`
`Number0`	`75`
`Number1`	`75.4`
`Number2`	`75.42`
`Number3`	`75.423`

Number formats add locale-aware thousand separators (e.g. 1,234) while Fixed formats do not.

References

Name	Type	Description
`barImage`	`Image`	The Image component driven by the bar. Auto-assigned from the same object if empty. Not required for the `Sequential` style.
`loadingScreenOverride`	`LoadingScreen`	Override which `LoadingScreen` instance to poll for progress. Leave empty to fetch automatically.

Idle mode (showLoadingProgress = false) runs a looping animation that plays regardless of actual load progress. It is well suited for loaders where the exact percentage is not important, or for the TransitionOnly load mode.

Progress mode (showLoadingProgress = true) polls the active LoadingScreen instance every frame and maps its AsyncOperation.progress to the bar's fill amount.

Unity's AsyncOperation.progress caps at 0.9 before scene activation. LoadingBar normalises this to a clean 0–1 range automatically.

Regardless of mode, the bar always polls the loading operation so that fadeOnComplete fires correctly when the scene finishes loading.

Public Methods

Method	Parameters	Description
`Animate(value)`	`bool`	Starts or stops the idle animation coroutine manually.
`SetProgress(normalizedProgress)`	`float`	Manually sets the displayed progress (0–1). Only works when `showLoadingProgress` is `true`.
`SetBarStyle(style)`	`BarStyle`	Changes the bar style at runtime and reconfigures the Image accordingly.

Code Example

CustomProgressBar.cs

using Evo.Loader;
using UnityEngine;

public class CustomProgressBar : MonoBehaviour
{
    public LoadingBar loadingBar;

    void Start()
    {
        // Switch to a horizontal progress bar at runtime
        loadingBar.SetBarStyle(LoadingBar.BarStyle.Horizontal);

        // Manually drive progress (e.g. from a custom download)
        StartCoroutine(SimulateDownload());
    }

    System.Collections.IEnumerator SimulateDownload()
    {
        float progress = 0f;
        while (progress < 1f)
        {
            progress += Time.deltaTime * 0.2f;
            loadingBar.SetProgress(progress);
            yield return null;
        }
        loadingBar.SetProgress(1f);
    }
}