Ren'Py How to make a menu using images (like buttons) and NVL horizontal?

xxx3me

Newbie
Jun 19, 2020
57
30
Finally I decided to work on my project again, but I have a problem with Ren'py that is "probably" easy to solve -- but I'm stucked for like 3 days. I'm building a (kind of) simple store, where the user clicks in items (a default menu), and it redirects you to a detailed description page. It happens in a NVL screen.

I know nvl has support for menus, but I can't figure out two things:

1. How to put the option on horizontal
2. Adjust a image hover.

Especially the first one is very appreciated if someone knows how to do.
Here is the sample code:

Python:
if newitem == "thong":
        nvl clear
        show blackscreen with dissolve
        nvlchar "THONG\n\n{image=shop/thong.png}\n\n
        This is a sexy thong blablabla{nw}"

        menu(nvl=True):
            "{image=button_buy}": #defined in images, its a png button
                scene shop
                jump bought
            "{image=button_back} ":
                scene shop
                jump enter_store
The menu should have two "buttons" (options) side by side. But this way, they show up in diferent line, one over another.

1628239521740.png
 

tutvuja7

New Member
Apr 7, 2018
14
140
Try calling a screen.

Add this code to to the end of your code for example (after return) and then call these buttons by typing "call screen your_menu". The options with # are for positioning, you can also add them right after "hbox:".

screen your_menu:
hbox:
imagebutton:
idle "your_image1.png"
hover "your_image2.png"
# ymaximum 100
# xmaximum 100
# xpos 100
# ypos 100
# xalign 0.5
# yalign 0.5
action ShowMenu('bought')
imagebutton:
idle "your_image3.png"
hover "your_image4.png"
action ShowMenu('enter_store')

Hope it helps, have a nice day.
 
  • Like
Reactions: xxx3me

xxx3me

Newbie
Jun 19, 2020
57
30
Try calling a screen.

Add this code to to the end of your code for example (after return) and then call these buttons by typing "call screen your_menu". The options with # are for positioning, you can also add them right after "hbox:".
It seems to work. That's a good direction, thanks!