Page 1 of 1

Animating images at different speeds

Posted: Wed Dec 16, 2015 1:16 pm
by richmond62
Pretty primitive, but as I knocked the whole thing together in 15 minutes
you shouldn't expect more.
Garuda Window.jpg
https://www.dropbox.com/s/p986vkztrx1g5 ... a.zip?dl=0

mess around with the right and left arrow keys.

Re: Animating images at different speeds

Posted: Wed Dec 16, 2015 7:17 pm
by netdzynr
A nice start. If you were looking to produce an actual parallax effect, this is usually achieved by objects closest to the viewer moving faster than objects farther from the viewer. So consider switching the rates you're using on the cloud and figure images.

I uploaded a modified version of your stack that does the above, along with some other improvements, such as smoother motion by using "send in..." instead of the repeating arrowkey message, using a single foreground image instead of 2, and others that can be seen in the sample. There's some math that could be done to calculate real parallax but a simple percentage is used here to make the clouds move slower than the figure.

In your message box: go url "http://tactilemedia.com/download/Garuda2.livecode"

(Click the stack after it downloads to switch focus to the stack so you can use your arrowkeys.)

Hope this is useful.

Re: Animating images at different speeds

Posted: Sun Dec 20, 2015 9:32 am
by richmond62
This is used to good effect in the "0 ad" game:

http://play0ad.com/

Re: Animating images at different speeds

Posted: Mon Jan 04, 2016 9:36 pm
by richmond62
Here's an animated GIF being made to move around a card.
tiger.jpg

Re: Animating images at different speeds

Posted: Tue Jan 05, 2016 9:21 pm
by richmond62
Thanks to the good offices of Brahmanathaswami and GIMP I have removed the annoying surrounding round one
of the frames in the Tiger animated GIF.

So, here is a modified version of the previous stack featuring 2 animated tigers.

My "problem" is how to get them to animate at the same time.
tiger2.jpg

Re: Animating images at different speeds

Posted: Tue Jan 05, 2016 9:58 pm
by bn
put this into button "animate"

Code: Select all

on mouseUp
   set the vis of img "Tiger" to true
   set the repeatCount of img "Tiger" to -1 -- start GIF animation in endless repeat loop
   set the vis of img "TigerBack" to true
   set the repeatCount of img "TigerBack" to -1
   set the moveSpeed to 50
   move img "Tiger" from -59, 240 to 698, 240 without waiting
   move img "TigerBack" from 698, 160 to -59, 160 without waiting
end mouseUp
set the script of img "Tiger" to

Code: Select all

on moveStopped
   set the repeatCount of me to 0 -- stops GIF-animation
   set the left of me to the left of this card
end moveStopped
set the script of img "TigerBack" to

Code: Select all

on moveStopped
   set the repeatCount of me to 0
   set the right of me to the right of this card
end moveStopped
Kind regards
Bernd

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 9:47 am
by richmond62
More "silly" stuff.

Here's a stack containing an extremely crude animated GIF I made in about 10 minutes using GIMP:
wave.png
wave.png (6.42 KiB) Viewed 14749 times
and I am attaching both the stack and the individual frames, so that anyone who wants can download
GIMP: https://www.gimp.org/downloads/

and try their hand at assembling the frames into an animated GIF.

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 11:40 am
by richmond62
Here's my, extremely simple, way of animating 2 GIF images simultaneously:
simultaneous.png

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 12:12 pm
by richmond62
Someone wrote an animated GIF generator in SuperCard:

http://forums.supercard.us/viewtopic.ph ... 1353#p6607

I wonder if one could "steal" and/or adapt it for LiveCode?

I'm going to download the SuperCard time-limited Demo onto my G5 Mac and see what I can see.

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 5:09 pm
by FourthWorld
richmond62 wrote:Someone wrote an animated GIF generator in SuperCard:

http://forums.supercard.us/viewtopic.ph ... 1353#p6607

I wonder if one could "steal" and/or adapt it for LiveCode?
The post suggests it uses SC only as a wrapper to a command-line tool, Gifsicle, available here:
http://www.lcdf.org/gifsicle/index.html

I would imagine it should be quite easy to call Gifsicle from LC.

FWIW, while this code isn't open source, Ken Ray wrote routines to create animated GIFs directly in LiveCode, taking advantage of LC's many useful binary operations:
http://www.stykz.net/

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 6:06 pm
by richmond62
The snags about Stykz are two-fold:

1. It only generates very primitive animated GIFs (mainly stick figure ones).

2. There is no Linux version.

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 6:24 pm
by FourthWorld
Yes, stick figure animation is exactly what Stykz does.

If one were inclined to make a general-purpose animation toolkit in LiveCode, Ken's work shows that the foundational elements for such a (rather large) task are indeed possible.

He made Stykz in his spare time for his son, and gives the software away at no cost. I can hardly blame him if he hasn't had the time to finish the Linux port.

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 7:21 pm
by richmond62
I think Stykz is very good at what it does.

The reason I mentioned Gifsicle was because I think that
a LiveCode-based tool that would allow one to assemble
all types of animated GIFs would be a great plus.

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 7:23 pm
by richmond62
Here's an animated GIF travelling along a path:
animateOnPath.jpg
The path is on a lower layer than the grass image
so it is hidden.

Re: Animating images at different speeds

Posted: Wed Jan 06, 2016 9:05 pm
by FourthWorld
richmond62 wrote:I think Stykz is very good at what it does.

The reason I mentioned Gifsicle was because I think that
a LiveCode-based tool that would allow one to assemble
all types of animated GIFs would be a great plus.
With LC's shell function it should be pretty straightforward to build a GUI for Gifsicle.