Scrolling text box?

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
User avatar
SuperbowserX
Veteran
Posts: 264
Joined: Sat Jan 07, 2017 3:09 pm
Contact:

Scrolling text box?

#1 Post by SuperbowserX » Sun Jun 25, 2017 3:04 pm

I want to improve my game's UI and menu, and currently my "How to Play" and "Info" sections are just told through the VN system (where you click to advance text). Is there anyway to make an on-screen, vertical text box that the user can scroll down to view (and click a button to go back)?

It's like an iOS game where you can drag the screen up to scroll text down, and vice-versa, and you click a back button in the lower-left hand corner to go back. It's somewhat similar to the history screen.

Any functions/frameworks with which to do this?

User avatar
Imperf3kt
Lemma-Class Veteran
Posts: 2714
Joined: Mon Dec 14, 2015 5:05 am
Location: Your monitor
Contact:

Re: Scrolling text box?

#2 Post by Imperf3kt » Sun Jun 25, 2017 3:37 pm

Viewport does exactly this. You can use vpgrid instead if you want an organised grid that is scrollable.
Warning: May contain trace amounts of gratuitous plot.
pro·gram·mer (noun) An organism capable of converting caffeine into code.

Todo list:
Actually finish a project

User avatar
SuperbowserX
Veteran
Posts: 264
Joined: Sat Jan 07, 2017 3:09 pm
Contact:

Re: Scrolling text box?

#3 Post by SuperbowserX » Sun Jun 25, 2017 5:23 pm

Tutorial doesn't have any good examples. Any good code snippets showing how you can make that kind of screen?

User avatar
Imperf3kt
Lemma-Class Veteran
Posts: 2714
Joined: Mon Dec 14, 2015 5:05 am
Location: Your monitor
Contact:

Re: Scrolling text box?

#4 Post by Imperf3kt » Sun Jun 25, 2017 6:11 pm

I used the documentation when using a viewport for my Achievements screen.
https://www.renpy.org/doc/html/screens.html#viewport

Here's an example I have on hand (I removed almost all the content though) showing a screen with a viewport grid.

Code: Select all

init offset = -1

## Achievements screen ###############################################################
##

screen achievements():
    
    tag menu
    style_prefix "achievement_menu"
    add gui.screens_menu_background
    
    vbox:
        add gui.menu_achievement_text
        xalign 0.5
        ypos 25
        
    vpgrid:
        xmaximum 680
        xfill True
        ysize config.screen_height - 140
        xpos gui.screens_xpos
        ypos gui.screens_ypos
        cols 2
        spacing 20
        draggable True


#########################################
##Why are we here?
        if persistent.achievements_001:
            add "gui/achievements/001.png"
        else:
            add "gui/achievements/locked.png"
        if persistent.achievements_001:
            text _("Viewed the opening skit") yalign 0.5
        else:
            text _("Locked") yalign 0.5

    use navigation

style achievement_menu_vbox:
    xmaximum 680
    
style achievement_menu_text:
    size gui.credit_menu_text_size
    color gui.credit_menu_text_color
I don't know if the init offset is necessary, I only include it because I keep this screen in its own .rpy
Warning: May contain trace amounts of gratuitous plot.
pro·gram·mer (noun) An organism capable of converting caffeine into code.

Todo list:
Actually finish a project

Post Reply

Who is online

Users browsing this forum: No registered users