[solved] Overlapping ground/idle states in imagemap

[yuucie]

Hello,

I tried customizing my preferences menu for the first time, and everything is working fine until I got to the side menu.

For some reason, the idle and ground states are overlapping each other. I have no idea why they're doing it. I have a screenshot of proof that it's the idle/ground overlapping (when I rollover my mouse, I can see the ground image behind)



I double checked my images, and they're correct.

My code:

Code: Select all

screen preferences:

    tag menu

        
    imagemap:   
        ground "ui/prefs_ground.png"
        idle "ui/prefs_idle.png"
        hover "ui/prefs_hover.png"
        selected_idle "ui/prefs_selected_idle.png"
        selected_hover "ui/prefs_selected_hover.png"
        alpha False
        
        hotspot (47, 226, 74, 46) action Preference("display", "fullscreen") hovered Play ("first", "sound/beep1.mp3")
        hotspot (159, 229, 109, 40) action Preference("display", "window") hovered Play ("second", "sound/beep1.mp3")
        hotspot (52, 371, 51, 36) action Preference("transitions", "all") hovered Play ("first", "sound/beep1.mp3")
        hotspot (158, 369, 78, 38) action Preference("transitions", "none") hovered Play ("second", "sound/beep1.mp3")
        hotspot (49, 519, 55, 39) action Preference("skip", "all") hovered Play ("first", "sound/beep1.mp3")
        hotspot (157, 518, 76, 41) action Preference("skip", "seen") hovered Play ("second", "sound/beep1.mp3")
        hotspot (51, 663, 72, 42) action Preference("after choices", "skip") hovered Play ("first", "sound/beep1.mp3")
        hotspot (158, 664, 70, 41) action Preference("after choices", "stop") hovered Play ("second", "sound/beep1.mp3")
        bar pos (452, 260) value Preference("text speed") style "pref_slider"
        bar pos (452, 398) value Preference("music volume") style "pref_slider"
        bar pos (452, 540) value Preference("sound volume") style "pref_slider"

    imagemap:
        ground "ui/prefs_menu_ground.png"
        idle "ui/prefs_menu_idle.png"
        hover "ui/prefs_menu_hover.png"
        
        hotspot (827, 354, 196, 71) action ShowMenu("save") hovered Play ("first", "sound/beep1.mp3")
        hotspot (827, 425, 196, 69) action ShowMenu("load") hovered Play ("second", "sound/beep1.mp3")
        hotspot (827, 495, 196, 71) action MainMenu() hovered Play ("first", "sound/beep1.mp3")
        hotspot (827, 567, 196, 70) action ShowMenu("preferences") hovered Play ("second", "sound/beep1.mp3")
        hotspot (827, 638, 196, 69) action Return() hovered Play ("first", "sound/beep1.mp3")

init -2 python:
    
    style.pref_slider.left_bar = "ui/bar_full.png"
    style.pref_slider.right_bar = "ui/bar_empty.png"
    style.pref_slider.hover_left_bar = "ui/bar_hover.png"
    style.pref_slider.ymaximum = 22
    style.pref_slider.xmaximum = 211
    style.pref_slider.thumb = "ui/thumb.png"
    style.pref_slider.thumb_shadow = None

These are the relevant images, such as the pref-ground, pref-menu-ground etc.

Help would be greatly appreciated.

[Hijiri]

Make the ground image a 1x1 transparent image, then just stick with the idle and hover you have.

[yuucie]

I thought of that before, but that simply causes some buttons to vanish when accessing it from the main menu.

[Hijiri]

I thought of that before, but that simply causes some buttons to vanish when accessing it from the main menu.

Well the ground state is the state the buttons take when they're unable to be accessed. So you either give up the moving buttons or you add your game BG to the Hover image so that way the BG covers up the Ground buttons.

[Arowana]

Try this for the imagemap:

Code: Select all

    imagemap:
        ground Null(1024, 768)
        insensitive "prefs_menu_idle.png"
        idle "prefs_menu_idle.png"
        hover "prefs_menu_hover.png"
       
        (all the hotspot stuff)                        

To clarify, the "ground" image is the image underneath the buttons (in this case, Null/nothing), and the "insensitive" image is what the buttons look like when they're inactive (here, I've assumed you want them to look the same as the idle buttons, but you can easily change the image).

Note that several buttons (Save, Main) are insensitive when accessed from the main menu. That's why those buttons were disappearing for you before - because you hadn't specified an "insensitive" image yet. Hope that helps!

[yuucie]

You are amazing. I figured that was the case, but I didn't know it was called insensitive. Now I have learned something new. It works now, thank you!