[Behavior] flip Sprite

  • Pode, great behavior!

    By chance do you have an updated version kicking around?

    I've noticed that I can't seem to apply the behavior to an object and then set a "on touch" event to trigger the flipping, I need to bind the flip action to a button (or other UI element) that will THEN flip the respective sprite.

    Fingers crossed

    -Remy

  • Sooo, since it seems this plugin wasn't supported anymore (and I really wanted to use it) I tried to cobble together something myself....

    The GOOD: I WAS able to reproduce a similar effect using the Tweenlite Plugin without any of the quirky errors discussed in this thread also with much more customization

    The BAD: It's not as smooth, but it will definitely serve as a poor man's version of the flip Sprite plugin

    In short:

    -Still have a sprite with two frames (could easily add more too, I think someone asked about that earlier in this thread?)

    -On click, start a tween of the sprite's width down to 0 'absolutely' (give the tween a duration of about 0.5 seconds with an easing of your choice -- "EaseInBack" gives you a nice little pulsation at the beginning and end)

    -This is now considered the halfway point of the flip so now with the width set to 0, set the animation frame to the second image in your sprite

    -Call the "reverse" tween function

    Voila! Again, it's not as smooth as the Flip sprite plugin and there is a bit of perspective lost as it's not an actual 3D transform but it will do. Perhaps the smoothness is because it's not hardware accelerated? (SOURCE?)

    Enjoy all, and cheers to Pode for exposing me to this behavior and inspiring me to work around the issues I was having.

    -Remy

  • Nice behavior, it worked well on your demo, but I can see many are complaining about bugs.

    I downloaded it, tried it, and it does not work well. I am using Construct version 206.

    When you click to flip, the back frame is shown very quickly, and then it comes back to front frame. Then you click again, and it comes back to back frame, but suddenly it comes back to front frame. So for me it's useless, unfortunately.

    Looking forward to a new version update...

  • klebson

    Considering the plugin hasn't been updated for years and Pode himself hasn't posted for over 9 months, it's looks unlikely an update will appear anytime soon.

  • remy-jay you don't actually need any plugins.. here's a small prototype I did a while ago that does something similar:

    It's only 8 events but I think it could still be improved (maybe lerping the scale instead of height/width?)

    https://dl.dropboxusercontent.com/u/238 ... proto.capx

  • andreyin Well done and thanks for sharing. That's really cool.

  • Hi .. I am on 221r

    and seams that it fails

    Javascript error!

    TypeError: this.inst.type.animations[0].frames[1] is undefined

    http://localhost:50000/Flip_behavior.js, line 59 (col 3)

    Cheers

  • can you re upload it? thanks

  • Awesome, but ...

    1) Need to fix the problem with a flip of several sprites at same time. When they 2 or more.

    2) Add flip options - flip right, flip left, up and down. Active on/off

    3) Add frame selection options or parameter. For manual or random selection.

    4) Add scale option or parameter (like it lifted under deck or place) (optional)

    5) Add the shift option or parameter (when you visually turn the card, you move it to the side) (optional)

    Anyone suggest how to implement the same flip effect by other means?

    Im try make animation in Spriter and Dragonbones - not good idea for 74 cards.

    Tried, effects, but they don't work the same as this behavior.

    If someone does, I'll be ready to buy this behavior.

  • Awesome, but ...

    1) Need to fix the problem with a flip of several sprites at same time. When they 2 or more.

    2) Add flip options - flip right, flip left, up and down. Active on/off

    3) Add frame selection options or parameter. For manual or random selection.

    4) Add scale option or parameter (like it lifted under deck or place) (optional)

    5) Add the shift option or parameter (when you visually turn the card, you move it to the side) (optional)

    Anyone suggest how to implement the same flip effect by other means?

    Im try make animation in Spriter and Dragonbones - not good idea for 74 cards.

    Tried, effects, but they don't work the same as this behavior.

    If someone does, I'll be ready to buy this behavior.

    You can do it with css and buttons, but they sit on top of the canvas.

    Take a look at this in css.

    It shuffles, then when clicked on it puts the choosen card on top (z-ordered).

    Best in Chrome, but works in Firefox and edge

    https://www.sizzle-games.com/cardflip/

  • You can do it with css and buttons, but they sit on top of the canvas.

    Take a look at this in css.

    It shuffles, then when clicked on it puts the choosen card on top (z-ordered).

    Best in Chrome, but works in Firefox and edge

    https://www.sizzle-games.com/cardflip/

    Yes. i see in behavior script blocks with something like css3 code.

    Your example look very good. But in behavior this is look much better. For example, you can see side card at every flip moment.. Not only when card was placed.

    I try search and compare other card game... well, most not use flip. Try use effects by Gigatron, not good too.

    I think that Flip-behavior can use for coins, heart, card ... maybe random item generator (if behavior will be with properties).

    You example great, but.. not so smooth. And im think with every project you need again and again re-work css. This is not ideal.

    Im not so familiar with C2 and css using.

    Can you share you primer capx? Or make only 1-2 card with no shift and transition? Only flip in a place.

    Maybe its possible combine with Moveto or Litetween behavior?

  • > You can do it with css and buttons, but they sit on top of the canvas.

    > Take a look at this in css.

    > It shuffles, then when clicked on it puts the choosen card on top (z-ordered).

    >

    > Best in Chrome, but works in Firefox and edge

    >

    > https://www.sizzle-games.com/cardflip/

    Yes. i see in behavior script blocks with something like css3 code.

    Your example look very good. But in behavior this is look much better. For example, you can see side card at every flip moment.. Not only when card was placed.

    I try search and compare other card game... well, most not use flip. Try use effects by Gigatron, not good too.

    I think that Flip-behavior can use for coins, heart, card ... maybe random item generator (if behavior will be with properties).

    You example great, but.. not so smooth. And im think with every project you need again and again re-work css. This is not ideal.

    Im not so familiar with C2 and css using.

    Can you share you primer capx? Or make only 1-2 card with no shift and transition? Only flip in a place.

    Maybe its possible combine with Moveto or Litetween behavior?

    Here's that capx.

    https://www.sizzle-games.com/cardflipped.capx

    Card faces are free from google.

    19 events

    cheers

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Dear sizcoz thank you very much for help.

    Im find another way.

    I`m combine Litetween behavior and feel happy.

    In Litetween we have condition for checking progress "On tween end" - This condition will trigger once a tween is finished. It`s great time for switch frame when tween action scale/width X (or width only) was finished.

    After then, you just switch to "reverse"-"from current position", and take width back but with new frame.

    It give many new ideas. ))

    In my testproject, im combine MoveTo + Litetween and have nice result.

    Thanks

    If someone need, i can post simple capx.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)