[Newbies] Creating a coverflow effect in Squeak

Bert Freudenberg bert at freudenbergs.de
Sat Jun 14 12:20:10 UTC 2008

On 14.06.2008, at 14:04, Karl Ramberg wrote:

> Bert Freudenberg wrote:
>> On 14.06.2008, at 09:19, Herbert König wrote:
>>> Andy,
>>> AB> (not a very good description, but if you have seen iTunes, you
>>> AB> know what I mean).
>>> never seen but:
>>> AB> I had a look in Squeaksource but found nothing similar.
>>> AB> Could anyone give me some pointers on how to start this project.
>>> AB> For example, is there a 'film strip' morph that already handles
>>> AB> lists of images or something similar?
>>> this looks like classic animation (search the swiki for animation)
>>> which is one of the built in features of every morph.
>>> In general you would need a path which the Morph will follow and you
>>> would have to modify the step method of a Morph to follow that path.
>>> And your Morph would have to return something smaller than the  
>>> default
>>> 1000ms when sent stepTime.
>>> Something to play (I just did it the first time myself :-)) using
>>> 3.8.2
>>> Something to play:
>>> World menu, objects, drag out an Ellipse into the centre of your
>>> screen.
>>> Open the halo, open an Inspector on the ellipse.
>>> In the Inspector type "self definePath" (without "") and doIt.
>>> With a pressed mouse button (left on Windows) move around the screen
>>> until Squeak croaks and the cursor changes back.
>>> Then bring up the Halo again, the red one has "Extras" there "follow
>>> existing path". I just noticed that in Extras you also find "draw  
>>> new
>>> path"
>>> If you have a Menu open (Extras for example), middle click twice on
>>> the the interesting entry, bring up an Inspector and look into the
>>> target (self) and the selector (#definePath) and the arguments (if
>>> any).
>>> Oh and not to forget, there are tutorials on how to provide  
>>> different
>>> pictures while a Morph follows an animation. I remember seeing an
>>> Etoys project where a worm creeps using this technique.
>>> After you know all this I guess you will just provide your own
>>> animation methods and paths.
>> Sorry to jump in again, nothing personal, really ;)
>> The path methods are a beautifully simple and useful, but they are  
>> also a particularly bad example of Morphic programming.
>> You may notice how the entire World stops while you define a path  
>> (have a clock morph running to see this). Also it uses Sensor  
>> directly, and calls displayWorld. Both big no-nos in proper Morphic  
>> programs. The followPath method even does the actual animation in a  
>> background thread. Really Bad Things can happen if you do that.
>> Tweak did set out to allow this kind of programming (because it is  
>> so convenient), and it succeeded in that.
>> For the original question - if you want the actual cover flow  
>> effect you need a 3D renderer. You could use Croquet and OpenGL for  
>> that, but it might be overkill. The Balloon3D render should be  
>> enough for this simple type of animating.
>> If you can live with a pseudo-3D effect (like the carousel seen on  
>> the amazon.com frontpage) you can use simple 2D morphic animation  
>> of course. In that effect, the covers always remain parallel to the  
>> screen but only move position in a 3D circle so that they become  
>> smaller in the back and larger in the front, and of course are  
>> sorted back-to-front ...
>> In fact, that is so simple I couldn't resist to make an etoy  
>> version, 4 lines of code :)
>> Uploaded as
>>        http://wiki.squeak.org/squeak/uploads/Carousel.pr
>> - Bert -
> Cool, you can even edit the text in the morphs as they move :-)

Well of course ;)

I just noticed that the anim looks even more 3Dish if you change the  
factor for Y from 0.3 to 0.1 ...

- Bert -

More information about the Beginners mailing list