Ren'Py is there anyway to make a imagebutton to do this

79flavors

Well-Known Member
Respected User
Jun 14, 2018
1,581
2,219
Yeah...

You want to look at the hovered property of the .

Anything defined there is treated as an action when the mouse moves to a hover position. The list of actions could be anything... including changing either the whole background image or a part of the image if it is a composite.

An , uses something called , but it's not something I personally have ever tried.

I think I'd personally try using a variable and a conditional image. I've not tried it, so maybe just updating the variable wouldn't be enough.

Python:
image elevator = ConditionSwitch(
    "door_open == True", "elevator_door_open.png",
    True, "elevator_door_closed.png"
    )

Edit:
Although I just also noticed ... that sounds like a winner... IF it works how I hope it would (set the screen variable, then check that variable within the screen to show either the open or closed door as part of the screen definition).

Some testing would be required... testing I really cba doing right now. Good luck. :devilish:
 
Last edited:
  • Like
Reactions: rayminator

rayminator

Engaged Member
Respected User
Sep 26, 2018
3,041
3,140
this helped thanks for the help
 

anne O'nymous

I'm not grumpy, I'm just coded that way.
Modder
Donor
Respected User
Jun 10, 2017
10,355
15,269
An , uses something called , but it's not something I personally have ever tried.
[...]
Edit:
Although I just also noticed ... that sounds like a winner...

The problem with ShowTransient is the order of display. The screen would probably be shown at the end of the screen, which prevent the cool effects that can be achieved by using some mask. Even if he use a transition when the screen is shown and one when the screen is hidden, the whole thing would still be displayed on top of all image.

But with SetScreenVariable, it's possible to have something interesting.
[Note: It's almost 3AM here and I wrote it on the fly, so be careful, there's perhaps some adjustment to do]
Python:
screen whatever:
    #  Should the effect be "open the door" (True), "close the door" (False)
    # Can not be "do nothing" (None) because of the way /hovered/ works.
    $ openGate = False
    # horizontal position where the door should be displayed.
    $ xGate = 200

    # It's the opening animation
    if openGate is True:
        #  Every 0.5 second move the door 10 pixels to the left, until the gate is fully opened
        timer 0.5 repeat True action If( xGate > 50, SetScreenVariable( "xGate", xGate - 10 ), NullAction() )
    # It's the closing animation
    elif openGate is False:
        #  Every 0.5 second move the door 10 pixels to the right, until the gate is fully closed.
        timer 0.5 repeat True action If( xGate < 200, SetScreenVariable( "xGate", xGate + 10 ), NullAction() )

    # Background showing the interior of the elevator.
    add "images/background image.png"

    # The gate, and only the gate, displayed where it make it look closed.
    add "images/fx/image of the gate.png" pos( xGate, 100 )

    # The image with a full transparency where the door is.
    add "images/foreground image.png"

    imagebutton:
        auto "images/button.png"
        action NullAction()
        #  When hovered, /openGate/ will be set at True, what will branch to the "opening" animation timer.
        # Then the value will return to False once the button isn't anymore hovered, what will branch to the 
        # "closing" animation timer.
        hovered SetScreenVariable( "openGate", True )
Because the interior of the elevator is displayed before the door, this one will hide it by default. But once the door start to move, the interior of the elevator will progressively start to appear.
And because the door is displayed before the foreground, everything that isn't on the transparency area will just be hidden.

The values obviously have to be changed, 0.5 is probably too slow for a smooth movement, and I totally guessed the size of the door. But the principle is here, a sweet animation revealing something when a button is hovered.
 

rayminator

Engaged Member
Respected User
Sep 26, 2018
3,041
3,140
this is how I have it setup now I will try yours as well thanks

View attachment New Project.webm
















Code:
screen the_img(img):
    add img pos (0, 0)
screen mchouse:
    modal True
    imagemap:

        ground "gui/maps/elevator.png"
        hover "gui/maps/elevator2.png"

        hotspot (446,202,230,50) clicked [Hide("mchouse"), Show("main_floor")]  hovered ShowTransient("the_img", img="gui/maps/elevator1c.png") unhovered Hide("the_img")
        hotspot (449,259,225,49) clicked [Hide("mchouse"), Show("first_floor")]  hovered ShowTransient("the_img", img="gui/maps/elevator2c.png") unhovered Hide("the_img")
        hotspot (445,326,283,50) clicked [Hide("mchouse"), Show("second_floor")] hovered ShowTransient("the_img", img="gui/maps/elevator3c.png") unhovered Hide("the_img")
        hotspot (452,396,232,52) clicked [Hide("mchouse"), Jump("basement")] hovered ShowTransient("the_img", img="gui/maps/elevator5c.png") unhovered Hide("the_img")
        hotspot (445,465,187,45) clicked [Hide("mchouse"), Show("outside")] hovered ShowTransient("the_img", img="gui/maps/elevator4c.png") unhovered Hide("the_img")
        hotspot (458,529,136,52) action [Hide("mchouse"), Show("mapbuttons")]