Dynamic Progress Bar with SVG - Sample App

[jyothis_m]

This post is just an inspiration from 

Dynamic SVG graphics by @Jonathon 

DIM (Dynamic Indicator Maker) by @Rich_E 

SVG Images Easy Icon/Background by @SkrOYC 

Custom SVG App Icons by @GreenFlux 

Using SVG "interface" images by @Kirk_Masden 

1. Created a normal SVG Progress Bar in Boxy

2. Added Visibility Attribute to the paths (rectangles representing 10%)

3. Made the Visibilty Attribute dynamic by replacing the "visible" with conditional statement IF([Percentage]>=0.20,visible,hidden) in Appsheet

And this is the result 😊

And here is the Sample App

[GreenFlux]

Very cool, @jyothis_m ! Nice work! 

[Kirk_Masden]

My words exactly -- very cool!
It would be great if AppSheet had a library of such SVG graphics -- all in sample app such as @jyothis_m  has made for us.  That way, people who don't feel ready to make them from scratch could choose from a list of possibilities.  And, of course, this progress bar by jyothis_m would be one very popular choice, I'm sure.

[Kirk_Masden]

There have, of course, been other good posts on this topic.  Here's one:
https://www.googlecloudcommunity.com/gc/Tips-Tricks/Dynamic-SVG-graphics/m-p/367578

However, it was a bit over my head.  This sample app you have made, @jyothis_m , is something I might actually be able to use because I can immediately see what the result will be and the sample app lets me know how to do it.  Thanks again!!!

[Suvrutt_Gurjar]

Nice addition to the SVG usage possibilities in AppSheet @jyothis_m 

Thank you.

[etr]

Why progress bar in table view not shown just empty????

[Kirk_Masden]

I just checked the sample app and it's working there.  Is working in the sample but not in your app?  If so, perhaps you should compare the two to look for a difference in what you are doing.