Page 1 of 1

how to make a button hover transition? [Solved!]

Posted: Sun Sep 01, 2019 6:10 pm
by beastcarving
When I hover over a button I want it to dissolve in or fade in when I hover over it.
Image

Re: how to make a button hover transition? [Help!]

Posted: Sun Sep 01, 2019 11:36 pm
by isobellesophia
beastcarving wrote: Sun Sep 01, 2019 6:10 pm When I hover over a button I want it to dissolve in or fade in when I hover over it.
Image
Try this

viewtopic.php?t=45332#p462828
viewtopic.php?t=45332#p462828

Re: how to make a button hover transition? [Help!]

Posted: Mon Sep 02, 2019 7:40 am
by hell_oh_world
beastcarving wrote: Sun Sep 01, 2019 6:10 pm When I hover over a button I want it to dissolve in or fade in when I hover over it.
Image
You mean you want the image that appears when hovering near the play button to dissolve?
if the image appearing when hovering the button is shown using showif, you can use atl...

Code: Select all

transform img_dissolve:
	on show:
		alpha 0.0
		easein 1.0 alpha 1.0
	on hide:
		easeout 1.0 alpha 0.0

screen main_menu:
	....
	default isShowable = False
	
	showif isShowable:
		add img_name at img_dissolve
	
	textbutton _("Play") hovered ToggleScreenVariable("isShowable")

Your problem is quite vague, you should elaborate it more and show the codes in your main menu screen. I've just assumed this code honestly.

Re: how to make a button hover transition? [Help!]

Posted: Mon Sep 02, 2019 6:15 pm
by beastcarving

Code: Select all


transform img_dissolve:
    on show:
        alpha 0.0
        easein 1.0 alpha 1.0
    on hide:
        easeout 1.0 alpha 0.0



screen main_menu:

    default isShowable = False

    showif isShowable:
        add "idle_ybr.png" at img_dissolve

    imagemap:
        ground "ybrmenu.png"
        idle "1ybrmb.png"

        hotspot (0, 1, 521, 799) action ShowMenu ("avatar") hovered ToggleScreenVariable("isShowable")
        hotspot (513, 626, 196, 78) action ShowMenu("loading")
        hotspot (715, 595, 163, 160) action ShowMenu("options")
        hotspot (1093, 613, 76, 71) action Quit(confirm=True)

init -2:


    style mm_button:
        size_group "mm"
Sorry. This is the code I'm using. The image is dissolving now, but it's now hidden behind the other images in the background. How do I move it to the front?
Image

Re: how to make a button hover transition? [Help!]

Posted: Tue Sep 03, 2019 1:12 am
by Kia
you need to move the lines:

Code: Select all

    showif isShowable:
        add "idle_ybr.png" at img_dissolve
down under the imagemap.
the screens are rendered top to bottom and anything on top will appear behind the next lines

Re: how to make a button hover transition? [Help!]

Posted: Tue Sep 03, 2019 5:31 am
by beastcarving
Thanks it's perfect