Smallest

$Date: 2004/04/18 13:25:44 $

Table of contents

Introduction
PHP script
Render options
Output
Play full example

Introduction

This example will run the smallest ProgressBar, you can build.

Percent text info is right aligned on 50 pixels width area at right side of the progress bar (default).

[Top]

PHP script

Build the progress bar

require_once 'HTML/Progress.php';

$bar = new HTML_Progress();
$bar->setAnimSpeed(100);
$bar->setIncrement(10);
$bar->setBorderPainted(true);

$ui =& $bar->getUI();
$ui->setCellAttributes('active-color=#970038 inactive-color=#FFDDAA width=7 height=12');
$ui->setBorderAttributes('width=1');
$ui->setStringAttributes(array(
    'font-size' => 10,
    'background-color' => '#C3C6C3'
));

Loop to run the progress


do {
    $bar->display();
    if ($bar->getPercentComplete() == 1) {
        break;   // the progress bar has reached 100%
    }
    // your user-process should be put HERE !
    $bar->incValue();
} while(1);

[Top]

Render options

Here are options to build the progress bar cells :

active-color   = #970038
inactive-color = #FFDDAA
width          = 7
height         = 12

HTML_Progress_UI::setCellAttributes()

Here are options to build the progress bar border :

width = 1

HTML_Progress_UI::setBorderAttributes()

Here are options to build the progress bar string (percent text info):

font-size        = 10
background-color = #C3C6C3

HTML_Progress_UI::setStringAttributes()

[Top]

Output

Screenshot

[Top]

Play full example

Run the script below :


<?php 
require_once 'HTML/Progress.php';

$bar = new HTML_Progress();
$bar->setAnimSpeed(100);
$bar->setIncrement(10);
$bar->setBorderPainted(true);

$ui =& $bar->getUI();
$ui->setCellAttributes('active-color=#970038 inactive-color=#FFDDAA width=7 height=12');
$ui->setBorderAttributes('width=1');
$ui->setStringAttributes(array(
    'font-size' => 10,
    'background-color' => '#C3C6C3'
));
?>
<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Smallest Progress example</title>
<style type="text/css">
<!--
<?php echo $bar->getStyle(); ?>

body {
    background-color: #C3C6C3;
    color: #000000;
    font-family: Verdana, Arial;
}
// -->
</style>
<script type="text/javascript">
<!--
<?php echo $bar->getScript(); ?>
//-->
</script>
</head>
<body>

<?php 
echo $bar->toHtml(); 

do {
    $bar->display();
    if ($bar->getPercentComplete() == 1) {
        break;   // the progress bar has reached 100%
    }
    $bar->incValue();
} while(1);
?>

</body>
</html>

href: ./smallest.php

[Top]