User Manual

GETTING STARTED


MODULES AND PLATFORM


APPENDIX


TUTORIALS & HELPFUL TRICKS


STRATEGIC PARTNER LINKS

Sepasoft - MES Modules
Cirrus Link - MQTT Modules

RESOURCES

Inductive University
Ignition Demo Project
Knowledge Base Articles
Forum
IA Support
SDK Documentation
SDK Examples

ALL USER MANUAL VERSIONS

Ignition 8.1
Ignition 7.9
Ignition 7.8

Deprecated Pages

Employees

Sign In

Skip to end of metadata
Go to start of metadata

General

Component Palette Icon:



Description

The Progress bar visually indicates the progress of a task. It is used to display any value that has an upper and lower bound. Custom settings are available for the track and the bar.

Properties

Most Properties have binding options. For more information on Bindings, see Types of Bindings in Perspective.
This section only documents the Props Category of properties. The other Categories are described on the Perspective Component Properties page.

NameDescriptionProperty Type
minThe minimum value of the progress indicator. If the value reaches the max, the progress indicator will be completely filled. Must be less than the max. Default is 0.value: numeric
maxThe maximum value of the progress indicator. If the value reaches the max, the progress indicator will be completely filled. Must be greater than 0.0. Default is 100.value: numeric
valueThe current value representing the current progress. Must be greater than 0.0 and less than the value set in max. Default is 50.value: numeric
mode

The following feature is new in Ignition version 8.0.13
Click here to check out the other new features
Determines if the component should show a determinate state, or an indeterminate loading state. When set to determinate, shows the progress of the value relative to the min and max properties. 

value: string 
indeterminate

If set to true, the Progress indicator will be indeterminate, thus displaying animation indicating that something is happening and will it take an indeterminate amount of time. If set to false, the Progress indicator will be determinate, and show the progress of the value to the max. Default is false.

Deprecated - This property was replaced in 8.0.13 by the 'mode' property. 

value: boolean
bar

The following feature is new in Ignition version 8.0.13
Click here to check out the other new features

Settings for the bar.

NameDescriptionProperty Type
colorA convenience property for setting the base color of the bar. This can also be accomplished by using the prop.bar.style to set the background color.object
style

Sets a style for the bar. Full menu of style options is available. You can also specify a style class.

NameDescriptionProperty Name
colorA convenience property for setting the base color of the bar. This can also be accomplished by using the prop.bar.style to set the background color.object
style

Sets a style for the bar. Full menu of style options is available. You can also specify a style class.

object
determinate

Determinate bar configuration.

NameDescriptionPropert Type
colorA convenience property for setting the color of the bar when mode is determinate. This can also be accomplished by using the prop.bar.determinate.style to set the background color.
style

Sets a style for the bar when mode is determinate. Full menu of style options is available. You can also specify a style class.

object

indeterminate

Indeterminate bar configuration.

NameDescriptionProperty Type
colorA convenience property for setting the color of the bar when mode is determinate. This can also be accomplished by using the prop.bar.determinate.style to set the background color.
style

Sets a style for the bar when mode is determinate. Full menu of style options is available. You can also specify a style class.

object

object

object

track

The following feature is new in Ignition version 8.0.13
Click here to check out the other new features

Settings for the track.

NameDescriptionProperty Type
colorA convenience property for setting the base color of the track. This can also be accomplished by using the prop.track.style to set the background color.object
style

Sets a style for the track. Full menu of style options is available. You can also specify a style class.

object
determinate

Determinate track configuration.

NameDescriptionProperty Table
colorA convenience property for setting the color of the track when mode is determinate. This can also be accomplished by using the prop.bar.determinate.style to set the background color.
style

Sets a style for the track when mode is determinate. Full menu of style options is available. You can also specify a style class.

object

indeterminate

Indeterminate track configuration.

NameDescriptionProperty Type
colorA convenience property for setting the color of the track when mode is indeterminate. This can also be accomplished by using the prop.track.indeterminate.style to set the background color.
styleSets a style for the track when mode is indeterminate. Full menu of style options is available. You can also specify a style class.object

object
valueDisplay

The following feature is new in Ignition version 8.0.13
Click here to check out the other new features

Value display configuration. Renders and styles a value overlay above the progress bar.

NameDescriptionProperty Type
enabledIf true, will show the value display.value: boolean
formatFormat to apply to value, which is then used in the value display.value: string dropdown
justifyHorizontal alignment of the displayed value.value: string dropdown
style

Sets a style for the track. Full menu of style options is available. You can also specify a style class.

object
object
style

Sets a style for this component. Full menu of style options is available for text, background, margin and padding, border, shape and miscellaneous. You can also specify a style class.

object

Perspective Component Events

The Perspective Event Types Reference page describes all the possible component event types for Perspective components. Not all component events support each Perspective component. The Component Events and Actions page shows how to configure events and actions on a Perspective component. Component scripting is handled separately and can be accessed from the Component menubar or by right clicking on the component.

Examples
Example 1

PropertyValue
max100
value80
Example 2

PropertyValue
max100
value56
modedeterminate
bar.color#FFAC47
track.color#FFE8CC
track.borderStylesolid
track.borderWidth2
track.borderBottomLeftRadius15
track.borderBottomRightRadius15
track.borderTopRightRadius15
track.borderTopLeftRadius15
track.borderColor#A45324
valueDisplay.enabledtrue
valueDisplay.formatpercent
valueDisplay.justifycenter
valueDisplay.fontFamilyMerriweather
valueDisplay.fontWeightbold


  • No labels