HTML_Progress BasicsStarting out from scratch
In a hurry you've seen that such code below is not enough
to run properly a Progress Bar.
<?php
require_once ('HTML/Progress.php');
$bar = new HTML_Progress();
echo $bar->toHtml();
?>
You got only :
Why ? what's wrong with previous code ? It's very simple, HTML_Progress needs some CSS
class-selector to work fine. So if you send to browser the necessary styles, all will be ok.
<?php
require_once ('HTML/Progress.php');
$bar = new HTML_Progress();
?>
<style type="text/css">
<!--
<?php echo $bar->getStyle(); ?>
// -->
</style>
<?php
echo $bar->toHtml();
?>
And the result will be :
Running HTML_Progress
Now you know how to show a basic progress bar, what should we do to run it ?
Let's begin by a simple empty loop. Your code should be something like that :
<?php
require_once ('HTML/Progress.php');
$bar = new HTML_Progress();
?>
<style type="text/css">
<!--
<?php echo $bar->getStyle(); ?>
// -->
</style>
<?php
echo $bar->toHtml();
do {
$bar->display();
if ($bar->getPercentComplete() == 1) {
break; // the progress bar has reached 100%
}
$bar->incValue();
} while(1);
?>
What's wrong out there ? The progress bar is running but nothing change on browser screen.
As for previous error, HTML_Progress needs some CSS class-selector, and also some JavaScript
code to work fine. Adds few more lines, and example will be at end :
<?php
require_once ('HTML/Progress.php');
$bar = new HTML_Progress();
$bar->setAnimSpeed(100);
$ui =& $bar->getUI();
?>
<style type="text/css">
<!--
<?php echo $bar->getStyle(); ?>
// -->
</style>
<script type="text/javascript">
<!--
<?php echo $bar->getScript(); ?>
//-->
</script>
<?php
echo $bar->toHtml();
do {
$bar->display();
if ($bar->getPercentComplete() == 1) {
break; // the progress bar has reached 100%
}
$bar->incValue();
} while(1);
?>
| Caution | | As default increment of HTML_Progress is only +1(%), it may took few seconds before you
could see the first cell color changed. |
The empty loop was produced by a do ... while(1), with 3 HTML_Progress
methods:
HTML_Progress::display(), to show new progress result
HTML_Progress::getPercentComplete(), to test end loop
HTML_Progress::incValue(), to ajust new progress value
To avoid that browser run under quirk mode, i suggest you to puts such DTD lines on each
of your xHTML document.
<!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">
...
</html>
|
Changing look and feelProgress Bar Cell element
Here you can decide if you want to have a basic bar length (10 cells), less or more.
You may also have possibility to change all the default values.
There are 2 main methods to add and customize the cells of a Progress Bar :
HTML_Progress_UI::setCellCount(),
more details on setCellCount Manual, where you'll find a full example.
HTML_Progress_UI::setCellAttributes(),
more details on setCellAttributes Manual, where you'll find a full example.
Progress Bar Border element
Here you can decide whether to paint or not a border, around the progress bar.
You may also have possibility to change all the default values.
There are 2 main methods to add and customize the border of a Progress Bar :
HTML_Progress::setBorderPainted(),
more details on setBorderPainted Manual, where you'll find a full example.
HTML_Progress_UI::setBorderAttributes(),
more details on setBorderAttributes Manual, where you'll find a full example.
Progress Bar String element
Here you can decide whether to paint or not a custom string, with new value of progress bar.
You may also have possibility to change all the default values.
There are 3 main methods to add and customize the string of a Progress Bar :
HTML_Progress::setStringPainted(),
more details on setStringPainted Manual, where you'll find a full example.
HTML_Progress::setString(),
more details on setString Manual, where you'll find a full example.
HTML_Progress_UI::setStringAttributes(),
more details on setStringAttributes Manual, where you'll find a full example.
Progress Bar element
Here you have possibility to change all the default values (background color, width, height,
orientation, fill way ...)
There is only 3 main methods to customize a Progress Bar :
HTML_Progress_UI::setProgressAttributes(),
more details on setProgressAttributes Manual, where you'll find a full example.
HTML_Progress_UI::setOrientation(),
more details on setOrientation Manual, where you'll find a full example.
HTML_Progress_UI::setFillWay(),
more details on setFillWay Manual, where you'll find a full example.
