How to flip images

128 views
Skip to first unread message

mobilefun

unread,
Mar 24, 2009, 5:33:22 AM3/24/09
to iPhone SDK Development
I'm writing apps for iPhone. I'm wondering how I can flip two images
back and forth, just like flip a coin (with two sides). Also suppose I
have a bunch of coins and I want to flip them simultaneously (not one
by one). How I can do that in iPhone SDK development?

Marc Deschenes

unread,
Mar 24, 2009, 3:48:42 PM3/24/09
to iphonesdkd...@googlegroups.com
Hey jucao, 

I would have done this using Cocos2d, as I didn't bother messing with any of the Core Graphics or controls that apple gives you by default..

you set up several sprites, and then a time interval and start/stop animation whenever you'd like. It works great for a bullet in my game that "flips about the X axis". Cocos gives you a way to do that using some of their image transforms, but it looks sketchy, like a 2d image being rotated 3 dimensionally; crappy for the effect we want. So I created 5 frames that represent the 3d rotating action, and it came together quite nice, similar to this:

               // this assumes you have a Sprite created elsewhere named "sbullet"
               // created something like this 
// Sprite* sbullet = [[Sprite spriteWithFile:@"bullet.png"] retain];

               //animation action specified with 1/10 of a second delay between frames. 
               //So 10 frames per second essentially.. worked for me, change to your needs. 
id animation = [Animation animationWithName:@"spinning_bullet" delay:0.1f]; //I have 5 images spinning_bullet_0.png - spinning_bullet_1.png, which i add to the animation
        for( int i=1;i<15;i++)
[animation addFrame: [NSString stringWithFormat:@"spinning_bullet_%0.png", i]];
        //the magic of cocos2d Actions!!!
        id action = [Animate actionWithAnimation: animation];
        //animate the bullet
        [sbullet runAction:action];


There is apparently a way to achieve image animations using what apple gives you; CABasicAnimation.. Check out a use here(only rotates however)

CABasicAnimation might be worth investigating.. 

Hope this helps.. 

Brad Larson

unread,
Mar 25, 2009, 9:55:19 AM3/25/09
to iPhone SDK Development
I would recommend using Core Animation for this. Mike Lee has written
a detailed post on how to create this effect at

http://atomicwang.org/motherfucker/Index/B4E5D81C-A9A0-403C-B7A3-62FEB81DE777.html

his sample code that accompanies that description is located at

http://boondoggle.atomicwang.org/lemurflip/

In this example, he takes the Core Animation layers for the two views
to be flipped, applies a CATransform3D to perform the flip animation,
then removes the background view. While geared towards generating
this effect on the Mac, his code can easily be ported to the iPhone.
In your case, you might even be able to simplify this further by only
working with CALayers, setting the CGImageRef contents of the layers
to contain the images representing the two sides of your coin.

______________________
Brad Larson, Ph.D.
Sunset Lake Software
http://www.sunsetlakesoftware.com
Reply all
Reply to author
Forward
0 new messages