Example

Progress Bar

Author: Carl Sassenrath
This example requires REBOL/View
Return to REBOL Cookbook

Here's how to create and control a simple progress bar in a window. Below the bar, four buttons are provided: empty, half, full, and move (from empty to full).


    view layout [
        style button button 60 ; to set width smaller
        p1: progress 270 coal green
        across
        button "Empty" [
            p1/data: 0
            show p1
        ]
        button "Half" [
            p1/data: 0.5
            show p1
        ]
        button "Full" [
            p1/data: 1
            show p1
        ]
        button "Move" [
            repeat n 20 [
                p1/data: n / 20
                show p1
                wait 0.1
            ]
        ]
    ]

Each button changes the /DATA field (ranging between 0 and 1) then does a SHOW to update the progress bar.

The background and foreground colors can be set, as shown here with the COAL and GREEN colors.

The progress bar is horizontal, but if you make it taller than it is wide, it will become vertical. For example, try this:


    p1: progress 16x270 coal green

And of course you can make progress bars any size, fat or skinny. It's up to you.


2006 REBOL Technologies REBOL.com REBOL.net