[SOLVED] Animation of the appearance from the center to the edges (curtain)

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Post Reply
Message
Author
Unknow
Newbie
Posts: 12
Joined: Wed Nov 13, 2024 5:28 pm
Contact:

[SOLVED] Animation of the appearance from the center to the edges (curtain)

#1 Post by Unknow »

It is necessary that the image (in my case, the frame) appears from the center and on the sides, like curtains.
I did this through crop, it works, but with a few minor caveats, namely shaking the image and shifting it to the left at the end of the animation.
Is there any way to solve this problem, or can I choose a different implementation?

Code: Select all

transform curtain:
    crop (331, 0, 0, 250) anchor(0.5, 0.5)
    ease 0.5 crop (0, 0, 662, 250)

screen test():
    tag menu zorder 100 modal True
    
    frame xysize(662, 250) pos(905, 834) at curtain:

        background "black"
        text "test" align(0.5, 0.5)
Last edited by Unknow on Mon Feb 03, 2025 5:15 am, edited 1 time in total.

User avatar
jeffster
Eileen-Class Veteran
Posts: 1014
Joined: Wed Feb 03, 2021 9:55 pm
Contact:

Re: Animation of the appearance from the center to the edges (curtain)

#2 Post by jeffster »

Unknow wrote: Sun Feb 02, 2025 3:32 pm Is there any way to solve this problem, or can I choose a different implementation?
Apparently width changes alternating odd and even values, hence the x position might change by 1 px back and forth.

I don't know how to fix this, but there are other ways. You can use "xzoom" which is not exactly like curtains but close:

Code: Select all

transform xzoomin:
    xanchor 0.5
    xzoom 0.
    ease 0.5 xzoom 1.

...
    frame:
        xysize (662, 250)
        pos (905, 834)
        background "black"
        text "test" align(0.5, 0.5)
        at xzoomin
Or you can have the frame of fixed size and position, and hide it with actual "curtains":

Code: Select all

transform curtain:
    xsize 331
    ease 0.5 xsize 0

...
    frame:
        xysize (662, 250)
        pos (905, 834)
        background "black"
        text "test" align(0.5, 0.5)
        add Solid("#000", xysize=(331, 250)) xalign 0. at curtain
        add Solid("#000", xysize=(331, 250)) xalign 1. at curtain
There are also Transitions like "irisin" etc. I'm not sure if it's possible to apply transitions to only a part of a screen, but if you put that frame on a separate "screen" and layer then you probably could use Dict Transitions for that:
https://renpy.org/doc/html/transitions. ... ransitions

Other ways like using CDDs and shaders are probably more complex.

PS. Actually here it is with a shader:

Code: Select all

init python:

    renpy.register_shader("mask.iris_timed", variables="""
        uniform float u_st;
        uniform sampler2D tex0;
        attribute vec2 a_tex_coord;
        varying vec2 v_tex_coord;
    """, vertex_300="""
        v_tex_coord = a_tex_coord;
    """, fragment_300="""
        if (v_tex_coord.x < (0.5 - u_st/2) || v_tex_coord.x > (0.5 + u_st/2)) {
            discard;
        }
        gl_FragColor = texture2D(tex0, v_tex_coord.st);
    """)

transform xiris:
    shader "mask.iris_timed"
    mesh True
    u_st 0.
    ease 0.5 u_st 1.

# u_st changes from 0. (fully closed curtains) to 1. (fully open).

screen test():
    frame xysize(662, 250) pos(905, 834):
        background "black"
        text "test" align(0.5, 0.5)
        at xiris
If the problem is solved, please edit the original post and add [SOLVED] to the title. 8)

Unknow
Newbie
Posts: 12
Joined: Wed Nov 13, 2024 5:28 pm
Contact:

Re: Animation of the appearance from the center to the edges (curtain)

#3 Post by Unknow »

Code: Select all

init python:

    renpy.register_shader("mask.iris_timed", variables="""
        uniform float u_st;
        uniform sampler2D tex0;
        attribute vec2 a_tex_coord;
        varying vec2 v_tex_coord;
    """, vertex_300="""
        v_tex_coord = a_tex_coord;
    """, fragment_300="""
        if (v_tex_coord.x < (0.5 - u_st/2) || v_tex_coord.x > (0.5 + u_st/2)) {
            discard;
        }
        gl_FragColor = texture2D(tex0, v_tex_coord.st);
    """)

transform xiris:
    shader "mask.iris_timed"
    mesh True
    u_st 0.
    ease 0.5 u_st 1.

# u_st changes from 0. (fully closed curtains) to 1. (fully open).

screen test():
    frame xysize(662, 250) pos(905, 834):
        background "black"
        text "test" align(0.5, 0.5)
        at xiris
Thanks a lot, it works perfectly.

GradyNash
Newbie
Posts: 1
Joined: Wed Jan 29, 2025 3:50 am
Contact:

Re: [SOLVED] Animation of the appearance from the center to the edges (curtain)

#4 Post by GradyNash »

Is your problem solved?

Post Reply

Who is online

Users browsing this forum: GetOutOfMyLab