Progress Bars🔗

completion, tracking progress, finished so far

You can mark your user's progress, adding a progress bar to the top of their screen. To do so is quite simple with the *progress keyword.

*progress: 0%

Let's begin!
*button: Next

*progress: 50%

Almost done.
*button: Next


*progress: 100%

In the above program, the progress bar will change from 0% to 50% to 100% as the user progresses through each screen of the program.

You control what the progress bar says at all times by simply typing *progress: and the percent of the progress that is complete (from 0% to 100%).

When a user presses the back button or jumps to a different part of the program, you'll have to make sure the progress bars still work as intended. Progress bars are updated on a user's screen only when they pass a *progress keyword in the program. It may be a good idea to have a *progress keyword on every screen of your program (if you've enabled back buttons, so the progress gets updated when the user presses back) as well as just after every *label keyword (so the user's progress is updated as they jump to new sections of the program).

You can also choose to hide a progress bar at a given moment. The keyword *progress: hide will cause your progress bar to disappear until the user passes another one.

Using the "update progress - public" program to generate the progress bar🔗

This is another way to display a progress bar where you do not need to calculate the value of the progress bar on each page. Instead, you let the program know how many times the progress bar needs to be updated and displayed, and it will evenly calculate and display the progress value on each page.

This is how you would use it:

  1. At the beginning of your main program, set the value of the variable in_numberOfTimesWillUpdateProgressBar to the total number of times you want to update the progress bar throughout your program. If your program is a questionnaire or a scale, this may be the total number of questions asked.
  2. Write the line *program: update progress - public every time that the progress bar needs to be displayed.
If you don't set the variable in_numberOfTimesWillUpdateProgressBar, or if you set it to an invalid value (i.e., something other than a positive number), the progress bar will not be displayed.

Here is an example of how to use it:

>> in_numberOfTimesWillUpdateProgressBar = 3

*program: update progress - public
Welcome! This is page 1.
*button: Go to page 2

*program: update progress - public
You're already on page 2.
*button: Go to page 3

*program: update progress - public
Congrats, you made it to page 3!

And you can see the source code of the update progress program here.

Some of the scales in the program library already include this program to display an optional and customizable progress bar; you can check it out by looking at their code. This is the case of the GAD-2 screening measure for generalized anxiety disorder and the PHQ-2 screening measure for depression. This is what your screening program for anxiety and depression could look like:

>> in_numberOfTimesWillUpdateProgressBar = 4

--The GAD2 scale has two items
*program: gad2 scale - public

--The PHP2 scale has two items
*program: php2 scale - public

--Final page
*program: update progress - public
Thank you!

▶ Run