How To Add a Scrollbar to the Main Dialogue

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
MattMurdock
Newbie
Posts: 17
Joined: Mon Sep 16, 2019 3:43 pm
Contact:

How To Add a Scrollbar to the Main Dialogue

#1 Post by MattMurdock »

Hey everyone, so the way I'm making my game is that the main dialogue is centered and sometimes, I just want to keep writing a part. As expected, this causes the text to too far down and is unable to be read. So, I modified the say screen part of the screens.rpy code to be like this:

Code: Select all

screen say(who, what):
    style_prefix "say"

    viewport:
        scrollbars "vertical"
        mousewheel True
        draggable True

        side_yfill True

    window:
        id "window"

        if who is not None:

            window:
                id "namebox"
                style "namebox"
                text who id "who"

        text what id "what"
While this does indeed add a scrollbar to the main dialogue screen, it also freezes that screen in place. So, I can't advance to the next screen if I wanted to. So, is there any way to do this? Am I on the right track at least?

User avatar
hell_oh_world
Miko-Class Veteran
Posts: 777
Joined: Fri Jul 12, 2019 5:21 am
Contact:

Re: How To Add a Scrollbar to the Main Dialogue

#2 Post by hell_oh_world »

MattMurdock wrote: Tue Sep 17, 2019 2:37 pm Hey everyone, so the way I'm making my game is that the main dialogue is centered and sometimes, I just want to keep writing a part. As expected, this causes the text to too far down and is unable to be read. So, I modified the say screen part of the screens.rpy code to be like this:

Code: Select all

screen say(who, what):
    style_prefix "say"

    viewport:
        scrollbars "vertical"
        mousewheel True
        draggable True

        side_yfill True

    window:
        id "window"

        if who is not None:

            window:
                id "namebox"
                style "namebox"
                text who id "who"

        text what id "what"
While this does indeed add a scrollbar to the main dialogue screen, it also freezes that screen in place. So, I can't advance to the next screen if I wanted to. So, is there any way to do this? Am I on the right track at least?
I see that you've used a viewport, but shouldn't be the dialogue which is inside the window container inside the viewport so that you could scroll it?
Like this:

Code: Select all

screen say(who, what):
    style_prefix "say"

    viewport:
    	area (xpos, ypos, xwidth, ywidth) ## You might also need to set up the area so that it will not fill all the screen accidentally rendering you unable to click other screens or what.
        scrollbars "vertical"
        mousewheel True
        draggable True

        side_yfill True

    	window:
        	id "window"

        	if who is not None:

            	window:
                	id "namebox"
                	style "namebox"
                	text who id "who"

        	text what id "what"

MattMurdock
Newbie
Posts: 17
Joined: Mon Sep 16, 2019 3:43 pm
Contact:

Re: How To Add a Scrollbar to the Main Dialogue

#3 Post by MattMurdock »

hell_oh_world wrote: Tue Sep 17, 2019 5:00 pm I see that you've used a viewport, but shouldn't be the dialogue which is inside the window container inside the viewport so that you could scroll it?
Like this:

Code: Select all

screen say(who, what):
    style_prefix "say"

    viewport:
    	area (xpos, ypos, xwidth, ywidth) ## You might also need to set up the area so that it will not fill all the screen accidentally rendering you unable to click other screens or what.
        scrollbars "vertical"
        mousewheel True
        draggable True

        side_yfill True

    	window:
        	id "window"

        	if who is not None:

            	window:
                	id "namebox"
                	style "namebox"
                	text who id "who"

        	text what id "what"
I just tried that and it didn't work. The scrollbar itself covered the entire scroll area (so, like how it would look on a page with no scroll).

MattMurdock
Newbie
Posts: 17
Joined: Mon Sep 16, 2019 3:43 pm
Contact:

Re: How To Add a Scrollbar to the Main Dialogue

#4 Post by MattMurdock »

I've done this:

Code: Select all

screen say(who, what):
    style_prefix "say"

    window:
        id "window"
        has viewport
        draggable True
        mousewheel True
        scrollbars "vertical"
        ymaximum style.say_window.yminimum xfill True yfill True
        has vbox:
            style "say_vbox"

        if who is not None:

            window:
                id "namebox"
                style "namebox"
                text who id "who"

        text what id "what"
This mostly works, the only problem is that some of the text at the bottom still gets cut off in some cases.

MattMurdock
Newbie
Posts: 17
Joined: Mon Sep 16, 2019 3:43 pm
Contact:

Re: How To Add a Scrollbar to the Main Dialogue

#5 Post by MattMurdock »

An update, for documentation if anybody has the same problem in the future:

Code: Select all

