Non-square imagemaps buttons

[Parkey]

Hi!!

Well, as he topic says I want to know if it's possible to make a non-square button for an imagemap. For example, 6 sides for a button with an L shape.

Thanks!!

[Kinsman]

You can use the style property "focus_mask".

http://www.renpy.org/doc/html/style.htm ... focus_mask

[Suwamoto]

Or you can just simply add the button with a transparent background and add

alpha True

to the imagemap o.o That makes the mouse recognice the transparency and ignore everything on the button that is transparent oo

[Parkey]

Thanks to both.

But the problem is that if I've 2 objects side by side and I use focus mask or alpha for a button, that part of the picture won't be clickable because is transparent, but what if do I need that part for another button? It won't be clickable...

I don't know if I've explained well... :S

There's a solution for that? I mean, to make polygonal buttons or something.

Thanks!

[apricotorange]

"alpha True" won't work in that situation, but focus_mask should still be fine.

[CheeryMoya]

An imagebutton screen might be better in this case, I think. Here's an example of the quickmenu using imagebuttons:

Code: Select all

screen quick_menu:

    # Add an in-game quick menu.
    hbox:
        style_group "quick"
    
        xalign 1.0
        yalign 1.0

        imagebutton idle "GUI/Save_idle.png" hover "GUI/Save_hover.png" xpos -4 ypos -188 focus_mask True action ShowMenu('save')
        imagebutton idle "GUI/Load_idle.png" hover "GUI/Load_hover.png" xpos -18 ypos -188 focus_mask True action ShowMenu('load')
        imagebutton idle "GUI/Skip_idle.png" hover "GUI/Skip_hover.png" selected_idle "GUI/Skip_selected_idle.png" selected_hover "GUI/Skip_selected_hover.png" xpos -32 ypos -188 focus_mask True action Skip()
        imagebutton idle "GUI/Prefs_idle.png" hover "GUI/Prefs_hover.png" xpos -46 ypos -188 focus_mask True action ShowMenu('preferences')
        imagebutton idle "GUI/Quit_idle.png" hover "GUI/Quit_hover.png" xpos -60 ypos -188 focus_mask True action Quit(True)

And it looks like this:


Of course, it depends on what you're trying to do. Can you show us a mock-up of what you want?

[Parkey]

I want to use non-square buttons for in-game, not for menu. I tried with an imagemap, but the problem is this: so that the button and the hover image work correctly, the coordinates of the 2 buttons (in my case) are overlapped and I don't know if they would work well with two imagebuttons with the focus mask.

I've attached an image to give you an idea of my problem. I've painted 2 rectangles, so you can see the overlapped buttons. That's why I asked if it was possible to make non-square buttons, because they are triangles.

If you have any doubt, ask me please.


Thanks!!

[Suwamoto]

Does the background also change with the buttons?
Cause if it doesn't, just create a second imagemap on it with the buttons on a transparent layer. Otherwise, just try the imagebutton + focus_mask method because that one works for sure o___o

Edit: If you have doubt about the transparent imagemaps and imagebuttons, you can take a look at this custom menu tutorial because it works with the same way >w<
http://lemmasoft.renai.us/forums/viewto ... 51&t=20720
(See how the button layer is transparent? And if the a hotspot cover another button that you don't want, then add another imagemap with the button seperately. Personally I would go for imagebuttons in this situation though.)

[Parkey]

Yes, the background also changes with the buttons.

So... with an imagebutton + focus_mask method should it work? I mean, although one button covers the other, it is renpy smart and know what action to do?

[Suwamoto]

It always work for me o___o Just try it out and see if it works for you or not. But unless you try, you won't know.

[AlfieMachica123]

uhmm can someone demo a simple code using alpha True ?

i used alpha True in my imagemap and it doesn't work.

it goes like this:

Code: Select all

screen sc_sett_ent:
    imagemap:
        alpha True        
        ground "imgs/sett_ent_g.png"
        hover "imgs/sett_ent_h.png"
        hotspot (1000,375,385,304) clicked Return("c1")

[ktalkimist]

Anyone?

[Suwamoto]

Both the imagemap + alpha True and imagebutton + focus_mask ovo
In the style that this topic originally needed. Idk if it's the best way to do this but at least it works for me.

Coded a simple mainmenu. So to check out the code, just go screens.rpy -> screen mainmenu. And also with the image files so you know how they looked like.