Question about Interpolate

wpatenwpaten Member, PRO Posts: 281
in Working with GS (Mac)
Hey guys,

I spent some time working in Corona and something that they have is different modules that allow me the ability to have playful interpolations with images. Things like Bounces and such. I wasn't sure if there was a mathematical way to incorporate these kinds of things into the Interpolate Behavior that we have now so we had more to choose from, other than just the standard 4?

Thanks,
wpaten

Comments

  • Braydon_SFXBraydon_SFX Member, Sous Chef, PRO, Bowlboy Sidekick Posts: 9,271
    Sadly, no. We don't have that option, but it would be greatly welcomed. If you want a bounce effect, you're going to have to use several timers and interpolate behaviors in order to achieve that - i.e - interpolate self.width to 50: duration 0.2. After 0.2 seconds, interpolate self.width to 40: duration 0.2. After 0.4 seconds, interpolate self.width to 45 --- and so on.

    My GameSalad Academy Courses! ◦ Check out my quality templates! ◦ Add me on Skype: braydon_sfx

  • SocksSocks London, UK.Member Posts: 12,822
    You can do it with a sine wave that has a rapidly diminishing radius and is truncated so only uses positive (0-1) values (the speed the angle is swept through would need to increase at the same rate the radius decreases).

  • wpatenwpaten Member, PRO Posts: 281
    edited January 2014
    Sadly, no. We don't have that option, but it would be greatly welcomed. If you want a bounce effect, you're going to have to use several timers and interpolate behaviors in order to achieve that - i.e - interpolate self.width to 50: duration 0.2. After 0.2 seconds, interpolate self.width to 40: duration 0.2. After 0.4 seconds, interpolate self.width to 45 --- and so on.

    Yeah that's what I have been doing. :-)
    You can do it with a sine wave that has a rapidly diminishing radius and is truncated so only uses positive (0-1) values (the speed the angle is swept through would need to increase at the same rate the radius decreases).

    @socks

    Ahhhhh. Nothing like sweet, sweet Gopple-Dee-Gook from a Mad Scientist Genius, to make a man feel quasi-neantherthal-ish. ;-)
  • SocksSocks London, UK.Member Posts: 12,822
    edited January 2014
    @wpaten


    Ahhhhh. Nothing like sweet, sweet Gopple-Dee-Gook from a Mad Scientist Genius, to make a man feel quasi-neantherthal-ish. ;-)
    Ha, whoops ! Yeah, I didn't explain that very clearly, reading it back it does sound a little mysterious!

    Basically what I mean is if your actor is moving up and down (or left and right) via the magic of a sine wave . . . .

    Constrain Y position to radius*sin(angle) (assume the angle is constantly changing)

    . . . and the angle is limited so only the top half of the sine is used . . .

    Constrain Y position to radius*sin((angle)%180)

    . . . It will now 'bounce' rather than smoothly move up, down, up, down (etc), now reduce the radius over time . . .

    Constrain Y position to ATTRIBUTE*sin((angle)%180)
    Interpolate ATTRIBUTE from big to small

    . . . so you have a bounce that is getting progressively smaller, like a ball bouncing on the floor loosing its kinetic energy . . . but the length of each bounce remains the same (the speed at which you are changing the angle the sin function is operating on), so you also need to increase the speed the angle is being swept through to compensate for the reducing size of the bounce, first let's use game.time to sweep through the angle . . . .

    Constrain Y position to ATTRIBUTE*sin((game.time)%180)
    Interpolate ATTRIBUTE from big to small

    . . . now let's speed up game.time as the radius reduces . . .

    Constrain Y position to ATTRIBUTE*sin((game.time*ATTRIBUTE2)%180)
    Interpolate ATTRIBUTE from big to small
    Interpolate ATTRIBUTE2 from small to big

    . . . et voilà, you have a bounce that settles . . . actually it never really settles, so also throw in a rule to kill off the bounce below a certain threshold . . .

    If ATTRIBUTE > a tiny size then do this:
    Constrain Y position to ATTRIBUTE*sin((game.time*ATTRIBUTE2)%180)
    Interpolate ATTRIBUTE from big to small
    Interpolate ATTRIBUTE2 from small to big


    Hope that makes a little more sense, when I'm at my computer later I'll stick it into GameSalad and so how it looks, it should look bouncy!
  • wpatenwpaten Member, PRO Posts: 281
    @socks

    Ok I see what you did there. Very sweet.

    Your example works if the actor is already moving? What if it is stationary? So for example, if you have a button on the screen that when clicked, will have a bouncy effect (getting smaller and then larger with the bouncy effect applied to it). The x & y would be replaced with w & h, however how would you apply the bounciness from a stationary standpoint?
  • tatiangtatiang Member, Sous Chef, PRO, Senior Sous-Chef Posts: 11,949
    edited January 2014
    Ahhhhh. Nothing like sweet, sweet Gopple-Dee-Gook from a Mad Scientist Genius, to make a man feel quasi-neantherthal-ish. ;-)
    My favorite forums quote of all-time. :) Now to go back and read the gook...

    New to GameSalad? (FAQs)   |   Tutorials   |   Templates   |   Greenleaf Games   |   Educator & Certified GameSalad User

  • SocksSocks London, UK.Member Posts: 12,822
    @wpaten
    Your example works if the actor is already moving?
    Not at all, that's up to you.
    What if it is stationary?
    Write on it !
    So for example, if you have a button on the screen that when clicked, will have a bouncy effect (getting smaller and then larger with the bouncy effect applied to it). The x & y would be replaced with w & h . . .
    Yes, exactly, just swap the X and Y (or whatever you are changing) to the W & H.
    however how would you apply the bounciness from a stationary standpoint?
    Not 100% sure about what this question means, let me just make a couple of quick demos . . . . .
  • SocksSocks London, UK.Member Posts: 12,822
    edited January 2014
    @wpaten

    Ok, that was straightforward enough . . . click to bounce:
    (of course all the values can be changed to suit)


    Link: https://www.mediafire.com/?kn0onns9t9rpooq

    Ok, now to try a button . . . . back in a second . . .
  • SocksSocks London, UK.Member Posts: 12,822
    @wpaten

    Here you go, same basic deal, but applied to height and width . . . .
    (again, there's a ton of scope to adjust all the settings to taste)

    Link: https://www.mediafire.com/?fxy8x2cqnls8hg7
  • wpatenwpaten Member, PRO Posts: 281
    @wpaten

    Here you go, same basic deal, but applied to height and width . . . .
    (again, there's a ton of scope to adjust all the settings to taste)

    Link: https://www.mediafire.com/?fxy8x2cqnls8hg7
    Ahhhhhhhhhh!!!!!! That is absolutely awesome!!!! Thank you!!!!

    That's 14 Exclamation Marks worth of Fantastic. :-)
  • wpatenwpaten Member, PRO Posts: 281
    edited January 2014
    @socks

    You should add this file to that thread with all the useful code as well.
  • SocksSocks London, UK.Member Posts: 12,822
    @wpaten
    Thank you!!!!
    Actually I've just thought of a (very obvious) way you could simplify it all . . . . hold on, back in a second . . .
  • SocksSocks London, UK.Member Posts: 12,822
    Yeah, you can dump both of the interpolates and extract the rising 'speed' value and decreasing 'radius' value from the actor's own time . . . which GS developer doesn't want to get rid of two interpolates !

    It should look something like this . . .


    (20-( self.Time *20))*sin((( self.Time *(400+( self.Time)*400))-90)%180)+50
  • SocksSocks London, UK.Member Posts: 12,822
    edited January 2014
    Whoops ! No . . . it shouldn't look like that, the time multiplier is in the wrong place, It should look more like this . . .

    (20-( self.Time *20))*sin((( self.Time *(400+( self.Time *400)))-90)%180)+50

    Hold on, I'll try it out . . . . back soon . . . .
  • SocksSocks London, UK.Member Posts: 12,822
    Here you go, the values probably need a little tidying up, but the basic idea is there, the same deal, a bouncing button using the same truncated sine wave idea with a reducing radius size, but done without the attributes or 'interpenetration' ( ;) ) behaviours:

    Link: https://www.mediafire.com/?6p7w4hx2mb94dzh
  • wpatenwpaten Member, PRO Posts: 281
    @socks

    Beautiful!! The beauty of this is that with a few minus signs put in, you also have the ability to have them shrink on touch instead of grow on touch.

    Thanks a bunch man. Much appreciated.
  • SocksSocks London, UK.Member Posts: 12,822
    edited January 2014
    @wpaten
    @socks

    Beautiful!! The beauty of this is that with a few minus signs put in, you also have the ability to have them shrink on touch instead of grow on touch.

    Thanks a bunch man. Much appreciated.
    Yeah, make some values negative, make some positive, even try negative in the width equation where they are positive in the height equation, basically throw stuff around to see if you come up with something nice !

    If you want it to shrink on touch, play around with these values . .

    (30-( self.Time *(30))*sin((( self.Time * (400+( self.Time *600)))-90)%180)+50


    The basic 'core' size.
    How much the size grows and shrinks by.
  • RThurmanRThurman Member, Sous Chef, PRO Posts: 2,879
    Here is another way to do it. This method uses Hooke's Law. (Which is a generalized formula for springs and such.)

    The basic equation looks like this:
    Constrain Attribute:[ self.velocity ] To:[ ( self.velocity + ( self.targetWidth - self.Size.Width )* self.k )* self.damp ]
    Constrain Attribute:[ self.Size.Width ] To:[ self.Size.Width + self.velocity ]

    Basically its creating a velocity that is used to readjust the width. But the velocity is too fast and overshoots the target width. Then it goes in the opposite direction but overshoots again. (And so on.)

    It would oscillate forever, but we add a dampening effect that slightly slows the velocity down (kinda like friction). That's the attribute: self.damp.

    There is also an attribute called: self.k. (That's what Hooke called it. And it stuck, I guess.) Its a measure of how springy the object is.

    You can mess with different values of self.damp and self.k. It will give your button different properties.

    Here is a demo:
    http://www.mediafire.com/download/zwlvniqtseuala9/SpringyButton_HookesLaw.zip
  • SocksSocks London, UK.Member Posts: 12,822
    edited January 2014
    @RThurman

    Great stuff !! :)>-

    myReallyFancyButton :)
  • wpatenwpaten Member, PRO Posts: 281
    @RThurman

    Hey thanks man!!! Very nice.
  • RThurmanRThurman Member, Sous Chef, PRO Posts: 2,879
    @Socks -- thanks! Ain't GameSalad grand? What an incredibly versatile tool.

    @wpaten -- you are welcome! By the way, all my friends and family really love the children's apps you produce. They are just right!
  • wpatenwpaten Member, PRO Posts: 281
    @wpaten -- you are welcome! By the way, all my friends and family really love the children's apps you produce. They are just right!
    Wow! Thank You. That means a lot. :-)
Sign In or Register to comment.

© Vanilla Keystone Theme 2024