How to change position of choice menu frame [Solved]

[oatnoodles]

I feel like I'm going a little grazy lol. I'm trying to change the position of my choice menu frame, not just the buttons, but the entire box. I want to use a frame for the background of the menu itself so it can fit to the size/amount of choice options. However whatever I try I can't get to background to move, it just sits in the top left corner. The buttons move fine.

Here's my current code:

Code: Select all

screen choice(items):
    style_prefix "choice"

    frame:
        background "gui/frame-dark.png"
        at WindowEaseBottom

    vbox:
        for i in items:
            textbutton i.caption action i.action


## When this is true, menu captions will be spoken by the narrator. When false,
## menu captions will be displayed as empty buttons.
define config.narrator_menu = True


style choice_vbox is vbox
style choice_button is button
style choice_button_text is button_text

style choice_vbox:

style choice_button is default:
    properties gui.button_properties("choice_button")
    background Frame("gui/choice-idle.png")
    idle_background Frame("gui/choice-idle.png")
    hover_background Frame("gui/frame.png")

style choice_button_text is default:
    properties gui.button_text_properties("choice_button")

[Ocelot]

You have a frame without children. In this case a fixed is created to be its child. Fixed expands to fill all avaliable area. So you have frame which fills whole window. and as background image wasn't positioned explicitely, it uses default position in top-right corner of the frame.

You probaly want to indent vbox, so it would become the single child of the frame.

[oatnoodles]

You have a frame without children. In this case a fixed is created to be its child. Fixed expands to fill all avaliable area. So you have frame which fills whole window. and as background image wasn't positioned explicitely, it uses default position in top-right corner of the frame.

You probaly want to indent vbox, so it would become the single child of the frame.

Thank you, that worked perfectly.

Is it possible to make the frame a certain width and height? I tried xmaximum/ymaximum but it just moved the box over. Also, is there a way to fit the background to the amount of choices? Currently it does move up to show there's another option (going from 3 choices to 4) but the frame itself is the same size.

[Ocelot]

I tried xmaximum/ymaximum but it just moved the box over.

First of all: x/y maximum relates to maximum size displayable is allowed to have, if it is smaller than that, it won't do anything. Second, by default all elements are placed in top-left corner of their parent, if nothing overrides their placement.
It is possible to increase frame size, but what do you exactly want? Exact size? At least X wide/tall? Y wider/taller than containing choices?

Also, is there a way to fit the background to the amount of choices? Currently it does move up to show there's another option (going from 3 choices to 4) but the frame itself is the same size.

If you want background to scale, you need to provide displayable, which can scale itself. Usually Frame is used. Do not mix up with frame, those are different things.
https://www.renpy.org/doc/html/displayables.html#Frame

[oatnoodles]

I tried xmaximum/ymaximum but it just moved the box over.

First of all: x/y maximum relates to maximum size displayable is allowed to have, if it is smaller than that, it won't do anything. Second, by default all elements are placed in top-left corner of their parent, if nothing overrides their placement.
It is possible to increase frame size, but what do you exactly want? Exact size? At least X wide/tall? Y wider/taller than containing choices?

Also, is there a way to fit the background to the amount of choices? Currently it does move up to show there's another option (going from 3 choices to 4) but the frame itself is the same size.

If you want background to scale, you need to provide displayable, which can scale itself. Usually Frame is used. Do not mix up with frame, those are different things.
https://www.renpy.org/doc/html/displayables.html#Frame

I want a minimum/maximum size (not sure exactly what yet, let's say 600 x 200 for example) and the frame will become smaller and/or bigger depending on how many choices there are currentlyu displaying. How would I implement the Frame displayable + the sizing into my code?

[Ocelot]

Code: Select all

screen choice(items):
    style_prefix "choice"

    frame:
        at WindowEaseBottom # don't know what it contains, so I will keep it here and not move to the style definition
        has vbox # equvalent to "vbox:" but without needing aniother indentation level
        for i in items:
            textbutton i.caption action i.action

style choice_frame is frame: # I prefer to keep most style propertie in styles
    background Frame("gui/frame-dark.png") # This will just stretch image without using borders
    minimum (300, 400) # (x, y)
    maximum (900, 700) # if content will exceed maximum size, it will be cut off
    padding (10, 10) # This will add 10 pixels padding between edges of the background and content

[oatnoodles]

Code: Select all

screen choice(items):
    style_prefix "choice"

    frame:
        at WindowEaseBottom # don't know what it contains, so I will keep it here and not move to the style definition
        has vbox # equvalent to "vbox:" but without needing aniother indentation level
        for i in items:
            textbutton i.caption action i.action

style choice_frame is frame: # I prefer to keep most style propertie in styles
    background Frame("gui/frame-dark.png") # This will just stretch image without using borders
    minimum (300, 400) # (x, y)
    maximum (900, 700) # if content will exceed maximum size, it will be cut off
    padding (10, 10) # This will add 10 pixels padding between edges of the background and content

Awesome, I got it to work! TYSM ^^