Having a Textbutton show upon hovering over an Imagebutton

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
KataMata
Newbie
Posts: 9
Joined: Thu Jan 28, 2021 3:55 pm
Contact:

Having a Textbutton show upon hovering over an Imagebutton

#1 Post by KataMata »

When the player hovers over an image button on the map, I want the image button to show a different text button on the same screen right above it. I don't know how to do this however, as I've only started using Renpy recently. The hide/show action only seems to work on screens, and not individual buttons.
I don't want to make separate images with the text for every single button, as that would overload the amount of images in the game, and make it So that the buttons are hard to edit. Would making a different screen with the text buttons that checks using variables what image button is currently hovered over and displays the corresponding text button work? Or would a different method work better?

Thank you for any help.

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

Re: Having a Textbutton show upon hovering over an Imagebutton

#2 Post by Imperf3kt »

You could make it appear on hover action, but as soon as the player moved their mouse off the imagebutton to click the textbutton, the imagebutton would no longer be hovered and the textbutton would no longer show.

Can you explain the expected behaviour a bit further?
Warning: May contain trace amounts of gratuitous plot.
pro·gram·mer (noun) An organism capable of converting caffeine into code.

Current project: GGD Mentor

Twitter

KataMata
Newbie
Posts: 9
Joined: Thu Jan 28, 2021 3:55 pm
Contact:

Re: Having a Textbutton show upon hovering over an Imagebutton

#3 Post by KataMata »

I want it to show the name of what you're interacting with when you hover over the image button, and when you click the image button, have the text button disappear with the rest of the screen when it jumps to the dialogue for that interaction. The Text is just there to tell you what you're going to click on, it's not meant to be interactable. I tried to use the on hover action to show it, but I didn't know how to tell it what the right text button was (I did Action Show(textbutton "Store")) would I give the text button an id of some kind and tell the image button to show that? Is there another way to show text on a screen without using a text button?

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

Re: Having a Textbutton show upon hovering over an Imagebutton

#4 Post by Imperf3kt »

In that case you might want a tooltip instead.
Warning: May contain trace amounts of gratuitous plot.
pro·gram·mer (noun) An organism capable of converting caffeine into code.

Current project: GGD Mentor

Twitter

KataMata
Newbie
Posts: 9
Joined: Thu Jan 28, 2021 3:55 pm
Contact:

Re: Having a Textbutton show upon hovering over an Imagebutton

#5 Post by KataMata »

Oh a tooltip definitely works much better, didn't know about them. I having trouble finding anything about setting their location. They show up in the left corner of the screen, partially covered up by the UI. I'd prefer it if they would show up over the imagebutton, is there a way to do that?

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

Re: Having a Textbutton show upon hovering over an Imagebutton

#6 Post by Imperf3kt »

There's a few ways to position them, the simplest being a fixed position within their own screen, but there are other more complex ways such as following the mouse, for example.
viewtopic.php?t=47205#p472810
Warning: May contain trace amounts of gratuitous plot.
pro·gram·mer (noun) An organism capable of converting caffeine into code.

Current project: GGD Mentor

Twitter

KataMata
Newbie
Posts: 9
Joined: Thu Jan 28, 2021 3:55 pm
Contact:

Re: Having a Textbutton show upon hovering over an Imagebutton

#7 Post by KataMata »

I tried to make it follow the mouse but all I got were errors, tried it out in a different project and still got errors (one where it was on a line that wasn't even in the script???). Is there anywhere where I can find information on using Tooltips with a fixed position within their own screen? Do I use transformations or is there a way to give them something like X and Y values to tooltips?

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

Re: Having a Textbutton show upon hovering over an Imagebutton

#8 Post by Imperf3kt »

The mouse following tooltip needed a couple of updates at some point, the details are further into the thread (although I haven't updated and it still works perfectly for me)

If you'd prefer to place it in a predefined spot, all you need is to add $tooltip = GetToolTip() and if tooltip: text "[tooltip]" to a screen and show it.
You can see an example here:
https://renpy.org/doc/html/screen_actions.html#tooltips

Code: Select all

screen tooltip_example():
    vbox:
        textbutton "North":
            action Return("n")
            tooltip "To meet a polar bear."

        textbutton "South":
            action Return("s")
            tooltip "All the way to the tropics."

        textbutton "East":
            action Return("e")
            tooltip "So we can embrace the dawn."

        textbutton "West":
            action Return("w")
            tooltip "Where to go to see the best sunsets."

        $ tooltip = GetTooltip()

        if tooltip:
            text "[tooltip]"
You can position the exact position by adjusting the container position using positional properties, so yes, you could use xpos / ypos if you wanted. In the example above, that'd be the vbox
Warning: May contain trace amounts of gratuitous plot.
pro·gram·mer (noun) An organism capable of converting caffeine into code.

Current project: GGD Mentor

Twitter

KataMata
Newbie
Posts: 9
Joined: Thu Jan 28, 2021 3:55 pm
Contact:

Re: Having a Textbutton show upon hovering over an Imagebutton

#9 Post by KataMata »

Got it to work by having the tooltip's x + y position be set by the Hovered action of the corresponding image button. Thank you for all the help.

Post Reply

Who is online

Users browsing this forum: Bing [Bot], OffDeez399