Trying to create a card flip effect

JackieMac

I'm trying to create the effect of flipping a card without using a actual animation of the card flipping.

I've tried using a combination of a Time with a Change Size (-4) for 0.5 seconds constraining the height to 100 pixels. (With a mouse click to trigger it.) So, this part works fine. The image shrinks down to a sliver. Cool.

Now, my challenge: to substitute the image (with the other side of the card), and grow it back to normal size.

I tried using a similar combo, except I change that I added a Change Image behavior. And, of course changed the Change Size behavior to 4 instead of -4. As a trigger, I use is a check on the width. If its <4, I trigger the grow.

What I'm seeing the the image shrinks (cool.) But, it doesn't grow. The width stays the same. If I take away the constrain. The height does grow. So, for some reason, the width doesn't wanna change.

Maybe its a bug?

I more certain that I'm just doing something wrong.

Or, perhaps there's just a better way to do this?

Thanks for any help. :-)

CodeMonkey

Try a larger growth value. I don't think Change Size is similar to compound interest.

So here is the analogy:
You have $1 in the bank and it doubles at the end of the year. So now you have $2.
But you have $2million dollars and it doubles you have $4million dollars.

If you relate that to pixels, you don't see much of a change from 1 to 2, but 2 million to 4 million, that's very noticeable.

Hope that helps.

JackieMac

Ah ha, interesting. I didn't realize Change Size was exponential!

Hmm, so how do I ensure the card grows back to a certain size, let's say 100x150 pixels? Is there a way to constrain that?

CodeMonkey

Here is one way you can do that:

Add a condition in your card flipping rule to check if self.size.width attribute changes and is less than 100.

I think that should work.

JackieMac

Just wanted to post that I finally got it working - woo hoo!

Thanks for your help!

Btw, folks who see this post in the future and want to know how I did a card flip effect, feel free to send me an email.

Jonathan, it'd be cool to have a way to post code code/behavior snippets. :-)

CodeMonkey

That sounds cool. You can post how it was done and code/behavior snippets in the wiki. We would love public participation if they have anything new that we have not yet documented.

I've made a space for you to add that information if you would please do so. Thanks.

http://gamesalad.com/wiki/how_to_gsc_create_a_flip_card_no_animation

JackieMac

Okay, I've created the How-To at http://gamesalad.com/wiki/how_to_gsc_create_a_flip_card_no_animation

Let me know if I typo'd any of the code, or if you have any problems with it.

Also, I uploaded a demo of it, "Card Flip Demo" to the games area.