Progress Bars
Overview
A progress bar enables a window to provide progress information to the user without the need of switching to the window itself.
On Windows, you can use a taskbar button to display a progress bar.
On macOS, the progress bar will be displayed as a part of the dock icon.
On Linux, the Unity graphical interface also has a similar feature that allows you to specify the progress bar in the launcher.
NOTE: on Windows, each window can have its own progress bar, whereas on macOS and Linux (Unity) there can be only one progress bar for the application.
All three cases are covered by the same API - the
setProgressBar() method available on an instance of
BrowserWindow. To indicate your progress, call this method with a number
between 0 and 1. For example, if you have a long-running task that is
currently at 63% towards completion, you would call it as
setProgressBar(0.63).
Setting the parameter to negative values (e.g. -1) will remove the progress
bar. Setting it to a value greater than 1 will indicate an indeterminate progress bar
in Windows or clamp to 100% in other operating systems. An indeterminate progress bar
remains active but does not show an actual percentage, and is used for situations when
you do not know how long an operation will take to complete.
See the API documentation for more options and modes.
Example
In this example, we add a progress bar to the main window that increments over time using Node.js timers.
<title>Hello World!</title>
<metahttp-equiv="Content-Security-Policy"content="script-src 'self' 'unsafe-inline';"/>
</head>
<body>
<h1>Hello World!</h1>
<p>Keep an eye on the dock (Mac) or taskbar (Windows, Unity) for this application!</p>
<p>It should indicate a progress that advances from 0 to 100%.</p>
<p>It should then show indeterminate (Windows) or pin at 100% (other operating systems)
briefly and then loop.</p>
</body>
</html>
