Rotate around image point...

  • I'm trying to get my social share button to 'jiggle' - essentially rotate 2 degrees to the left, 4 degrees to the right, 4 degrees to the left etc...

    I've got the basic functions working:

    System > Every 5 seconds > SocialShare > Rotate 2 degrees clockwise

    ................................................ System > Wait 0.1 Seconds

    ................................................ SocialShare > Rotate 4 degrees counter-clockwise

    ...but the rotate is occurring around the original image point in the upper left of the sprite (0, 0) - I've added another image point in the middle of the sprite (Image Point 1). How do I get the rotate to occur around this new image point?

  • Use ImagePointX/Y. More info in the manual (bottom of the page):

    https://www.construct.net/gb/make-games ... nce/sprite

  • Yeah, I checked out the manual first, but the phrase...

    [quote:36bztoun]

    ImagePointX

    ImagePointY

    Retrieve the position of an image point on the currently displaying animation frame of the object. You can pass either the zero-based index of the image point, or a string of its name.

    ...doesn't explain how I select another image point and use that image point as the reference image point.

  • There is probably a better way to do this with some math kung fu, but this should work:

  • Thanks dop2000 - I'll look into that.

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads
  • Here’s the math to rotate around an imagePoint. It can be any x,y point really. Here I’m only rotating by 5 degrees, you can change 5 to anything.

    Global number cx=0

    Global number cy=0

    Every tick

    —- set cx to sprite.imagePointX(1)

    —- set cy to sprite.imagePointY(1)

    —- sprite: rotate 5 degrees clockwise

    —- sprite: set position to ( (self.x-cx)*cos(5)-(self.y-cy)*sin(5)+cx, (self.x-cx)*sin(5)+(self.y-cy)*cos(5)+cy )

    Another way could be this:

    Global number d=0

    Global number a=0

    Every tick

    —- set d to distance(sprite.x,sprite.y, sprite.imagepointX(1), sprite.imagepointY(1))

    —- set a to angle(sprite.x,sprite.y, sprite.imagepointX(1), sprite.imagepointY(1))

    —- sprite: move -d pixels at a degrees

    —- sprite: rotate 5 degrees clockwise

    —- sprite: move d pixels at a+5 degrees

  • Hello Everybody!

    Just wanted to share my idea, that could be useful for math noobs (like me).

    You can create an invisible TiledBackground and let this one rotate.

    On start of layout, you set the TiledBackgrounds position to your

    Buttons imagepoint and then pin the Button to the TiledBackground (Postion & Angle).

    That would be exhausting if you have many buttons, but it works.

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