PC SOFT

ONLINE HELP
 WINDEV, WEBDEV AND WINDEV MOBILE

Home | Sign in | English EN
  • Overview of the Progress Bar control
  • Control in a window or in a dynamic page
  • Creating a Progress Bar control
  • Creating a Progress Bar control in a window
  • Creating a Progress Bar control in a page
  • Characteristics of progress bars in a window: 7-tab window
  • Characteristics of the progress bars in a page: 7-tab window
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReports and QueriesUser code (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Browser code
WINDEV Mobile
AndroidAndroid Widget iPhone/iPadApple WatchUniversal Windows 10 AppWindows Mobile
Others
Stored procedures
Overview of the Progress Bar control

Control in a window or in a dynamic page

Versions 16 and later
Android This control is now available for Android applications.
WEBDEV - Server code This control is now available for WEBDEV sites on Windows and Linux.
PHP This control is now available for PHP sites.
New in version 16
Android This control is now available for Android applications.
WEBDEV - Server code This control is now available for WEBDEV sites on Windows and Linux.
PHP This control is now available for PHP sites.
Android This control is now available for Android applications.
WEBDEV - Server code This control is now available for WEBDEV sites on Windows and Linux.
PHP This control is now available for PHP sites.
Versions 19 and later
iPhone/iPad This control is now available for iPhone/iPad applications.
Universal Windows 10 App This control is now available for applications in Windows Store apps mode.
New in version 19
iPhone/iPad This control is now available for iPhone/iPad applications.
Universal Windows 10 App This control is now available for applications in Windows Store apps mode.
iPhone/iPad This control is now available for iPhone/iPad applications.
Universal Windows 10 App This control is now available for applications in Windows Store apps mode.
Versions 21 and later
Universal Windows 10 App This control is now available in Universal Windows 10 App mode.
New in version 21
Universal Windows 10 App This control is now available in Universal Windows 10 App mode.
Universal Windows 10 App This control is now available in Universal Windows 10 App mode.
The different types of progress bars are:
  • Simple linear progress bars (horizontal or vertical).
    Versions 16 and later
    WEBDEV - Server codePHP Only the simple linear horizontal progress bars are available in WEBDEV.
    New in version 16
    WEBDEV - Server codePHP Only the simple linear horizontal progress bars are available in WEBDEV.
    WEBDEV - Server codePHP Only the simple linear horizontal progress bars are available in WEBDEV.
  • Symmetric linear progress bars (horizontal or vertical): the progress bar is separated in two sections (negative and positive) used to display the progress.
    Examples of linear progress bars
    AndroidJava This type of progress bar is not available.
  • Radial gauges: a needle moves to indicate the value of the gauge.
  • WINDEVWindowsAndroidiPhone/iPadUniversal Windows 10 AppWindows Mobile Radial "LCD" gauges: a "LCD bar" is filled to indicate the value of progress bar.
    Some radial gauges
Creating a Progress Bar control
WINDEVAndroidiPhone/iPadUniversal Windows 10 AppWindows MobileJava

Creating a Progress Bar control in a window

To create a Progress Bar control:
  1. On the "Creation" pane, in the "Graphic controls" group, expand "Progress bar" and select a linear progress bar or a radial gauge.

    Versions 20 and later
    Remark: the "Infinite progress bar" option is used to create an infinite Progress Bar control.
    New in version 20
    Remark: the "Infinite progress bar" option is used to create an infinite Progress Bar control.
    Remark: the "Infinite progress bar" option is used to create an infinite Progress Bar control.
  2. Click at the desired location to create the control. The control appears in the editor.
To view the characteristics of the control, select "Description" in the context menu.
Remarks:
  • WINDEVAndroidiPhone/iPadWindows Mobile A large choice of preset radial gauges is supplied with the product. These progress bars are accessible in the "Preset controls" pane of the editor.
  • Java Only the simple linear progress bars are available.
WEBDEV - Server codePHP

Creating a Progress Bar control in a page

To create a Progress Bar control:
  1. On the "Creation" pane, in the "Graphic controls" group, expand "Progress bar".
  2. Click where you want to create the control in the page. The control appears in the editor.
To view the characteristics of the control, select "Description" in the context menu.
Remark: Only the simple linear horizontal progress bars are available in WEBDEV.
WINDEVAndroidiPhone/iPadUniversal Windows 10 AppWindows MobileJava

Characteristics of progress bars in a window: 7-tab window

The "General" tab is used to configure:
  • The type of progress bar: linear (horizontal or vertical) or radial (with needle or LCD).
  • The values of the progress bar. These values can also be specified by programming. See Handling a progress bar by programming for more details.
The "Details" tab is used to configure:
  • The images displayed in the progress bar (for linear progress bars)
    Versions 16 and later
    You can use the 9-slice scaling mode on the images displayed in progress bars.
    New in version 16
    You can use the 9-slice scaling mode on the images displayed in progress bars.
    You can use the 9-slice scaling mode on the images displayed in progress bars.
  • Whether the progress bar is symmetrical.
    AndroidJava This option is not available.
  • If the progress bar uses a fixed image.
  • If the percentage of progress must be displayed in the Progress Bar control. You can also specify whether this percentage must be blank if the displayed value is zero. You can also define the percentage position. This position can be modified by programming via ..HorizontalAlignment. The format of this percentage can be defined by programming via ..InputMask.
    AndroidJava This option is not available.
The "Style" tab is used to configure the progress bar visual parameters (including images and their position for radial gauges).
Remark: This information is also available for the progress bars displayed in Table controls.
Versions 16 and later
WEBDEV - Server codePHP

Characteristics of the progress bars in a page: 7-tab window

The "General" tab is used to configure the different values of the progress bar. These values can also be specified by programming. See Handling a progress bar by programming for more details.
The "Details" tab is used to specify if the percentage of progress must be displayed in the Progress Bar control ("Display the percentage of progress").
You can also choose to hide the percentage if it is equal to zero ("Don't display the percentage if it is equal to 0%").
The percentage position can be modified by programming via ..HorizontalAlignment. The format of this percentage can be defined by programming via ..InputMask.
The "Style" tab is used to configure the layout parameters of the progress bar. You can also configure the CSS style of the progress bar to display a progress image.
New in version 16
WEBDEV - Server codePHP

Characteristics of the progress bars in a page: 7-tab window

The "General" tab is used to configure the different values of the progress bar. These values can also be specified by programming. See Handling a progress bar by programming for more details.
The "Details" tab is used to specify if the percentage of progress must be displayed in the Progress Bar control ("Display the percentage of progress").
You can also choose to hide the percentage if it is equal to zero ("Don't display the percentage if it is equal to 0%").
The percentage position can be modified by programming via ..HorizontalAlignment. The format of this percentage can be defined by programming via ..InputMask.
The "Style" tab is used to configure the layout parameters of the progress bar. You can also configure the CSS style of the progress bar to display a progress image.
WEBDEV - Server codePHP

Characteristics of the progress bars in a page: 7-tab window

The "General" tab is used to configure the different values of the progress bar. These values can also be specified by programming. See Handling a progress bar by programming for more details.
The "Details" tab is used to specify if the percentage of progress must be displayed in the Progress Bar control ("Display the percentage of progress").
You can also choose to hide the percentage if it is equal to zero ("Don't display the percentage if it is equal to 0%").
The percentage position can be modified by programming via ..HorizontalAlignment. The format of this percentage can be defined by programming via ..InputMask.
The "Style" tab is used to configure the layout parameters of the progress bar. You can also configure the CSS style of the progress bar to display a progress image.
Related Examples:
The Progress Bar control Unit examples (WINDEV): The Progress Bar control
[ + ] Using a Progress Bar control.
WD FTP File Transfer Complete examples (WINDEV): WD FTP File Transfer
[ + ] WD FTP file transfer

This example is a full FTP client allowing you to store several FTP servers. Then, you have the ability to perform multi-file transfers from the local computer to the server or from the FTP server to the local computer. To do so, we are using the standard functions of WLanguage (FTPConnect, etc...)
The Table/TreeView Table control (Progress Bar columns) Unit examples (WINDEV): The Table/TreeView Table control (Progress Bar columns)
[ + ] Using a Progress Bar column as well as the ..TextProgressBar property in a Table or TreeView Table control
The Ajax Indicator control Unit examples (WEBDEV): The Ajax Indicator control
[ + ] This example explains how to use the "Ajax Indicator" control of WEBDEV.
This control allows you to display a progress bar for a server process.
Progress window Unit examples (WINDEV): Progress window
[ + ] Creating a progress window. This example is used to:
- Handling a progress bar by programming
- Access a child window
See also
Minimum version required
  • Version 9
This page is also available for…
Comments
Click [Add] to post a comment