[Solved] Navigatable Quick Menu?

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
quinnsea
Regular
Posts: 44
Joined: Wed Apr 26, 2017 5:04 pm
Completed: Birch Sapling
Projects: Aspen
itch: quinnsea
Location: Missouri
Contact:

[Solved] Navigatable Quick Menu?

#1 Post by quinnsea » Thu Nov 16, 2017 2:08 am

I'm not sure if that's really the right title I should be giving this post, but here goes! I had an idea for a quick menu I want to experiment with where you can sort of scroll through to see your other options? Let me see if I can explain better with pictures...

The menu would first show up like this in the corner:

Image

And when a player clicks on the arrow it would sort of scroll to the next option like this?

Image

Of course, you could click the options to go to their respective screens. I just figured this would be a neat little way to get to everything you need without it being overly intrusive on the visuals.

I feel like it'd be better to just give the arrow an imagemap, but I'm not entirely sure what to do after that... :oops: Thanks for the help!
Last edited by quinnsea on Fri Nov 24, 2017 5:59 am, edited 1 time in total.
Image

quinn / 20 / graphic design student
gui commissions / game dev blog / voice acting info

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

Re: Navigatable Quick Menu?

#2 Post by philat » Thu Nov 16, 2017 3:08 am

At a high level, use the arrow to cycle through a variable, then check the variable to display the correct menu. You can use if/else statements in screens just like in ren'py script.

User avatar
quinnsea
Regular
Posts: 44
Joined: Wed Apr 26, 2017 5:04 pm
Completed: Birch Sapling
Projects: Aspen
itch: quinnsea
Location: Missouri
Contact:

Re: Navigatable Quick Menu?

#3 Post by quinnsea » Sun Nov 19, 2017 6:21 pm

I think I have an idea of how to cycle them through different variables, but I'm not sure how to set the if/else statements as individual variables?

I keep trying to do this like:

Code: Select all

$ qmenu_back = imagebutton auto "gui/qmenu/qmenu1_%.png" action Rollback()
$ qmenu_options = imagebutton auto "gui/qmenu/qmenu2_%.png" action ShowMenu('preferences')
$ qmenu_auto = imagebutton auto "gui/qmenu/qmenu3_%.png" action Preference("auto-forward", "toggle")
screen quick_menu():
    if show_quickmenu:
        
        imagemap:
            
            ground 'gui/qmenu/qmenu_back.png'
            $ qmenumess = 1
            
           hotspot (160, 0, 85, 90):
                action [If(qmenumess,1=imagebutton auto "gui/qmenu/qmenu1_%.png" action Rollback(), SetVariable(qmenumess, 2)],
                2=imagebutton auto "gui/qmenu/qmenu2_%.png" action ShowMenu('preferences'), SetVariable(qmenumess, 3),
                3=imagebutton auto "gui/qmenu/qmenu3_%.png" action Preference("auto-forward", "toggle"), SetVariable(qmenumess, 1)]
Obviously, there are more buttons in the menu but I figured it'd be easiest to get my point across with 3.

I also tried:

Code: Select all


define quick_menu_backbutton = imagebutton auto "gui/qmenu/qmenu1_%.png" action Rollback()
            
            ground 'gui/qmenu/qmenu_back.png'
            $ qmenumess = 1
            
            hotspot (160, 0, 85, 90):
                action [If(qmenumess,1="quick_menu_backbutton"), SetVariable(qmenumess, 2)]
To no effect.
Image

quinn / 20 / graphic design student
gui commissions / game dev blog / voice acting info

User avatar
quinnsea
Regular
Posts: 44
Joined: Wed Apr 26, 2017 5:04 pm
Completed: Birch Sapling
Projects: Aspen
itch: quinnsea
Location: Missouri
Contact:

Re: Navigatable Quick Menu?

#4 Post by quinnsea » Mon Nov 20, 2017 4:32 pm

Update: I think I might be getting closer but I'm getting the error "style property ground is not known"? Is it not possible to define a style as an imagemap? How should I do it instead?

Code: Select all

screen quick_menu():
    zorder 100

    if show_quickmenu:
        
        window:
            style "qmenu_window"
            
            vbox:
                style "qmenu"
                $ qmenu_int = 0
                
                if action:
                    
                    if qmenu_int == 0:
                        
                        $ qmenu_int += 1
                        imagebutton auto "gui/qmenu/qmenu1_%.png" action Rollback()
                    
                    elif qmenu_int == 1:
                        
                        $ qmenu_int += 1
                        imagebutton auto "gui/qmenu/qmenu2_%.png" action ShowMenu('preferences')
                        
                    elif qmenu_int == 2:
                        
                        $ qmenu_int += 1
                        imagebutton auto "gui/qmenu/qmenu3_%.png" action Preference("auto-forward", "toggle")
                    
                    else:
                        
                        $ qmenu_int += 1
                        imagebutton auto "gui/qmenu/qmenu1_%.png" action Rollback()

