Real-Time Update Progress Bar

9

The Mendix’s default Progress Bar widget inside of a DataView will not be able to refresh in real-time. Maybe the Mendix Marketplace has the solution but I want to show you a different way that can be used here.

 

• Create an Entity. Name it “Progress”. Add “Current”, “Max” and “Min” decimal attributes to it. And make it Non-persistable. (This will allow the entity’s objects to act like class objects living in the client instead of database records saved on the cloud).
• Place a Progress Bar inside a Template Grid.
• Change the Template Grid’s properties: 

1. In the General tab, set Number of Rows to 1.
2. Set number of Columns to 1.
3. Make sure the Refresh time is set to 0.
4. Make sure that you don’t show control or paging bars.
5. Go to the Data source tab and change the type to Microflow.
6. Click on Select and then click on New to create a new Microflow.
7. Name the newly created Microflow CAL_Progress_Attributes

• Inside the CAL_Progress_Attribute:

1. Add a Create list activity. Set the entity of its Action section to Progress. Then name it as ProgressList.
2. Add a Create object activity. Set the entity of its Action section to Progress. Then name it as NewProgress.
3. Since NewProgress object should only live in the session and not in the database, Set it’s Commit option to No.
4. After that you’ll need to add a Retrieve list activity. The choice here depends on your project. In my case, I have a Task entity that I chose.
5. To count the elements in a list you can use an Aggregate list activity.
6. In that activity, choose the list and set the function to Count. Then Name the result variable as EntityNameTotal.
7. Now you’ll repeat 4, 5 and 6 to count the special case elements. and to do that you’ll start with a Retrieve list activity but this time you’ll have to filter the retrieval with some XPath constrains.
8. In my case it was as simple as [Status='Done']. Since my Task entity contains an Enumeration attribute called Status and has To-Do, In-Progress and Done values.
9. After that use an Aggregate list activity, choose the newly created list, set the function as Count and name the result variable as EntityNameDone.
10. Now you have your maximum and current values. Add a Change object activity. Select NewProgress as the target.
11. In the values section of the activity, set Min to 0, Max to EntityNameTotal, Current to EntityNameDone. And make sure you set Commit to No.
12. We’re almost there, now Add a Decision element to check whether the ProgressList is empty or not.
13. You can do that by setting desicion’s expression to $ProgressList = empty.
14. The Decision will split the flow of the Microflow into two paths. When you double click on its outgoing flow you can set them to True or False.
15. The True branch indicates that the list is empty. Use a Change list activity so you can Add $NewProgress to ProgressList.
16. The False branch indicates that the list is not empty. You can use another Change list activity but instead of Adding to ProgressList, you’ll choose Replace and have $NewProgress as the value.
17. Merge the two branches using a Merge element.
18. The Merge element should lead to the End event.
19. Double click the End event and set the type to List.
20. Set the entity to Progress.
21. And the return value should be $ProgressList.

 

 

 

asked 2022-06-29

0 answers