addProgress

Hello World

Content:
- Examples
- Properties
- Methods

A progress refers to the visual indication of a task's completion status.

prg = ui.addProgress( parent, value?, options?, width?, height? ) → ui object: Progress

If you pass a null value on initialization and you won't passed a variant option, the default variant will be indeterminate.
Otherwise if there's no variant option and the value is not null, it will automatically be a determinate variant.

Here are the available methods for the Progress Component.

Examples

Example - Progress control implementation click to expand contents

class Main extends App
{
    onStart()
    {
        // Creates a fullscreen layout with objects vertically centered.
        this.main = ui.addLayout("main", "Linear", "VCenter,FillXY")
        this.main.childSpacing = "Even"

        // Indeterminate Linear
        this.prog1 = ui.addProgress(this.main, 40, "linear", 0.7)

        // Determinate Linear
        this.prog2 = ui.addProgress(this.main, null, "Linear,Secondary,indeterminate", 0.7)

        // Determinate Circular
        this.prog3 = ui.addProgress(this.main, 50, "Circular")

        // Indeterminate Circular, enlarge and secondary
        this.prog4 = ui.addProgress(this.main, null, "Circular,Secondary,indeterminate")
        this.prog4.circleSize = 100
    }
}

Copy All

Example - Setting progress value click to expand contents

class Main extends App
{
    onStart()
    {
        // Creates a fullscreen layout with objects vertically centered.
        this.main = ui.addLayout("main", "Linear", "VCenter,FillXY")
        this.main.childSpacing = "Even"

        // Add an indeterminate linear progress control to the main layout
        this.prog = ui.addProgress(this.main, 0, "Linear", 0.7)

        // Add a button control to the main layout
        this.btn = ui.addButton(this.main, "Increment")

        // Add a callback handler when the button is touched
        this.btn.setOnTouch( this.onTouch )
    }

    onTouch()
    {
        // Increment the value of the progress control by 10
        if( this.prog.value < 100 )
        {
            this.prog.value += 10
        }
        else
        {
            ui.showPopup( "Progress is complete!" )
        }
    }
}

Copy All

Properties

The following properties are available on the Progress object:

absHeight → Number

absLeft → Number

absTop → Number

absWidth → Number

backColor → String

backImage → String

border → Number

borderColor → String

borderStyle → String

circleSize → Number

color → String

cornerRadius → Number

disabled → Boolean

el → Object

elStyle → String

fontFile → String

height → Number

isVisible → Boolean

left → Number

margins → List

opacity → Number

options → String

padding → List

parent → Object

position → Object

rotation → Number

textColor → String

textSize → Number

thickness → Number

top → Number

type → String

value → Number

variant → String

visibility → String

width → Number

Methods

The following methods are available on the Progress object:

animate( anim, duration )

bringForward( zIndex )

destroy()

getPosition( options ) → Object

gone()

hide()

sendBackward( zIndex )

setBorder( left?, top?, right?, bottom?, clr?, style? )

setCornerRadius( tl?, tr?, br?, bl?, mode? )

setMargins( left?, top?, right?, bottom?, mode? )

setOnContextMenu( callback )

setPadding( left?, top?, right?, bottom?, mode? )

setPosition( left, top, mode )

setScale( x, y )

setSize( width, height, mode )

show()

Examples

Example - Progress control implementation click to expand contents

Example - Setting progress value click to expand contents

Properties

Methods

loading