init -2:
    style qmenu_window is imagemap:
        
        ground 'gui/qmenu/qmenu_back.png'
        hover 'gui/qmenu/qmenu_hover.png'
        
        hotspot (160, 0, 85, 90)
        
    style qmenu is default
Image

quinn / 20 / graphic design student
gui commissions / game dev blog / voice acting info

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

Re: Navigatable Quick Menu?

#5 Post by philat » Thu Nov 23, 2017 4:09 am

Why would you need to have it be a style anyway?

Code: Select all

screen quick_menu():
    default qmenu_int = 1
    if show_quickmenu:
        
        imagemap:
            ground 'gui/qmenu/qmenu_back.png'
            hover # fill in -- I assume the imagemap for the arrow doesn't need to change
            idle # fill in
            hotspot (160, 0, 85, 90) action SetScreenVariable("qmenu_int", qmenu_int+1)

        if qmenu_int % 3 == 0: # assuming you have three buttons
            imagebutton auto "gui/qmenu/qmenu1_%.png" action Rollback()
        elif qmenu_int % 3 == 1:
            imagebutton auto "gui/qmenu/qmenu2_%.png" action ShowMenu('preferences')
        else:
            imagebutton auto "gui/qmenu/qmenu3_%.png" action Preference("auto-forward", "toggle")

User avatar
quinnsea
Regular
Posts: 44
Joined: Wed Apr 26, 2017 5:04 pm
Completed: Birch Sapling
Projects: Aspen
itch: quinnsea
Location: Missouri
Contact:

Re: Navigatable Quick Menu?

#6 Post by quinnsea » Fri Nov 24, 2017 5:16 am

Ack, I was trying to base it off of other solutions for other problems I had that worked. ._.;;

I get what you mean, and I carried it out with all the buttons I have:

Code: Select all

screen quick_menu():
    
    zorder 100
    default qmenu_int = 1

    if show_quickmenu:
        
        imagemap:
                
            ground 'gui/qmenu/qmenu_back.png'
            hover 'gui/qmenu/qmenu_hover.png'
            idle 'gui/qmenu/qmenu_idle.png' 
            
            hotspot (160, 0, 85, 90) action SetScreenVariable("qmenu_int", qmenu_int+1)
            
            if qmenu_int % 10 == 0:
                
                imagebutton auto "gui/qmenu/qmenu1_%.png" action Rollback()
            
            elif qmenu_int % 10 == 1:
            
                imagebutton auto "gui/qmenu/qmenu2_%.png" action ShowMenu('preferences')
            
            elif qmenu_int % 10 == 2:
                
                imagebutton auto "gui/qmenu/qmenu3_%.png" action Preference("auto-forward", "toggle")
                
            elif qmenu_int % 10 == 3:
                
                imagebutton auto "gui/qmenu/qmenu4_%.png" action MainMenu()
            
            elif qmenu_int % 10 == 4:
                
                imagebutton auto "gui/qmenu/qmenu5_%.png" action QuickLoad()
            
            elif qmenu_int % 10 == 5:
                
                imagebutton auto "gui/qmenu/qmenu6_%.png" action QuickSave()
            
            elif qmenu_int % 10 == 6:
                
                imagebutton auto "gui/qmenu/qmenu7_%.png" action ShowMenu('history')
            
            elif qmenu_int % 10 == 7:
                
                imagebutton auto "gui/qmenu/qmenu8_%.png" action Skip()
            
            elif qmenu_int % 10 == 8:
                
                imagebutton auto "gui/qmenu/qmenu9_%.png" action ShowMenu('load')
            
            else:
            
                imagebutton auto "gui/qmenu/qmenu10_%.png" action ShowMenu('save')
Buuut I got this error message:

Code: Select all

I'm sorry, but an uncaught exception occurred.

While running game code:
  File "game/script.rpy", line 307, in script
    z "Ride was surprisingly painless, aside from a couple of people trying to take our pictures."
  File "game/screens.rpy", line 263, in execute
    screen quick_menu():
  File "game/screens.rpy", line 263, in execute
    screen quick_menu():
  File "game/screens.rpy", line 268, in execute
    
  File "game/screens.rpy", line 270, in execute
    
  File "game/screens.rpy", line 278, in execute
    
  File "game/screens.rpy", line 284, in execute
    
  File "renpy/common/00defaults.rpy", line 115, in _imagemap_auto_function
    rv = auto_param % variant
ValueError: unsupported format character 'p' (0x70) at index 19

-- Full Traceback ------------------------------------------------------------

