Viewports: edgescroll and ui.adjustment() workaround?

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
jwideman
Newbie
Posts: 6
Joined: Tue Jul 30, 2019 7:17 pm
Contact:

Viewports: edgescroll and ui.adjustment() workaround?

#1 Post by jwideman » Thu Aug 29, 2019 3:54 pm

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

User avatar
hell_oh_world
Regular
Posts: 175
Joined: Fri Jul 12, 2019 5:21 am
Projects: Pathfinding
Organization: NILA
Contact:

Re: Viewports: edgescroll and ui.adjustment() workaround?

#2 Post by hell_oh_world » Thu Aug 29, 2019 6:33 pm

jwideman wrote:
Thu Aug 29, 2019 3:54 pm
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
Newbie
Posts: 6
Joined: Tue Jul 30, 2019 7:17 pm
Contact:

Re: Viewports: edgescroll and ui.adjustment() workaround?

#3 Post by jwideman » Thu Aug 29, 2019 7:53 pm

I thought it should be obvious from the code. Okay, a visual aid then:
Image
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.
Image
Notice how the gradient on the left disappears? That's what I want to happen.

User avatar
Remix
Eileen-Class Veteran
Posts: 1316
Joined: Tue May 30, 2017 6:10 am
Completed: None... yet (as I'm still looking for an artist)
Projects: An un-named anime based trainer game
Contact:

Re: Viewports: edgescroll and ui.adjustment() workaround?

#4 Post by Remix » Fri Aug 30, 2019 7:45 am

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...
Mad Scientist Todo List:
  • Finish Improved Event Handler
  • Implement DragonBones animation as a Creator Defined Container
  • Develop Cartoon Speech Bubble dialogue
  • Finish Bitmask collision and rebound vector system
  • Develop time based building mechanic
  • Others
  • *Find a superb artist and actually write a game*

jwideman
Newbie
Posts: 6
Joined: Tue Jul 30, 2019 7:17 pm
Contact:

Re: Viewports: edgescroll and ui.adjustment() workaround?

#5 Post by jwideman » Fri Aug 30, 2019 11:08 am

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!

Post Reply

Who is online

Users browsing this forum: Bing [Bot]