Function Repository Resource:

PrettyProgressBar

Source Notebook

Make a progress bar with an animation

Contributed by: Michael Sollami

ResourceFunction["PrettyProgressBar"][Dynamic[x]]

represents an animated progress bar that updates dynamically with x in the range 0 to 1.

Details and Options

The following options can be given:
AnimationDirectionBackwardspecifies the direction in which to run an animation
AnimationRate30specifies at what rate an animation should run, in units per second
Appearance"Aqua"appearance of the bar; this can be either "Aqua" or "Barber"
BackgroundNonespecify the color of the background
ImageSize{200, 16}set the width or {width,height} (with contraint 10 ≤ height ≤ 32)
StyleAutomaticcustomize the colors {color1,color2} for "Barber" appearance

Examples

Basic Examples (2) 

Make a controller:

In[1]:=
x = .5; Slider[Dynamic[x], {0, 1}]
Out[1]=

Create a "Barber" style progress bar that displays the value of the control:

In[2]:=
ResourceFunction["PrettyProgressBar"][Dynamic[x], Appearance -> "Barber", AnimationRate -> 6, Background -> Lighter@Gray]
Out[2]=

Scope (2) 

Display the retro-styled progress bar with different animation rates:

In[3]:=
y = 1; Slider[Dynamic[y], {0, 1}]
Out[3]=
In[4]:=
Table[ResourceFunction["PrettyProgressBar"][Dynamic[y], Background -> LightGray, AnimationDirection -> Forward, ImageSize -> {100, 20}, AnimationRate -> 5*i*j], {i, 4}, {j, 3}] // Grid
Out[4]=

With the "Barber" appearance the colors can be set using Style:

In[5]:=
z = 0.75; Slider[Dynamic[z], {0, 1}]
Out[5]=
In[6]:=
ResourceFunction["PrettyProgressBar"][Dynamic[z], Appearance -> "Barber", AnimationDirection -> Forward, AnimationRate -> 10,
 ImageSize -> 320, Style -> {Lighter[Blue, .4], Lighter[Hue[0.5], .3]}, Background -> Black]
Out[6]=

Publisher

Michael Sollami

Version History

  • 1.0.0 – 23 June 2020

Related Resources

License Information