Full traceback:
  File "G:\renpy-6.99.12.4-sdk\renpy\bootstrap.py", line 295, in bootstrap
    renpy.main.main()
  File "G:\renpy-6.99.12.4-sdk\renpy\main.py", line 487, in main
    run(restart)
  File "G:\renpy-6.99.12.4-sdk\renpy\main.py", line 147, in run
    renpy.execution.run_context(True)
  File "G:\renpy-6.99.12.4-sdk\renpy\execution.py", line 761, in run_context
    context.run()
  File "game/script.rpy", line 307, in script
    z "Ride was surprisingly painless, aside from a couple of people trying to take our pictures."
  File "G:\renpy-6.99.12.4-sdk\renpy\ast.py", line 613, in execute
    renpy.exports.say(who, what, interact=self.interact)
  File "G:\renpy-6.99.12.4-sdk\renpy\exports.py", line 1147, in say
    who(what, interact=interact)
  File "G:\renpy-6.99.12.4-sdk\renpy\character.py", line 877, in __call__
    self.do_display(who, what, cb_args=self.cb_args, **display_args)
  File "G:\renpy-6.99.12.4-sdk\renpy\character.py", line 716, in do_display
    **display_args)
  File "G:\renpy-6.99.12.4-sdk\renpy\character.py", line 508, in display_say
    rv = renpy.ui.interact(mouse='say', type=type, roll_forward=roll_forward)
  File "G:\renpy-6.99.12.4-sdk\renpy\ui.py", line 285, in interact
    rv = renpy.game.interface.interact(roll_forward=roll_forward, **kwargs)
  File "G:\renpy-6.99.12.4-sdk\renpy\display\core.py", line 2526, in interact
    repeat, rv = self.interact_core(preloads=preloads, trans_pause=trans_pause, **kwargs)
  File "G:\renpy-6.99.12.4-sdk\renpy\display\core.py", line 2793, in interact_core
    root_widget.visit_all(lambda i : i.per_interact())
  File "G:\renpy-6.99.12.4-sdk\renpy\display\core.py", line 495, in visit_all
    d.visit_all(callback)
  File "G:\renpy-6.99.12.4-sdk\renpy\display\core.py", line 495, in visit_all
    d.visit_all(callback)
  File "G:\renpy-6.99.12.4-sdk\renpy\display\core.py", line 495, in visit_all
    d.visit_all(callback)
  File "G:\renpy-6.99.12.4-sdk\renpy\display\screen.py", line 399, in visit_all
    callback(self)
  File "G:\renpy-6.99.12.4-sdk\renpy\display\core.py", line 2793, in <lambda>
    root_widget.visit_all(lambda i : i.per_interact())
  File "G:\renpy-6.99.12.4-sdk\renpy\display\screen.py", line 409, in per_interact
    self.update()
  File "G:\renpy-6.99.12.4-sdk\renpy\display\screen.py", line 578, in update
    self.screen.function(**self.scope)
  File "game/screens.rpy", line 263, in execute
    screen quick_menu():
  File "game/screens.rpy", line 263, in execute
    screen quick_menu():
  File "game/screens.rpy", line 268, in execute
    
  File "game/screens.rpy", line 270, in execute
    
  File "game/screens.rpy", line 278, in execute
    
  File "game/screens.rpy", line 284, in execute
    
  File "G:\renpy-6.99.12.4-sdk\renpy\ui.py", line 912, in _imagebutton
    idle = choice(idle, idle_image, "idle", required=True)
  File "G:\renpy-6.99.12.4-sdk\renpy\ui.py", line 905, in choice
    return renpy.config.imagemap_auto_function(auto, name)
  File "renpy/common/00defaults.rpy", line 115, in _imagemap_auto_function
    rv = auto_param % variant
ValueError: unsupported format character 'p' (0x70) at index 19

Windows-8-6.2.9200
Ren'Py 6.99.12.4.2187
aspen gui testing 1.0
Image

quinn / 20 / graphic design student
gui commissions / game dev blog / voice acting info

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

Re: Navigatable Quick Menu?

#7 Post by philat » Fri Nov 24, 2017 5:26 am

The buttons should be indented out -- they're not part of the imagemap.

User avatar
quinnsea
Regular
Posts: 44
Joined: Wed Apr 26, 2017 5:04 pm
Completed: Birch Sapling
Projects: Aspen
itch: quinnsea
Location: Missouri
Contact:

Re: Navigatable Quick Menu?

#8 Post by quinnsea » Fri Nov 24, 2017 5:58 am

Got it. There's some issues with detecting the hit box for the buttons, but that's probably just a matter of cleaning up the image. Thanks so much for your help!
Image

quinn / 20 / graphic design student
gui commissions / game dev blog / voice acting info

Post Reply

Who is online

Users browsing this forum: [Admin-C], Baidu [Spider], Ropponmatsu, sculpteur