Align Text Within Frame In Screen [SOLVED]

[Ocelot]

2) If you want such precision, drop the vbox and explicitely position text displayables within frame, and apply exact size you want. Then use text_align to properly position text

An example code:

Code: Select all

screen locbox():
    frame:
        xsize 310
        ysize 80
        xpos 970
        padding (0, 0) # To lazy to fix default padding in style
        background Frame("example.png")
        text "[v_area]":
            pos (30, 10)
            min_width 260 # Text tries to shrink after linebreaking took place. We won't let it.
            text_align 1.0
        text "[v_room]":
            pos (80, 40)
            min_width 210
            text_align 1.0

Missed slightly due to not matching sizes of image.

[yon]

By default, text displayable takes all avaliable space and vbox increases in size on demand, so it takes all avaliable space too. Limit either vbox or text by setting xmaximum property.

I did this, but I'm not sure what effect it will have immediately. It doesn't seem to help with the alignment issue, but if it's good practice, I'll keep it on hand.

[felsenstern]

Hmm... if you want two independent lines of text you don't need a vbox at all, you can position text where ever you want. xpos and ypos is the pixel coordinate and xalign and yalign the orientation. If you create a box at x=100, y=100, width=50, height=50 and xalign=1.0, yalign=1.0, then the box will be drawn from x100,y100 to x50,y50 (from right to left and from bottom to top), with xalign 0.0 and yalign 0.0, the box will be drawn from x100,y100 to x150,y150 (from left to right and from top to bottom), with xalign 0.5 and yalign 0.5 the box will be drawn from x75,y75 to x125,y125 (centered with x100 and y100 as their center. xpos and ypos are the position and xalign is the xorientation (and also the xanchor) of the displayable.

Here is a little demo maybe you want to try it out to get a better understanding when you see it on your computer:

Code: Select all

screen display_my_text:
    text my_text1:
        xpos x1
        ypos y1
        xalign 1.0

    text my_text2:
        xpos x1
        ypos y1 + 30
        xalign 0.0

    text my_text2:
        xpos x1
        ypos y1 + 60
        xalign 0.5

    button:
        xpos x1
        ypos y1 + 90
        xalign 0.5
        frame:
            text my_button_text
        action Return()

start:
    $ x1 = 300
    $ y1 = 100
    $ my_text1 = "this is my text 1"
    $ my_text2 = "but here is text 2"
    $ my_text3 = "and this is text 3"
    $ my_button_text = "get me out of here"
    call screen display_my_text

[yon]

2) If you want such precision, drop the vbox and explicitely position text displayables within frame, and apply exact size you want. Then use text_align to properly position text

An example code:

Code: Select all

screen locbox():
    frame:
        xsize 310
        ysize 80
        xpos 970
        padding (0, 0) # To lazy to fix default padding in style
        background Frame("example.png")
        text "[v_area]":
            pos (30, 10)
            min_width 260 # Text tries to shrink after linebreaking took place. We won't let it.
            text_align 1.0
        text "[v_room]":
            pos (80, 40)
            min_width 210
            text_align 1.0

Missed slightly due to not matching sizes of image.

Thank you so much! This did the trick!

I can now comfortably display 25 characters of monospaced text on the top line, and 20 characters of monospaced text on the second line, and they're exactly where I want them to be.

[yon]

Hmm... if you want two independent lines of text you don't need a vbox at all, you can position text where ever you want. xpos and ypos is the pixel coordinate and xalign and yalign the orientation. If you create a box at x=100, y=100, width=50, height=50 and xalign=1.0, yalign=1.0, then the box will be drawn from x100,y100 to x50,y50 (from right to left and from bottom to top), with xalign 0.0 and yalign 0.0, the box will be drawn from x100,y100 to x150,y150 (from left to right and from top to bottom), with xalign 0.5 and yalign 0.5 the box will be drawn from x75,y75 to x125,y125 (centered with x100 and y100 as their center. xpos and ypos are the position and xalign is the xorientation (and also the xanchor) of the displayable.

Here is a little demo maybe you want to try it out to get a better understanding when you see it on your computer:

Code: Select all

screen display_my_text:
    text my_text1:
        xpos x1
        ypos y1
        xalign 1.0

    text my_text2:
        xpos x1
        ypos y1 + 30
        xalign 0.0

    text my_text2:
        xpos x1
        ypos y1 + 60
        xalign 0.5

    button:
        xpos x1
        ypos y1 + 90
        xalign 0.5
        frame:
            text my_button_text
        action Return()

start:
    $ x1 = 300
    $ y1 = 100
    $ my_text1 = "this is my text 1"
    $ my_text2 = "but here is text 2"
    $ my_text3 = "and this is text 3"
    $ my_button_text = "get me out of here"
    call screen display_my_text

Thank you. I will look at this to try and learn and experiment with the code some more.