How to change imagebutton image when button is pressed?

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
felipe
Regular
Posts: 39
Joined: Wed Aug 07, 2013 5:54 pm
Location: Brazil.
Contact:

How to change imagebutton image when button is pressed?

#1 Post by felipe » Wed Aug 21, 2013 5:39 pm

Hello. I'm having trouble finding the right way to make a button change its image when selected/pressed.

I'm trying to do it like this:

Declaring images:

Code: Select all

image thing = "thing.png"
image thing hover = "thing_hover.png"
image thing selected = "thing_selected.png"
The buttons:

Code: Select all

screen choice:
    modal True
    imagebutton:
        xalign 0.25 yalign 0.43
        idle "thing"
        hover "thing hover"
        selected_hover "thing selected"
        selected_idle "thing selected"
        action [Hide("choice"), Return("something")]
Is there maybe a way to put it inside the action brackets?

Levrex
Veteran
Posts: 280
Joined: Mon Jun 18, 2012 12:16 pm
Contact:

Re: How to change imagebutton image when button is pressed?

#2 Post by Levrex » Thu Aug 22, 2013 1:30 pm

The ceiling of my room says you can do something using SetScreenVariable and SelectedIf.

action [Hide("choice"), Return("something")] >> action [SetScreenVariable("button_on", True), SelectedIf(button_on), Return("something"), Hide("choice")]
(By the way, you need to declare the screen variable button_on as False beforehand.)

Of course, because it is a ceiling, i can't say its advice will work for sure — especially with Hide action — but you may as well give it a try.
If your question is solved, please add [Solved] to theme's name by editing its first post, so that the helpful guys out there wouldn't mistakenly think the problem is still unanswered and waste their time.

User avatar
felipe
Regular
Posts: 39
Joined: Wed Aug 07, 2013 5:54 pm
Location: Brazil.
Contact:

Re: How to change imagebutton image when button is pressed?

#3 Post by felipe » Fri Aug 23, 2013 4:43 pm

Please, thank your ceiling for the suggestion. :) Unfortunately it didn't work. :( Maybe I was under the wrong impression that there was a built-in way of changing the image, just like "idle" and "hover", but "selected" won't work.

To provide a better understanding of my problem, my screen is something like this:

A room with 4 objects, when clicking on one specific object, this objects changes image and the game moves forward (this I was able to do with simple show statements), but when clicking on any the other 3 objects, its image changes for a bit (or permanently, I'm not picky) but the screen remains there. This is the part I don't know how to do.

So I'm trying to do this with imagebuttons for the objects.
This is my signature.

Levrex
Veteran
Posts: 280
Joined: Mon Jun 18, 2012 12:16 pm
Contact:

Re: How to change imagebutton image when button is pressed?

#4 Post by Levrex » Sat Aug 24, 2013 6:36 am

Maybe the ceiling was wrong.

Well, the following does work for me.
(Due to the fact that ground and idle are using the same picture, the buttons are invisible until hovered; on selected they will stay visible, with changed pictures).

Code: Select all

screen testscrn:
    tag menu
    
    imagemap:
        ground "PIC_0412.jpg"
        idle "PIC_0412.jpg"
        hover "test_pic.jpg"
        selected_idle "test_pic2.jpg"
        selected_hover "test_pic2.jpg"

        hotspot (50, 43, 161, 128) action [SetVariable("test5", True), SelectedIf(test5)]
        hotspot (392, 146, 140, 107) action [SetVariable("test6", True), SelectedIf(test6)]
        hotspot (69, 273, 165, 141) action [SetVariable("test7", True), SelectedIf(test7)]
        hotspot (366, 289, 115, 106) action [SetVariable("test8", True), Hide("testscrn", dissolve), Start(), SelectedIf(test8)] # The transition allows you to see the "selected" image.
It is also possible to make the buttons stay just for a bit, however the buttons started behaving VERY strangely when i tried to do that, so...
(Well, use SetScreenVariable, define the variables in screen like Ceiling-san suggested, then Hide the screen with dissolve and ShowMenu it again. If you don't see any problems with the result, then be it.)
If your question is solved, please add [Solved] to theme's name by editing its first post, so that the helpful guys out there wouldn't mistakenly think the problem is still unanswered and waste their time.

Post Reply

Who is online

Users browsing this forum: chesarty