App Store Widget: Bootstrap Progress Bar 1.1

5
This forum topic it to give feedback on the app store widget 'Bootstrap Progress Bar' created By Flock of Birds. The Bootstrap Progress Bar replaced the old Progress Bar, making use of Mendix 5 and dojo 1.8 functions, use Bootstrap styling. Render normal, striped or animated. Use an attribute to set bootstrap style success, warning, info, danger. Update Progress bar on refresh by microflow or change of attribute in the GUI. Add optional on click microflow. The widget is published in the App Store. https://appstore.home.mendix.com/link/app/Bootstrap-Progress-Bar Release note version 1.1: - Published source on github - Fixed auto unsubscribe for events Alternative Progress Bar widget that shows progress messages and a progress bar during the processing of microflows. In the MF the messages and percentage can be updated and are show to the user directly. https://appstore.home.mendix.com/link/app/2389/Flock-of-Birds/Progress-Bar-Button
asked
5 answers
1

Hi Andries,

Thanks for all your contributions.

What is the recommended way to use to progress bar 1.0. A long running microflow is actually executed at the end, so the progress bar is not updated linearly. What is the best way to show the app is running and will be ready within an expected time?

answered
0

Hi Andries,

Is there a possibility to implement a multi-color progressbar?
Percent 0 - 50 are green (safe zone)
50-70 is yellow (warning)
and higher is red( danger)

Would seem like a fine addition!

For example:

Bootstrap Multi color progress bar

answered
0

There is also work around us the format string widget, for stacked progress bar:

<div class="progress">
  <div class="progress-bar progress-bar-success" style="width: ${0}%">
    <span class="sr-only">${0}% Billable Hours Booked</span>
  </div>
  <div class="progress-bar progress-bar-warning" style="width: ${1}%">
    <span class="sr-only">${1}% Non Billable Hours Booked)</span>
  </div>
  <div class="progress-bar progress-bar-danger" style="width: ${2}%">
    <span class="sr-only">${2}% Missing Booked Hours</span>
  </div>
</div>

For multiply colored progress bar:

<div class="progress">
  <div class="progress-bar ${0}" style="width: ${1}%">
    <span class="sr-only">${1}% Hours Booked</span>
  </div>
</div>
answered
0

Use case:

A user has a limited time to work on a case. Say 10 hours (aka 100%) The user logs hours on this case. So my progress integer increases.

The first 3 hours would be safe (still a lot of time to go) so it would be green. After he logs his 4th hour, the bar would get an extra yellow color until the 8th hour, when it will get an extra red piece.

So the stacking progressbar is correct in terms of layout, but I only want to use one attribute for this ( or 2 since I might have to keep track of the spendable hours)

Maybe it can be done with your example, but I'm not sure how to go forward.

answered
0

I can only see integer values against the progress bar. In mendix v6.10.3 which I am using, i want to show a decimal value (let's say 50.4%) against the progress bar. Just wandering, how can it be achieved? Note: Even though I am passing a decimal value, the progress bar is showing rounded integer value.

answered