Skip to content

Latest commit

 

History

History
56 lines (40 loc) · 1.93 KB

progressbar.md

File metadata and controls

56 lines (40 loc) · 1.93 KB
Raw

Progress Bar widget

The Bulma progress bar is a simple CSS class that styles the native <progress> HTML element.

Loading widget looks like the following:

In progress widget looks like this:

Usage

<?php
use Yiisoft\Yii\Bulma\ProgressBar;
use Yiisoft\Yii\Bulma\Asset\BulmaAsset;

/** Register assets in view */

$assetManager->register(BulmaAsset::class);

$this->setCssFiles($assetManager->getCssFiles());

echo ProgressBar::widget()
    ->size('is-medium')
    ->color('is-info')
    ->maxValue(100)
    ->value(75);

The code above generates the following HTML:

<progress id="w1-progressbar" class="progress is-medium is-info" value="75" max="100">75%</progress>

Setters

All setters are immutable and return a new instance of the Yiisoft\Yii\Bulma\ProgressBar class with the specified value.

Method Description Default
attributes(array $value) The HTML attributes. []
autoIdPrefix(string $value) Prefix to the automatically generated widget ID. w
color(string $value) Bar color. Options available are: (ProgressBar::COLOR_PRIMARY, ProgressBar::COLOR_LINK, ProgressBar::COLOR_INFO, ProgressBar::COLOR_SUCCESS, ProgressBar::COLOR_WARNING, ProgressBar::COLOR_DANGER, ProgressBar::COLOR_DARK). Default is no color.
id(string $value) Widget ID. ''
maxValue(int $value) Maximum progress value. 0 means no maximum. 100
size(string $value) Bar size. Options available are: (ProgressBar::SIZE_SMALL, ProgressBar::SIZE_MEDIUM, ProgressBar::SIZE_LARGE). Default setting is normal.
value(float $value) The progress value. Set to 0 to display a loading animation. 0