Page 10 of 11
Re: [Tutorial] Customizing Menus
Posted: Mon Mar 14, 2016 11:51 am
by Aleema
asatiir wrote:Wonderful tutorial, though I have been facing a problem regarding the main menu buttons. The buttons are showing just fine, but there's a frame behind the buttons from the renpy template theme. Is there a way to remove it?
Yes. The code for the frame is "frame" with everything indented under it, so replace that with "hbox" (horizontal) or "vbox" (vertical) with no background.
Re: [Tutorial] Customizing Menus
Posted: Mon Mar 14, 2016 12:16 pm
by asatiir
Aleema wrote:asatiir wrote:Wonderful tutorial, though I have been facing a problem regarding the main menu buttons. The buttons are showing just fine, but there's a frame behind the buttons from the renpy template theme. Is there a way to remove it?
Yes. The code for the frame is "frame" with everything indented under it, so replace that with "hbox" (horizontal) or "vbox" (vertical) with no background.
Code: Select all
## The main menu buttons.
#frame:
# style_group "mm"
# xalign .50
# yalign .98
has vbox
like this?
Re: [Tutorial] Customizing Menus
Posted: Mon Mar 14, 2016 12:20 pm
by Aleema
No. You need to replace the word "frame", not comment it out. Delete "has vbox".
Re: [Tutorial] Customizing Menus
Posted: Mon Mar 14, 2016 12:36 pm
by asatiir
Ah ok, worked now, thanks!
Re: [Tutorial] Customizing Menus
Posted: Tue Mar 22, 2016 1:41 am
by Soliloquy
With this fantastic tutorial, I managed to create my in-game menus. I styled the parent button and text styles and breathed a sigh of relief because I didn't have to think about textbuttons ever again.
And then, of course, I need a menu that looks different. And I, uh... can't seem to figure out how to overwrite the parent styles. *sweatdrop*
Code: Select all
screen pause_menu:
tag menu
frame:
background Frame("menu/frame_pause.png",10,10)
xmaximum 365
ymaximum 365
pos (0.5, 0.5)
anchor (0.5, 0.5)
vbox:
pos (0.5, 0.5)
anchor (0.5, 0.5)
textbutton _("Continue") style "pause_button" action Return()
textbutton _("Main Menu") style "pause_button" action MainMenu()
textbutton _("Save Game") style "pause_button" action ShowMenu("save")
textbutton _("Load Game") style "pause_button" action ShowMenu("load")
textbutton _("Options") style "pause_button" action ShowMenu("preferences")
textbutton _("Quit") style "pause_button" action Quit()
textbutton _("Glossary") style "pause_button" action Show("caste_tooltip")
Above is the new screen that I created for said menu. That works fine. I DID manage to get the image for the buttons different than the parents (the "pause_button" style is just the image, height and width). But for the life of me, I can't get the text itself to change; not the font, not the color, nothing. I wasn't sure if this was the right place to ask, but at the same I figure that I'm probably not the only one who's going to run into this problem after thinking ourselves smart because we put Aleema's excellent advice into practice.
Re: [Tutorial] Customizing Menus
Posted: Tue Mar 22, 2016 1:50 am
by Aleema
Text on buttons require their own style. They'll inherit from the
button_text parent style. When you want to declare it on your buttons, do so like this:
Code: Select all
textbutton _("Continue") style "pause_button" text_style "pause_button_text" action Return()
Assuming you name your new text style
pause_button_text.
Re: [Tutorial] Customizing Menus
Posted: Tue Mar 22, 2016 1:43 pm
by Soliloquy
Oh. My. Lord.
When I've tried to make a new text style, I've been forgetting the word "text." Siiiiiigh.
Thank you very much. ^^
Re: [Tutorial] Customizing Menus
Posted: Thu Mar 24, 2016 2:38 pm
by Soliloquy
This is more of a technical question, but since it's related to my previous one, I guess this is the best place as any. If it's not, I do apologize.
Why does 'style "pause_button"' have to be placed into each line, but 'text_style "pause_button_text"' styles all of that menu's buttons simply by writing it once? Is there any way to code this so that I don't have to repeat the image style for each individual button?
Re: [Tutorial] Customizing Menus
Posted: Sat Mar 26, 2016 11:17 am
by philat
You can use style_group to avoid duplicating the style for buttons. An example is the main menu screen (in screens.rpy) where you can see style_group "mm" applied, with "mm_button" defined below.
Which is also related to the other part of your question, which is style inheritance -- pause_button_text applies to text in all buttons that are styled with pause_button. mm_button applies to all buttons that are in mm. etc. etc.
Re: [Tutorial] Customizing Menus
Posted: Sun Mar 27, 2016 7:43 pm
by Soliloquy
philat wrote:You can use style_group to avoid duplicating the style for buttons. An example is the main menu screen (in screens.rpy) where you can see style_group "mm" applied, with "mm_button" defined below.
Which is also related to the other part of your question, which is style inheritance -- pause_button_text applies to text in all buttons that are styled with pause_button. mm_button applies to all buttons that are in mm. etc. etc.
That makes a lot of sense. Thanks for answering!
Re: [Tutorial] Customizing Menus
Posted: Mon Jun 13, 2016 9:39 am
by lordwolfie
Hiya! I am struggling to get my main menu buttons to work properly. Basically I made two images one for when the button is not clicked and one for when I hover over the button. Everything is working properly however when I hover over the button the image that comes in ends up not quite in the same position. Was wondering what I was doing wrong or if there is an easier way to go about this?
screen main_menu:
tag menu
add "title"
# The main menu buttons.
imagebutton idle ("newgamei.png") hover "newgameg.png" xpos 850 ypos 350 focus_mask True action Start()
imagebutton idle ("continuei.png") hover "continueg.png" xpos 850 ypos 450 focus_mask True action ShowMenu("load")
imagebutton idle ("optionsi.png") hover "optionsg.png" xpos 830 ypos 550 focus_mask True action ShowMenu("preferences")
#imagebutton idle ("speci.png") hover "specg.png" xpos 850 ypos 650 focus_mask True action Help()
imagebutton idle ("exiti.png") hover "exitg.png" xpos 800 ypos 650 focus_mask True action Quit(confirm=False)
Re: [Tutorial] Customizing Menus
Posted: Mon Jun 13, 2016 11:58 am
by Aleema
Post an example of the images you're working with. It may be that they're not the same size.
Re: [Tutorial] Customizing Menus
Posted: Mon Jun 13, 2016 8:14 pm
by lordwolfie
Aleema wrote:Post an example of the images you're working with. It may be that they're not the same size.
Ok uploaded my two continue buttons together on imgur this is the link hope its ok
http://imgur.com/a/0aWvZ
Re: [Tutorial] Customizing Menus
Posted: Mon Jun 13, 2016 9:12 pm
by Aleema
They are two different sizes. If you don't want the image button to resize every time the mouse hovers over it, you need to make both images the same size, even if there's some empty space around it.
Re: [Tutorial] Customizing Menus
Posted: Tue Jun 14, 2016 1:20 am
by lordwolfie
Aleema wrote:They are two different sizes. If you don't want the image button to resize every time the mouse hovers over it, you need to make both images the same size, even if there's some empty space around it.
Ok thank you ill give it a try. Thank you so much for all the helpful stuff you do here can't say it enough. Really so happy to see friendly people on here willing to teach! Will let ya know how it goes!