Round clock style timer

syman

Hi,

Not sure where to start - Trying to create a circular timer that starts off as a full solid circle then has a smooth animation going all the way round to nothing based on a timer - full -> 3 quarters -> half -> quarter -> gone! (Not sure if I'm explaining it too well so - at around 1/3 of the time gone it would look a bit like pacman.

I imagine you would need to use Constrain Attribute but that's about it lol. Not sure how to animate the circle.

netdzynr

I don't think you can build something like this in GS because it doesn't provide vector objects or object masking. You could do analog clock hands, but I believe a pie timer would need a series of frames (images).

firemaplegames

You can do it with trickery...

You would need to make a stack of 4 actors. (and this would only work if the background directly behind the timer was static)

You would need to stack three 4 images:

1. A half circle. (just the left half of the circle timer)
2. A half circle. (just the right half of the circle timer)
3. A half circle. (just the right half, but this is a screenshot of the "empty" right side)
4. A half circle. (just the left half of the circle timer)

#1 and #4 would be identical.

Let's say the timer is 60 seconds.

For the first 30 seconds, rotate the #2 image clockwise 180 degrees.
At 30 seconds, make #1 and #2 invisible
For the second 30 seconds, rotate the #4 image clockwise 180 degrees.

The #3 image does not do anything.

syman

Yea that's what I was thinking netdzynr, would take tons of images for a smooth animation...

Thanks very much firemaplegames, That's a brilliant idea - very clever workaround!

(loved dangercats btw)

netdzynr

That's a great workaround FMG. It's one of those solutions that requires capturing/duplicating any background textures/gradients, but still a clever idea.

Imagine how many things would be made so much easier if we were able to assign masks to actors...

UP

(I probably don't get it… but…)

FMG, why would the background need to be static?
Is it not possible to use PNG's with transparency
and still have moving elements behind it ?

firemaplegames

you would need it to be static right behind the circle for the illusion to work...

GS does not currently have masks. If it did, then it could be placed over a dynamic background.

#3 in the stack needs to cover up #4.
#4 rotates behind it.

I'll see if I can make a demo.

UP

Hhmmm.. I think my brain 'sees' a different timer then discussed...
I'll just hang in there and see what happens for now.. :-)

firemaplegames

Here's a quick demo...

http://gamesalad.com/game/play/61431

Currently it is just on a gray background, it could easily be a picture. The third actor in the stack just needs to be a screenshot of the empty right side side...

UP

Aaahh now I see... clever..

(For my understanding as a noob..)
If wanting a transparent timer anyhoo, creating lots of frames with PNG's
would not be an option cause it will slow the game down like crazy I guess…?

firemaplegames

yeah, a bunch of .pngs would kill the FPS...

You can still make it LOOK transparent...

By doing it this way, it can look absolutely any way you want it to. No limit to the visuals. You just need to create the four images properly.

UP

Yeah I got that part, no limits to the visual aspect..
So for now just avoid any moving actors from coming too close..

Would be nice though to have a timer floating along with a moving actor,
until the 'special power' runs out or whatever.. Or.. or...
Crap, the more I think of it, masking would be such a relief for many things!!

Alright, too bad..
But thanks a bunch for the demo / info FMG :-)

firemaplegames

You could make it follow along with the player, it just can't be transparent.

But it could be in a little stopwatch, or something like the Safari logo...

UP

But the little stopwatch would still have to be inside some rectangular shape though..
Without transparency round shapes are no fun.. ;-)

firemaplegames

It CAN be circular...

Those two .pngs in my demo are transparent outside of the circle.

What I meant by transparent, was that the circles themselves cannot be transparent - i.e. 50% opacity - and move around and follow the player.

However, they CAN be transparent if they don't move around.

In BOTH cases, outside of the circle can be completely transparent. The little stopwatch does not need to be in a rectangular shape.

UP

Darn you got me!! Back to being exited!
And I 'think' you just made me a little smarter… :-)

netdzynr

What's the granularity of the timer? What's the size? If it's a seconds timer, it will only update once per second -- probably not a very demanding frequency. And if the timer is small in size, it's probably not worth updating every second -- you could probably get away with every 2 seconds. So if you did go the multiple-frames route, you'd need 29 images, updating once every 2 seconds. I think GS should quite capable of doing this without bogging everything down.

Regardless, FMG's creative solution is also appealing, and it occurred to me you could place the semi-circle images within a simple "frame" (a square, rhombus, or even hexagon or octagon), thus the timer could be placed on top of any background without issue.