Mojo.Widget.ProgressSlider
Namespace Detail
Overview
For media, or other applications where you want to show progress as part of a tracking slider, the Progress Slider is an ideal choice. Combining the Slider widget with the Progress Pill almost gives you both widgets in one, but not all of the options are represented.
Declaration
<div x-mojo-element="ProgressSlider" id="progresssliderId" class="progresssliderClass" name="progresssliderName"></div>
Properties | Required | Value | Description |
---|---|---|---|
x-mojo-element | Required | ProgressSlider | Declares the widget as type 'ProgressSlider'. |
id | Required | Any String | Identifies the widget element for use when instantiating or rendering. |
class | Optional | Any String | Provide your own unique class and override the framework's styles. |
name | Optional | Any String | Adds a unique name to the ProgressSlider widget; generally used in templates. |
Events
Mojo.Event.listen(this.controller.get("progresssliderId"), Mojo.Event.propertyChange, this.handleUpdate);
Event Type | Value | Event Handling |
---|---|---|
Mojo.Event.propertyChange | {value: pos} | |
Mojo.Event.progressComplete | Progress is complete. |
Instantiation
this.controller.setupWidget("progresssliderId", this.attributes = { property: "value", round: true, maximumValue: 100, mininumValue: 0 }, this.model = { value: 20 } );
Attribute Properties
Attribute Property | Type | Required | Default | Description |
---|---|---|---|---|
sliderProperty | String | Optional | "slider" | Name of model property for this widget instance for the slider position |
progressProperty | String | Optional | "progress" | Name of model property for this widget instance for the progress bar position |
progressStartProperty | Integer | Optional | Null | Starting position of the progress bar |
minValue | Integer | Required | Minimum slider value, returned at leftmost position | |
maxValue | Integer | Required | Maximum slider value, returned at rightmost position | |
round | Boolean | Required | Round the value returned to the nearest integer. | |
cancellable | Boolean | Required | If true, progress cancel option is shown. | |
updateInterval | Integer | Optional | 0 | If >0, will send updates every updateInterval seconds. |
Model Properties
Model | Property | Type | Required | Default Description |
---|---|---|---|---|
value | Integer | Required | Null | Current value of widget; this will be sanitized to be between minValue and maxValue. |
Methods
To invoke a method on a widget, use the scene controller's get
method for the desired widget, and append mojo
followed by the method.
Example:
this.controller.get('myWidget').mojo.getValue()
Method | Arguments | Description |
---|---|---|
reset | Resets the progress to 0. |