TouchGFX: Creating dynamic graphic to represent Battery State of Charge (SOC)

[KMew]

Hello,

I am using the TouchGFX GUI on my custom board, which I have fully working now. We want to add a nicer visual display of our battery's SOC. We want a black background with a blue line that traces a hexagonal visual that changes based on the battery state of charge. The higher the state of charge, the further that the blue line "progresses." See below for a visual example.

 

I can create a black box and make the text look similar to that with the right font, but I am unsure how to create those light blue lines dynamically via TouchGFX.

Does anyone have any guidance on how to do this?

[ktrofimo]

Depending on what do you want. ​

You can see clean line at the bottom - it could be easily drawn by the TouchGFX. But all lines above with "glow" effect is easier to draw in Gimp/Photoshop and save as bitmap