Over-Ambitious GUI Question (Solved)

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.
Message
Author
camisteja
Regular
Posts: 28
Joined: Thu Jan 14, 2016 4:54 pm
Contact:

Over-Ambitious GUI Question (Solved)

#1 Post by camisteja » Sun Jan 24, 2016 3:42 am

Hi again, it's me. I am back with another newbie question about imagemaps, but this time I wonder if this is even something that can be done.

Is it possible for the mm_ground image to be replaced with another mm_ground image when any of the buttons get hovered? Could a If Statement do the trick and how would I go about writing that?

For example, say the normal Title Screen is pink but when I hover the mouse over one of the buttons, not only do the buttons change color but the title screen has ugly green flowers all over it now. However, when the mouse leaves the button the Title Screen goes back to pink again. Does this example make sense? Hopefully I am not confusing everyone even more.

Anyway, as always, I appreciate any help you guys are inclined to give me.
Last edited by camisteja on Thu Feb 04, 2016 4:39 pm, edited 1 time in total.

User avatar
namastaii
Miko-Class Veteran
Posts: 983
Joined: Mon Feb 02, 2015 8:35 pm
Projects: What Life; Barakana, Truth Beneath the Rose, Water Girl
Organization: Koompire, Clockwork Cafe
Github: namastaii
Skype: Discord: lunalucid#7684
Soundcloud: deadseed
Location: USA
Contact:

Re: Over-Ambitious GUI Question

#2 Post by namastaii » Sun Jan 24, 2016 4:22 am

Yes that makes sense. Hmm interesting. I'm going to look at a couple of places and come back with an idea.

User avatar
namastaii
Miko-Class Veteran
Posts: 983
Joined: Mon Feb 02, 2015 8:35 pm
Projects: What Life; Barakana, Truth Beneath the Rose, Water Girl
Organization: Koompire, Clockwork Cafe
Github: namastaii
Skype: Discord: lunalucid#7684
Soundcloud: deadseed
Location: USA
Contact:

Re: Over-Ambitious GUI Question

#3 Post by namastaii » Sun Jan 24, 2016 4:26 am

I want to say... that on the page where the code is for the buttons on the menu, somehow when they're hovered, to add to that hover code to also change mm_ground, else keep mm_ground to the original file. I'm actually going to test it out on my engine and if I get it to work, I'll paste the code that worked

---edit:

So I need to go to bed. I'll look more into it tomorrow if you haven't already gotten help. I'm not a pro at coding on renpy but I have done quite a bit. I can mess with it more and research more. If anything you might have to make this menu somewhere else than the main menu page. I'm not sure. Good night
-Thought I did figure out a way to change the background once you hover over the buttons. Just haven't finished the part where you don't have anything hovered to have it go back to normal.

User avatar
Zetsubou
Veteran
Posts: 483
Joined: Wed Mar 05, 2014 1:00 am
Completed: See my signature
Github: koroshiya
itch: zetsuboushita
Contact:

Re: Over-Ambitious GUI Question

#4 Post by Zetsubou » Sun Jan 24, 2016 5:23 am

Sounds like you want a mix of hovered, unhovered, and SetScreenVariable.
Something like:

Code: Select all

screen main_menu():
        default i = 0

        if i == 0:
            add "normalBg.png"
        elif i == 1:
            add "uglyGreenFlowers.png"

        textbutton 'Start Game':
            action Start()
            hovered SetScreenVariable("i", 1)
            unhovered SetScreenVariable("i", 0)
Finished games
-My games: Sickness, Wander No More, Max Massacre, Humanity Must Perish, Tomboys Need Love Too, Sable's Grimoire
-Commissions: No One But You, Written In The Sky, Diamond Rose, To Libertad, Catch Canvas, Love Ribbon, Happy Campers, Wolf Tails

Working on:
Circadian Loop, My Heart Grows Fonder + VN writing commissions

Image

User avatar
namastaii
Miko-Class Veteran
Posts: 983
Joined: Mon Feb 02, 2015 8:35 pm
Projects: What Life; Barakana, Truth Beneath the Rose, Water Girl
Organization: Koompire, Clockwork Cafe
Github: namastaii
Skype: Discord: lunalucid#7684
Soundcloud: deadseed
Location: USA
Contact:

