-
Hello,
I am new to Bangles.js and Espruino and still learning the basic know-hows of it.
I do have a background of Javascript coding, however never worked with Graphics.Sorry, if my questions are very basic. However, after searching a lot over the internet (didn't find a lot of information on coding in this environment), I finally decided to post it here.
I want to show progress of the steps walked using a progress bar or a circle.
However, I don't understand how to implement it.
I need to have a thick bordered circle with some color to show the progress.
OR a rectangular bar that shows the progress.Right now the data is static and am really not counting the real steps.
So the data in my circle or a bar would not be changing either.
My question is ,
Qn1 : How do I create a circle with a thick border?
Qn2: how do I fill the bar with some color or the thick circle border with some color?Thanks a lot!
Thank you very much! I shall definitely go through the link for UI code you shared.
For my example, I decided that I will use the circle to show the progress.
To give you an idea, posting an image of my attempt.
I used 2 circles here, outer circle (filled with red) and inner circle(filled with black), which eventually shows me the circle with a red border.
Now, I need to fill the red circle with green color depending on the number of steps taken. In my case, a quarter of a circle.
Is my understanding correct - I need to set color for each pixel that comes inside the border?
if yes, how do I do this?
And this following qn. is out of my personal curiosity to know if I am the only one who is finding this a little difficult to code=> I have worked in Javascript and web technologies earlier and I find this coding very different from what I worked on. Is it because that's HTML and web browser that I was working on and here I need to do things differently because its a smart watch?. Even getting a simple icon on the face of the watch is so different. I tried using fonts too, however they didn't work and I didn't find any proper info on how to make them work. It kept saying that it didn't find this font, but I have no clue as to which module needs to be added. I don't have the bangle device and am using the emulator. Setting fonts otherwise in normal Javascript is so easy.
Thanks a lot once again for answering my questions.