I uploaded an example to GitHub of how to change a Clarion Progress Bar to use some API features.
You cannot chnage the Prop:Color of a Progress if a Visual Styles Manifest is used. What you can do is change via the API is change the State to Error that shows Red or Paused that colors it Yellow. You might change the state while displaying a message to the user.
A simple trick is if you set the Layout attribute with ?Progress{Prop:Layout}=1 it displays the bar in “Reverse” from Right to Left as it would for RtL text like Japanese.
The main reason I started playing with this was to get a Marquee style Progress that is a bar animation that moves without setting the number. This is intended for when you do not know how long an operation will take. Sadly my tests show the bar stops moving when the program blocks the accept loop. It would work nicely for Net Talk operations that run in another thread e.g. load a web page.
Seems like it will be a lot of fun to capture screens in action this way. My first attempt uploaded was made on a Surface with the Video zoomed to 200%. This caused some mouse clicks to capture at 100% so there would be a 1/4 sized window flicker into view for a second. It also made the GIF file larger. With this post edit I am uploading a capture done on video running at 100%.
I think modernizing some UI components gives an overall better feel to an application.
Although I noticed that the animation of the progress bar in a particular process that took little time confused the progress information, when the component is hidden at the end of the process. What would be the best solution in these cases? You can see an example in the Jeff CSV Parse Class project, when a file is processed, the numerical information of the number of records allows to notice that it is complete, but the bar graph normally does not reach 100% before hiding, sometimes it reaches to 10% sometimes more. https://github.com/jslarve/CSVParseClass/blob/main/CSVReader.clw
Just running the CSVReader project, one can see that effect, repeatable with Reload button.
Thanks for the neat demo, Carl.
I’ve used a listbox in the past to display multiple progresses at once, and have been playing with the idea of writing a class to manage it.
But it would also be cool to write a progress class that uses a container (such as IMAGE, because it can scroll) to create x number of progress controls.
I downloaded and saw this also that the visually bar grew to about 25% then hid. What I think you are running into is the animation of the Progress control trying to make it appear to smoothly grow and not just jump to 100%.
What I did below is add a message at window open before the initial load so I could capture the bar only displaying about 25%. Then under the Reload button I added a message to the end of loading and you do see the bar grow to 100% slowly while the message is open, that’s the animation finishing.
If I remove the Manifest so the Progress is the old segmented style you see the bar grow to 100%.
In TakeProgress I checked for =100 and tried some things to get the displayed bar to jump to 100% but was not able, e.g. HIDE / UNHIDE, or reset RangeHigh … Ok this works to make the progress jump to filled. Set the RangeHigh to 1.
CSV.TakeProgress PROCEDURE(LONG pProgressPct,LONG pProgress,LONG pRows)!,DERIVED
CODE
Progress1 = pProgressPct
IF pProgressPct >= 100 THEN
?Progress1{PROP:RangeHigh}=1 !<=== Bar jumps to 100% filled
END
?ProgressText{PROP:Text} = pProgress & ' of ' & pRows
DISPLAY(?Progress1)
To assure you get to 100% in JSCSVParseClass.ParseColumns at the end of the LOOP you should add Self.TakeProgress(100, Recs, SELF.GetRowCount() )
You do have to remember to set RangeHigh back to 100 on the next load.
Wow Carl, thanks for digging on it! I did try some tricks too but could make it full green and gave up. RangeHigh did it. Good finding. Those animated gif are very practical for others too see the issue without compiling!
