Text in circular shape

Hi,

Is it possible to display text that follows a curved line like say a circle with coding so not bitmapped ?
Now I'm using a dc.drawText command but that is only horizontally.

Kind regards,

Dirkvd001

Top Replies

ftrimboli over 4 years ago in reply to PlayItLoud +5

Here's a quick proof of concept.
xAxmaNx over 4 years ago in reply to ftrimboli +3

What's the point of a proof of concept without sharing an explanation? Even the gif could be fake.
TeunMo over 8 years ago +2

You can't rotate the letters, but you can do this:

A sample of the code I used:

function onUpdate(dc) { dc.setColor(Gfx.COLOR_BLUE, Gfx.COLOR_BLACK); //Draw line var offset = 70;…

All Replies

topcaser over 4 years ago in reply to Shent-Aurkhan (SHN)

I can't believe it's a bitmap. One would need millions of them...

1809119 over 4 years ago in reply to topcaser

I solved similar "graphic problem" two weeks ago - I wanted to design an analog watchface similar to Garmin factory default at Fenix 5 Plus but with some added features. After a huge analysis of watchface screencopies I concluded that the Garmin factory watchfaces (analog, at least) are not standard CIQ virtual machine applications. May be, they have CIQ extended by some specialized graphic functions not accessible in public SDK or the watchfaces (or their parts at least) are written directly in the ARM C/assembly language to decrease battery draining AMAP and enable the exceptional watchface design.

Thus, in CIQ VM, you have two variants how to place a text in circular shape:
1. Use predefined arrays with character patterns, perform a rotate & shift transformation and call putPixel to set pixel in display memory buffer.
2. Use font (or bitmap, but it is more memory consuming) resources with several typefaces for one character.

The first one is very slow, but could be effective if you have only several small and time-to-time changing characters on the screen. The second one is faster but memory consuming. It can be effective when you need to change the numbers only in second-to-second ratio. Of course, it is possible to use several tricks, for example if the word STEPS has five different positions according to the number of displayed digits, you can define five bitmaps with the whole word STEPS and use the right one.

PlayItLoud over 4 years ago

Challenge accepted!

ftrimboli over 4 years ago in reply to PlayItLoud

Here's a quick proof of concept.

HermoT over 4 years ago in reply to ftrimboli

Well done Franco! There is only one! Respect!

jim_m_58 over 4 years ago in reply to HermoT

I'm waiting to see what Franco does with the new animation stuff in 3.1!

MarkusGL over 4 years ago in reply to ftrimboli

FRAAAAANCO!! FRAAAANCO!!!

You are the boss !!

mitchl over 4 years ago in reply to ftrimboli

Will you publish the code for this?

It would be great if Garmin provided an API for it. While it's clearly possible with the existing APIs, having an API in the SDK would make it much easier, and it would allow Garmin to optimize it to ensure it provides the best battery life.

topcaser over 4 years ago in reply to ftrimboli

Wow, this looks amazing. Wow. Wow, At first, I am lost for words.

Thinking about this could be done (and I don't mean this animation, this is Franco's special topic) a first idea could be:

Creating a font with square space
Rotate the png of the font in e. g. photoshop in 6 degree of steps ending up with 60 fonts

What do you think? Franco, it would be great if you could share some principles how you setup this. You wrote "a quick proof of concept". If this would be really possible in a quick way which can be shared among the community this could end up with really cool upcoming watchfaces/apps in the store.

WIMA75 over 4 years ago in reply to ftrimboli

can you please share the source-code?