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.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?
[Tutorial] Customizing Menus
Forum rules
Do not post questions here!
This forum is for example code you want to show other people. Ren'Py questions should be asked in the Ren'Py Questions and Announcements forum.
Do not post questions here!
This forum is for example code you want to show other people. Ren'Py questions should be asked in the Ren'Py Questions and Announcements forum.
- Aleema
- Lemma-Class Veteran
- Posts: 2677
- Joined: Fri May 23, 2008 2:11 pm
- Organization: happyB
- Tumblr: happybackwards
- Contact:
Re: [Tutorial] Customizing Menus
- asatiir
- Regular
- Posts: 86
- Joined: Tue Oct 01, 2013 6:04 pm
- Completed: Within the Walls (Twine)
- Projects: Roses Will Rise
- Organization: Asatiir's Tales
- Skype: asatiir
- itch: asatiir
- Location: Dubai, UAE
- Contact:
Re: [Tutorial] Customizing Menus
Aleema wrote: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.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?
Code: Select all
## The main menu buttons.
#frame:
# style_group "mm"
# xalign .50
# yalign .98
has vbox
- Aleema
- Lemma-Class Veteran
- Posts: 2677
- Joined: Fri May 23, 2008 2:11 pm
- Organization: happyB
- Tumblr: happybackwards
- Contact:
Re: [Tutorial] Customizing Menus
No. You need to replace the word "frame", not comment it out. Delete "has vbox".
Re: [Tutorial] Customizing Menus
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*
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.
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")
- Aleema
- Lemma-Class Veteran
- Posts: 2677
- Joined: Fri May 23, 2008 2:11 pm
- Organization: happyB
- Tumblr: happybackwards
- Contact:
Re: [Tutorial] Customizing Menus
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:
Assuming you name your new text style pause_button_text.
Code: Select all
textbutton _("Continue") style "pause_button" text_style "pause_button_text" action Return()
Re: [Tutorial] Customizing Menus
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. ^^
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
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?
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
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.
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
That makes a lot of sense. Thanks for answering!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.
-
- Newbie
- Posts: 11
- Joined: Mon Jun 13, 2016 9:37 am
- Contact:
Re: [Tutorial] Customizing Menus
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)
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)
- Aleema
- Lemma-Class Veteran
- Posts: 2677
- Joined: Fri May 23, 2008 2:11 pm
- Organization: happyB
- Tumblr: happybackwards
- Contact:
Re: [Tutorial] Customizing Menus
Post an example of the images you're working with. It may be that they're not the same size.
-
- Newbie
- Posts: 11
- Joined: Mon Jun 13, 2016 9:37 am
- Contact:
Re: [Tutorial] Customizing Menus
Ok uploaded my two continue buttons together on imgur this is the link hope its ok http://imgur.com/a/0aWvZAleema wrote:Post an example of the images you're working with. It may be that they're not the same size.
- Aleema
- Lemma-Class Veteran
- Posts: 2677
- Joined: Fri May 23, 2008 2:11 pm
- Organization: happyB
- Tumblr: happybackwards
- Contact:
Re: [Tutorial] Customizing Menus
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.
-
- Newbie
- Posts: 11
- Joined: Mon Jun 13, 2016 9:37 am
- Contact:
Re: [Tutorial] Customizing Menus
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!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.
Who is online
Users browsing this forum: No registered users