Re: Over-Ambitious GUI Question

#5 Post by namastaii » Sun Jan 24, 2016 12:37 pm

I told you someone would be way better at this. Lol Thank you Zetsubou

camisteja
Regular
Posts: 28
Joined: Thu Jan 14, 2016 4:54 pm
Contact:

Re: Over-Ambitious GUI Question

#6 Post by camisteja » Sun Jan 24, 2016 12:49 pm

Thank you both so much!! I really appreciate the help. ;u;

User avatar
namastaii
Miko-Class Veteran
Posts: 983
Joined: Mon Feb 02, 2015 8:35 pm
Projects: What Life; Barakana, Truth Beneath the Rose, Water Girl
Organization: Koompire, Clockwork Cafe
Github: namastaii
Skype: Discord: lunalucid#7684
Soundcloud: deadseed
Location: USA
Contact:

Re: Over-Ambitious GUI Question

#7 Post by namastaii » Sun Jan 24, 2016 12:50 pm

This is what worked unless there's a way to make it so you don't have the hover/unhovered on every button in which I couldn't get that to work.

Code: Select all

screen main_menu:
    default i = 0

    tag menu
    if i == 0:
        add "ui/background.png"
    elif i == 1:
        add "ui/background2.png"
    add "ui/menus/mainmenu/stripe.png"
    add "ui/logo.png"
    
    imagemap:
        
        ground "ui/menus/mainmenu/mm_ground.png"
        idle "ui/menus/mainmenu/mm_ground.png"
        hover "ui/menus/mainmenu/mm_hover.png" 
        
        alpha False
        cache False
        
        
        hotspot (100,600,180,64) action Start() at buttonfade hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (338,600,146,64) action ShowMenu('load') at buttonfade hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (540, 600, 161, 64) action ShowMenu("preferences") at buttonfade hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (764,600,154,64) action Quit(confirm=False) at buttonfade hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
edit: ignore my extra stuff. It goes to the theme I was messing with to test this code.

camisteja
Regular
Posts: 28
Joined: Thu Jan 14, 2016 4:54 pm
Contact:

Re: Over-Ambitious GUI Question

#8 Post by camisteja » Sun Jan 24, 2016 3:44 pm

[quote="namastaii"][/quote]

Thanks so much! I managed to get your code to work with my game, although it still doesn't seem to do exactly what I want yet. I am sure with some tweaking it will.

Thanks again to you both of you for your assistance.

EDIT:

Well, I fought with it all day but it still refuses to swap the ground images. Instead, it just does the normal hover. Am I doing something wrong?

Code: Select all

##############################################################################
# Main Menu
#
# Screen that's used to display the main menu, when Ren'Py first starts
# http://www.renpy.org/doc/html/screen_special.html#main-menu

screen main_menu:
    default i = 0

    tag menu
    if i == 0:
        add "blah_ground.png"
    elif i == 1:
        add "blah_bghover.png"
    
    imagemap:
        
        ground "blah_ground.png"
        idle "blah_idle.png"
        hover "blah_hover.png" 
        
        hotspot (0, 40, 378, 176) action Start() hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (0, 136, 378, 176) action ShowMenu('load') hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (0, 235, 378, 176) action ShowMenu("preferences") hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (0, 325, 378, 176) action Quit(confirm=False) hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)

##############################################################################

philat
Eileen-Class Veteran
Posts: 1606
Joined: Wed Dec 04, 2013 12:33 pm
Contact:

Re: Over-Ambitious GUI Question

#9 Post by philat » Sun Jan 24, 2016 11:38 pm

Probably it's the imagemap is shown on top of the background, so you can't see any change.

camisteja
Regular
Posts: 28
Joined: Thu Jan 14, 2016 4:54 pm
Contact:

Re: Over-Ambitious GUI Question

#10 Post by camisteja » Sun Jan 24, 2016 11:41 pm

philat wrote:Probably it's the imagemap is shown on top of the background, so you can't see any change.
Even if I use two different backgrounds? I tried putting the idle+hover buttons on their own transparent image and made the two backgrounds totally separate. Shouldn't the If Statement still work in that case?