screen say(who, what):
    style_prefix "say"

    window:
        id "window"
        has viewport
        draggable True
        mousewheel True
        scrollbars "vertical"
        ymaximum style.say_window.yminimum xfill True yfill True

        if who is not None:

            window:
                id "namebox"
                style "namebox"
                text who id "who"

        text what id "what"
This removes two pesky lines whose removal also makes everything here a lot simpler. However, the problem that arises now, because a problem always arises, the dialogue has been shifted completely to the left side of the screen and the scrollbar to the right. Trying to move one moves the other, so I can't just insert xpos 100 or xpadding to decrease that gap.

MattMurdock
Newbie
Posts: 17
Joined: Mon Sep 16, 2019 3:43 pm
Contact:

Re: How To Add a Scrollbar to the Main Dialogue

#6 Post by MattMurdock »

Another update on my progress:

Code: Select all

screen say(who, what):
    style_prefix "say"

    window:
        id "window"
        has viewport
        viewport id "vp"
        draggable True
        mousewheel True
        scrollbars "vertical"
        ymaximum style.say_window.yminimum xfill True yfill True

        if who is not None:

            window:
                id "namebox"
                style "namebox"
                text who id "who"

        text what id "what"
Just adding in that one line giving the viewport an id centers the text, however, it also makes the scrollbar go to its maximum position for all cases instead of just the needed length. So, a screen can have one line of dialogue and the scrollbar can take you to the depths of Hades. Funny how every solution seems to cause a new problem and so, never really solves the original problem.

philat
Eileen-Class Veteran
Posts: 1912
Joined: Wed Dec 04, 2013 12:33 pm
Contact:

Re: How To Add a Scrollbar to the Main Dialogue

#7 Post by philat »

Honestly have no idea what you're trying to achieve or what you're seeing based on your posts. Have you changed the styles outside of the say screen? In gui.rpy? Where did you put the code to center the dialogue? etc. etc.

MattMurdock
Newbie
Posts: 17
Joined: Mon Sep 16, 2019 3:43 pm
Contact:

Re: How To Add a Scrollbar to the Main Dialogue

#8 Post by MattMurdock »

philat wrote: Wed Sep 18, 2019 9:32 pm Honestly have no idea what you're trying to achieve or what you're seeing based on your posts. Have you changed the styles outside of the say screen? In gui.rpy? Where did you put the code to center the dialogue? etc. etc.
I was trying to get a scrollbar to work with the dialogue textbox for an instance where the game is more novel than it is visual. So, to avoid multiple ongoing page flips, I intended to have a bunch of information on one page, accessed by scrolling. This was to be solved with this bit of code in the screens.rpy code:

Code: Select all

screen say(who, what):
    style_prefix "say"

    window:
        id "window"
        has viewport
        draggable True
        mousewheel True
        scrollbars "vertical"
        ymaximum style.say_window.yminimum xfill True yfill True
        has vbox:
            style "say_vbox"

        if who is not None:

            window:
                id "namebox"
                style "namebox"
                text who id "who"

        text what id "what"
The issue with which I ran into is, the scrollbar works, however it cuts off the last line of text. To try and correct this problem, I cut out this bit of code from above:

Code: Select all

        has vbox:
            style "say_vbox"
While this did correct the problem, scrolling down now showed all of the last line, it also pushed the text to the very left of the page. Using positional code did move the text to the center but it also moved the scrollbar and pushed it off the screen. So, I added in this line of code below 'has viewport':

Code: Select all

        viewport id "vp"
This re-centered the text without moving the scrollbar off the screen. However, this itself created a new issue. So, on a page with one line of dialogue, you'd expect to be unable to scroll. On a page with a little bit more dialogue than fits the screen, you'd expect to be able to scroll a little. However, what this line does is whatever the maximum scrolling range is for ren'py is given no matter how much text there is. So I could have one line and still be able to scroll to the bottom.

While I would appreciate an actual solution, I have moved past the issue. I've gone back to the original code and have just started adding four new lines to the end of the text, so the last line with actual characters in it is unaffected.

philat
Eileen-Class Veteran
Posts: 1912
Joined: Wed Dec 04, 2013 12:33 pm
Contact:

Re: How To Add a Scrollbar to the Main Dialogue

#9 Post by philat »

The point is that it's impossible to help without knowing more -- there's no reason that the viewport should cut off randomly, so something is making it do that, but you're not showing a screenshot, or your styles, or your character definitions (if that's where the centered stuff is coming from). The screen is only part of the equation. say_window, say_vbox, namebox, etc., are all styles. Using id to give window/viewport an id will also affect how default values hook into the screen.

The issue itself is likely trivial, to be honest.

Post Reply

Who is online

Users browsing this forum: Google [Bot], henne