Dokumentation

Purpose

The Standard Progress Meter is usually the tool of choice. The Progress Meter informs users about their Progress compared to a the required maximum.

Composition

The Standard Progress Meter is composed of one bar representing a value achieved in relation to a maximum and a required value indicated by some pointer. The comparison value is represented by a second bar below the first one. Also the percentage values of main and required are shown as text.

Effect

On changing screen size they decrease their size including font size in various steps.

Composition

1. Standard Progress Meters MAY contain a comparison value. If there is a comparison value it MUST be a numeric value between 0 and the maximum. It is represented as the second bar.
2. Standard Progress Meters MAY contain a main value text.
3. Standard Progress Meters MAY contain a required value text.

/**
 * Example for rendering a standard Progress Meter with minimum configuration
 */
function base()
{
    //Loading factories
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();
 
    //Genarating and rendering the standard progressmeter
    $progressmeter = $f->chart()->progressMeter()->standard(100, 75);
 
    // render
    return $renderer->render($progressmeter);
}
 

/**
 * Example for rendering a standard Progress Meter with maximum configuration
 */
function maximum_configuration()
{
    //Loading factories
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();
 
    //Genarating and rendering the standard progressmeter
    $progressmeter = $f->chart()->progressMeter()->standard(100, 75, 80, 50);
 
    // add score text
    $progressmeter = $progressmeter->withMainText('Your Score');
 
    // add required text
    $progressmeter = $progressmeter->withRequiredText('Required Score');
 
    // render
    return $renderer->render($progressmeter);
}
 

/**
 * Example for rendering a standard Progress Meter with an comparison value only
 */
function only_comparison_value()
{
    //Loading factories
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();
 
    //Genarating and rendering the standard progressmeter
    $progressmeter = $f->chart()->progressMeter()->standard(100, 0, 75, 50);
 
    // render
    return $renderer->render($progressmeter);
}
 

/**
 * Example for rendering a standard Progress Meter when the required value was reached
 */
function user_reached_required()
{
    //Loading factories
    global $DIC;
    $f = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();
 
    //Genarating and rendering the standard progressmeter
    $progressmeter = $f->chart()->progressMeter()->standard(100, 80, 75);
 
    // render
    return $renderer->render($progressmeter);
}
 

Parents

1. UIComponent
2. Chart
3. Progress Meter