Page 1 of 1

[SOLVED] Having trouble with Circular Motion

Posted: Sun Mar 17, 2024 7:43 pm
by saebyuk0309
Hello, I'm having trouble with the 'clockwise circles' transform and can't wrap my head around it!

I've been using this snippet of code from this very helpful tutorial to create a 'dizzy' effect:

Code: Select all

scene bg_alley blurred with vpunch:
    subpixel True
    xpos 0.5 ypos 1.0 xanchor 0.5 yanchor 1.0 zoom 1.02
    alignaround (.5, .5)
    linear 10.0 yalign 1.0 clockwise circles 1
    repeat
and it used to work perfectly, but just completely changed one day. I'm using Ren'Py 8.2.1 and I believe this issue started showing up a few weeks ago.
The circles are now much bigger and move erratically offscreen, whereas the exact same code used to produce small regular circles.

I checked the documentation, and it looks like certain parts of the above code (like alignaround) and circular motion itself are now Deprecated Properties. I'm wondering if this is conflicting with some new code, but I can't figure it out and I can't quite get it to look like it used to.
Is there an alternative way I can get the look I want?

To further clarify, I want to produce an effect where the scene moves in slow circles (not rotating) to simulate dizziness. In the example code, the background was also zoomed in slightly so that there is no transparent space.
Here's an image from the same tutorial as reference.

Thank you very much in advance for any help!

Re: Having trouble with Circular Motion

Posted: Mon Mar 18, 2024 3:15 am
by m_from_space
saebyuk0309 wrote: Sun Mar 17, 2024 7:43 pm Hello, I'm having trouble with the 'clockwise circles' transform and can't wrap my head around it!
So, suppose you want to make your background move along a small circle in the middle of the screen and be precise about it using subpixel rendering:

Code: Select all

show bg_alley:
    subpixel True
1. Set the anchor point of the image. Let's choose the center of the image for that. Note: This is NOT the point where the image will circle around, it's just the position inside the image (not the screen!), where we grab it:

Code: Select all

    anchor (0.5, 0.5)
2. Now define the position on the screen, where the image should start its motion using the position property. As a starting point, let's choose a point that is a bit away from the center point of the screen. So we grab the image in the middle and then put that middle point at this position:

Code: Select all

    pos (0.51, 0.51)
3. Now let's set the point on the screen (not the image!) where we want the image to circle around. Let's pick the center of the screen:

Code: Select all

    around (0.5, 0.5)
4. We are ready now. Let's start the circular motion by using either the keyword "clockwise" or "counterclockwise" and a time for how long we want it to take to make a full circle. The image will move around the center making a full circle, until it reaches the starting pos within 3 seconds:

Code: Select all

    linear 3.0 clockwise circles 1
5. Let's repeat the animation:

Code: Select all

    repeat
Hint: All positions can also be absolute pixel positions (using integer values) instead of relative positions (using floats).

Re: Having trouble with Circular Motion

Posted: Mon Mar 18, 2024 3:41 am
by m_from_space
Another example, making the image move along a horizontal "8"-shape (meaning two circles next to each other):

Code: Select all

show mybackground:
    subpixel True
    # both anchor and starting position are the same,
    # so instead of anchor (0.5, 0.5) and pos (0.5, 0.5), we can use align
    align (0.5, 0.5)
    # first point to circle around is slightly right of the center
    around (0.51, 0.5)
    linear 3.0 counterclockwise circles 1
    # second point is slightly left of the center
    around (0.49, 0.5)
    linear 3.0 clockwise circles 1
    repeat

Re: Having trouble with Circular Motion

Posted: Mon Mar 18, 2024 1:31 pm
by saebyuk0309
This works perfectly! Thank you so much for your help - and for thoroughly explaining the process. You're a lifesaver!