Viewports: edgescroll and ui.adjustment() workaround?

[jwideman]

The background image is wider than the window and I want the images (gradient left/right) to only show when the viewport is in the middle. What's the workaround for this? I've tried XScrollValue(), but that returns a bar value.

Code: Select all

screen scr_street_hmc():
    modal True

    default xadj = ui.adjustment()

    viewport:
        edgescroll (89,1000)
        xadjustment xadj
        id "hmc"

        window:
            xsize 2560
            ysize 720
            background "[bg]"

            frame:
                xcenter 0.25
                ycenter 0.9
                padding (15,10,15,10)

                style_prefix "textbuttons"

                textbutton "Go Inside":
                    style "textbuttons"
                    action Jump("mc_living")

    showif xadj.value > 0:
        add "images/gradient left.png"

    showif xadj.value < 2560:
        add "images/gradient right.png" xalign 1.0

[hell_oh_world]

The background image is wider than the window and I want the images (gradient left/right) to only show when the viewport is in the middle. What's the workaround for this? I've tried XScrollValue(), but that returns a bar value.

Code: Select all

screen scr_street_hmc():
    modal True

    default xadj = ui.adjustment()

    viewport:
        edgescroll (89,1000)
        xadjustment xadj
        id "hmc"

        window:
            xsize 2560
            ysize 720
            background "[bg]"

            frame:
                xcenter 0.25
                ycenter 0.9
                padding (15,10,15,10)

                style_prefix "textbuttons"

                textbutton "Go Inside":
                    style "textbuttons"
                    action Jump("mc_living")

    showif xadj.value > 0:
        add "images/gradient left.png"

    showif xadj.value < 2560:
        add "images/gradient right.png" xalign 1.0

By "viewport in the middle", you mean when the scrollbar of the viewport is in the middle? Actually, it's not really clear for me what you're trying to achieve here. Care to elaborate more?

[jwideman]

I thought it should be obvious from the code. Okay, a visual aid then:

This is resized for the forum, but it's 3200 pixels wide. The areas in red are off the screen. That's the middle of the viewport. Those gradients are what I want on the screen when it's in this position.

Notice how the gradient on the left disappears? That's what I want to happen.

[Remix]

The problem is that you are not actually redrawing the entire screen when you drag or scroll, so even if you had the viewport x position the overlay would not naturally update.

I'd suggest using DynamicDisplayables (which update themselves even if screen isn't redrawn)...

Code: Select all

init python:

    def edge_gradient(*args, **kwargs):

        vp = renpy.get_widget("scr_street_hmc", "hmc")

        show = Null(xysize=(89, 240))

        if vp and (
            (vp.xadjustment.value > 0 and kwargs.['side'] == "left")
            or
            (vp.xadjustment.value < 2560 and kwargs.['side'] == "right") ):

            show = "images/gradient {}.png".format(kwargs['side'])

        return show, 0

screen scr_street_hmc():
    modal True

    viewport:
        edgescroll (89,1000)
        id "hmc"

        window:
            xsize 2560
            ysize 720
            background "[bg]"

            frame:
                xcenter 0.25
                ycenter 0.9
                padding (15,10,15,10)

                style_prefix "textbuttons"

                textbutton "Go Inside":
                    style "textbuttons"
                    action Jump("mc_living")

    add DynamicDisplayable( edge_gradient, side='left' )

    add DynamicDisplayable( edge_gradient, side='right' ) xalign 1.0

Untested... should give an idea of how to get the x position and the dynamic displayable usage anyway...

[jwideman]

Mostly working. Only things I had to fix were it's kwargs['side'] not kwargs.['side'], and it uses the size of the screen (1280) not the size of of the background image (2560).
Thanks!