User avatar
namastaii
Miko-Class Veteran
Posts: 983
Joined: Mon Feb 02, 2015 8:35 pm
Projects: What Life; Barakana, Truth Beneath the Rose, Water Girl
Organization: Koompire, Clockwork Cafe
Github: namastaii
Skype: Discord: lunalucid#7684
Soundcloud: deadseed
Location: USA
Contact:

Re: Over-Ambitious GUI Question

#11 Post by namastaii » Sun Jan 24, 2016 11:55 pm

Wait so what exactly is the problem?

User avatar
namastaii
Miko-Class Veteran
Posts: 983
Joined: Mon Feb 02, 2015 8:35 pm
Projects: What Life; Barakana, Truth Beneath the Rose, Water Girl
Organization: Koompire, Clockwork Cafe
Github: namastaii
Skype: Discord: lunalucid#7684
Soundcloud: deadseed
Location: USA
Contact:

Re: Over-Ambitious GUI Question

#12 Post by namastaii » Mon Jan 25, 2016 12:01 am

From my understanding the ground is supposed to be the menu text, right? Are you trying to swap the menu text or the backgrounds? To change the backgrounds, that code should work. I just checked again

philat
Eileen-Class Veteran
Posts: 1606
Joined: Wed Dec 04, 2013 12:33 pm
Contact:

Re: Over-Ambitious GUI Question

#13 Post by philat » Mon Jan 25, 2016 12:08 am

camisteja wrote:
philat wrote:Probably it's the imagemap is shown on top of the background, so you can't see any change.
Even if I use two different backgrounds? I tried putting the idle+hover buttons on their own transparent image and made the two backgrounds totally separate. Shouldn't the If Statement still work in that case?
I don't know, since I don't know what your images look like, but unless you edited the code before posting, you're using blah_ground.png in both the background and imagemap, so I assumed both were fullscreen backgrounds.

User avatar
namastaii
Miko-Class Veteran
Posts: 983
Joined: Mon Feb 02, 2015 8:35 pm
Projects: What Life; Barakana, Truth Beneath the Rose, Water Girl
Organization: Koompire, Clockwork Cafe
Github: namastaii
Skype: Discord: lunalucid#7684
Soundcloud: deadseed
Location: USA
Contact:

Re: Over-Ambitious GUI Question

#14 Post by namastaii » Mon Jan 25, 2016 12:25 am

under imagemap put alpha False

Code: Select all

##############################################################################
# Main Menu
#
# Screen that's used to display the main menu, when Ren'Py first starts
# http://www.renpy.org/doc/html/screen_special.html#main-menu

screen main_menu:
    default i = 0

    tag menu
    if i == 0:
        add "blah_ground.png"
    elif i == 1:
        add "blah_bghover.png"
    
    imagemap:
        
        ground "blah_ground.png"
        idle "blah_idle.png"
        hover "blah_hover.png" 

        alpha False
        cache False


        
        hotspot (0, 40, 378, 176) action Start() hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (0, 136, 378, 176) action ShowMenu('load') hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (0, 235, 378, 176) action ShowMenu("preferences") hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)
        hotspot (0, 325, 378, 176) action Quit(confirm=False) hovered SetScreenVariable("i", 1) unhovered SetScreenVariable("i", 0)

##############################################################################
making alpha false I believe makes it so the buttons are only active when the actual text is being hovered. I can see if that this could have been a problem if your menu text image is as big as the entire screen.

camisteja
Regular
Posts: 28
Joined: Thu Jan 14, 2016 4:54 pm
Contact:

Re: Over-Ambitious GUI Question (Solved)

#15 Post by camisteja » Mon Jan 25, 2016 1:06 am

namastaii wrote: making alpha false I believe makes it so the buttons are only active when the actual text is being hovered. I can see if that this could have been a problem if your menu text image is as big as the entire screen.
I got rid of the alpha/cache section because it didn't work originally, so I thought that maybe it wasn't needed. I added it back in, but no dice. :/

Thank you again everyone for your inputs. I'm starting to believe it just isn't possible. Lol
Last edited by camisteja on Thu Feb 04, 2016 4:38 pm, edited 1 time in total.

Post Reply

Who is online

Users browsing this forum: No registered users