Do you like the image below?
No? And if I tell you that it is more than an image? It’s a screenshot from the Notes Client. It’s a progress bar that shows the computed result of some calculation. It’s not done with API’s, C Plus Pluses, Java Swing Wawa’s or memory leak producing raping of the client. It’s in formula and with a very simple trick. It’s so simple and obvious that everybody could have thought about that. Did I grab your attention now?
I was working on a project were some numbers were shown, representing the number of holidays used for an employee. I was thinking about a way of presenting this a little fancier and user-friendly, so I needed a way to present this graphically, as with a progress bar saying that x % of the total was used/done.
After doing some research on the web (without satisfying results), the light bulb in my head showed itself. This is how you do it for 1 progressbar:
- Create 2 computed-for-display text fields next to eachother (no space in between).
- Set the font for the fields to “Webdings”. In this font, the letter “g” represents a little block. You see where we are heading to?
- Give the first field a brighter font color (like the green I used) and the second field some gray or something.
- You also need 2 datafields giving the value and the maximum value, say we call them “Score” and “MaxScore”. The values of these fields will function as a source for the progress bar.
- The first field gets this value:
- The second field gets this value:
- That’s it!
The numbers “20” in the code are the different steps that are possible, adjust according to your needs.
You can do some styling by changing the font size, the colors, font properties, or even the used symbol. In the following example I used a shadowed font. Neat huh?
The only restriction on this technique is that you need to have webdings as a font, so this means you’ll probably need a Windows machine to display them. But I’m sure you’ll find ways to make it visible for your customers, even on other platforms.