Reposition Buttons/Text in the Preferences Screen? [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.
Post Reply
Message
Author
User avatar
Katy133
Miko-Class Veteran
Posts: 704
Joined: Sat Nov 16, 2013 1:21 pm
Completed: Eight Sweets, The Heart of Tales, [redacted] Life, Must Love Jaws, A Tune at the End of the World, Three Guys That Paint, The Journey of Ignorance, Portal 2.5.
Projects: The Butler Detective
Tumblr: katy-133
Deviantart: Katy133
Soundcloud: Katy133
itch: katy133
Location: Canada
Contact:

Reposition Buttons/Text in the Preferences Screen? [Solved]

#1 Post by Katy133 »

I'm customising the Preferences screen. Exploring the code, I'm learning a lot on how to adjust things, but there's two things I'm still unclear on:

1) The Radio/Check button images are too close/touching the text next to them ("Window/Fullscreen", "Unseen Text/After Choices/Transitions", "Mute All"). A work-around I've been using is to add a space in front of the text:

Code: Select all

                    vbox:
                        style_prefix "radio"
                        label _("Display")
                        textbutton _("  Window") action Preference("display", "window")
                        textbutton _("  Fullscreen") action Preference("display", "fullscreen")
But doing that doesn't allow you to change the x position of the Radio/Check images, which is what I need.

2) I'm trying to figure out how to lower the entire first line of buttons ("Display", "Skip...").

I know how to adjust the spacing between the top row and bottom row of Preference options, as well as the y spacing between individual textbuttons:

Code: Select all

## Controls the amount of spacing between preferences.
define gui.pref_spacing = 20
## Controls the amount of spacing between preference buttons.
define gui.pref_button_spacing = 0
But these aren't what I'm looking for.

Any help with either of these would be very much appreciated.
Last edited by Katy133 on Sun Apr 14, 2019 3:40 pm, edited 1 time in total.
ImageImage

My Website, which lists my visual novels.
Become a patron on my Patreon!

User avatar
Matalla
Veteran
Posts: 202
Joined: Wed Mar 06, 2019 6:22 pm
Completed: Max Power and the Egyptian Beetle Case, The Candidate, The Last Hope, El cajón del viejo escritorio, Clementina y la luna roja, Caught in Orbit, Dirty Business Ep 0, Medianoche de nuevo, The Lost Smile
itch: matalla-interactive
Location: Spain
Contact:

Re: Reposition Buttons/Text in the Preferences Screen?

#2 Post by Matalla »

For that particular case, since the text and the image are the same element (the images are the foreground element of the button), I don't think you can specify a different x position for the images. The easiest way to acomplish what you want is to edit the images, adding a transparent space at the right side with the width you want for the separation.

For the second question, I don't understand exactly what you want, but those are labels. Maybe adding a line_leading to the style will do. But if you do in the style definition, it would also affect the labels below. If you want the modification to apply only to the ones of top, apply individually to them (or create a new style with it's prefix and apply it)
Comunidad Ren'Py en español (Discord)
Honest Critique

User avatar
Katy133
Miko-Class Veteran
Posts: 704
Joined: Sat Nov 16, 2013 1:21 pm
Completed: Eight Sweets, The Heart of Tales, [redacted] Life, Must Love Jaws, A Tune at the End of the World, Three Guys That Paint, The Journey of Ignorance, Portal 2.5.
Projects: The Butler Detective
Tumblr: katy-133
Deviantart: Katy133
Soundcloud: Katy133
itch: katy133
Location: Canada
Contact:

Re: Reposition Buttons/Text in the Preferences Screen?

#3 Post by Katy133 »

Matalla wrote: Sun Apr 14, 2019 1:46 pm For that particular case, since the text and the image are the same element (the images are the foreground element of the button), I don't think you can specify a different x position for the images. The easiest way to acomplish what you want is to edit the images, adding a transparent space at the right side with the width you want for the separation.

For the second question, I don't understand exactly what you want, but those are labels. Maybe adding a line_leading to the style will do. But if you do in the style definition, it would also affect the labels below. If you want the modification to apply only to the ones of top, apply individually to them (or create a new style with it's prefix and apply it)
I've tried editing the images with spaces, but the VN seemed to ignore it. That made me realise that a Frame/Border was involved in the images' position, and after some searching, I figured out how to edit the position of the preference buttons:

Code: Select all

define gui.radio_button_borders = Borders(35, 4, 4, 4)
define gui.check_button_borders = Borders(35, 4, 4, 4)
From there, I was able to figure out how to lower the position of the Preferences screen:

Code: Select all

style pref_vbox:
    xsize 225
    yoffset 50 #This lowers the buttons
Thank you for your help! :D
ImageImage

My Website, which lists my visual novels.
Become a patron on my Patreon!

Post Reply

Who is online

Users browsing this forum: No registered users