help with imagebutton

[Psion]

So i trying to make an imagebutton for location mover. Player click on door and go inside in hallway. Button working fine, but whole screen became button, not just door. Hovered picture done in photoshop. I just deleted all except door and saved as png. Can you pls help? What am i doing wrong?

Code: Select all

screen test():
    add "places/Porch_idle.png"
    imagebutton:
        idle "places/Porch_idle.png"
        hover "places/Porch_hover.png
        action SetVariable ("location", "hallway"), Return(None)

[Ocelot]

Well, yes. Whole displayable you use to create imagebutton becomes clickable. Because you didn't pass any information on what areas should be clickable. Eou want to cut all your images to size of your imagebutton and position it correctly to make it work like you want.

Strictly speaking you can make same areas of your idle image transparent and use focus_mask True but I advise against it.

[Psion]

But i seen games that didnt cut and position images. I know that it should work somehow.

I tried focus_mask True it didnt work correctly... picture blink when i move mouse.

[Ocelot]

picture blink when i move mouse.

Well, yes. If you didn't change your source image that how it should be. First you move cursor over idle image. As you explicitely told that this whole area is your button, if reacts. Now it is hovered, so image changes. As you explicitely told that everything non-transparent is a button, and your cursor is over transparent part of the image, it consider cursor to not be on button anymore. So it changes to idle image. Back to step 1.

You have several possibilities.
1) Crop your images to correct size and position your button where you want.
2) Do not cut original images. Do it inside RenPy using image manipulators ( i.e. Crop() )
3) Do not cut original images. Instead, make idle image transparent in the same places you hover image is transparent and use focus_mask True
4) Do not cut original images. Create a function which would detect if cursor is over desired area and use focus_mask with it.

[Psion]

Hm, ok. But how is this working then?

Code: Select all

screen home_livingroom:

    imagemap:
        if time_of_day in ('MORNING', 'AFTERNOON'):
            ground "scene_home_livingroom_day_g"
            hover "scene_home_livingroom_h"
            alpha False

scene_home_livingroom_day_g.webp could not attach here, so there is link:
https://mega.nz/file/QotHxQBJ#TbHkz8nMT ... yrc51PJ8Lo


Also. Why focus mask is bad? Look like it is easiest option. I used it, work great, tnx.

[Ocelot]

This is imagemap, not imagebutton. Works slightly differently, with its own set of quirks. There should be a bunch of hotspots after snippet you posted.

I had problems, if several buttons have images which overlaps, it could lead to problems with some buttons being "hidden" by others. focus_mask is made to allow for things like circular buttons, not as substitution for cropping your image.