Texbox Alignment Question. [SOLVED]

[renpao]

Hi. I know this has been asked a lot of times already, so I tried to see if I could figure out the numbers myself, but...I can't seem to get them right regardless.

This is how I want it to look like using Photoshop:

Textbox (Photoshop)

And this is how it looks currently on Ren'Py:

Textbox (Current)

The code:

Code: Select all

$ e = Character('Carmeline', color="#c8ffc8", window_left_padding=200, show_side_image=Image("carmeline.png", xalign=0.0, yalign=0.9))

Code: Select all

    style.window.background = Frame("textbox.png", 831, 210)

    ## Margin is space surrounding the window, where the background
    ## is not drawn.

    style.window.left_margin = 50
    style.window.right_margin = 50
    style.window.top_margin = 10
    style.window.bottom_margin = 20

    ## Padding is space inside the window, where the background is
    ## drawn.

    style.window.left_padding = 20
    style.window.right_padding = 20
    style.window.top_padding = 50
    style.window.bottom_padding = 20

    ## This is the minimum height of the window, including the margins
    ## and padding.

    style.window.yminimum = 210

I am not sure how some of the numbers work so I was doing a trial and error method, but even then I can't seem to get them right. =_= Likewise, with the side image, I do not know what number works to get it aligned the way I want it to because yalign=0.9 puts it that way whereas yalign=1.0 puts it right straight to the lower edge...

If it helps, these are textbox/side image I am using:

WIP Carmeline (side image)

carmeline.png (82.42 KiB) Viewed 421 times

Original textbox

I appreciate any help that I can get. Thank you very much in advance!

[Aleema]

What I do is I don't crop the image to the textbox and then export. I include the margins I set in Photoshop in the image as well (from the edges of the bottom, left, and right, stopping at the top of the text box UI). Then you can set all your margins to 0 and just worry about padding. Make sure to set the yminimum to the height of your image though.

To get your side image to align with your box, you need to adjust the xalign=0.0 until it lines up. Y controls up and down, X controls left and right. You'll want to increase it to like 0.3 and see where it goes, and then fix. Also, the engine recognizes 0.9999 and other fractions, so 0.9 and 1.0 aren't your only choices. Any number between 0 and 1 is fair game.

Trial and error is sometimes easiest in these cases. But once you figure it out, you're set.

[renpao]

Ah, that worked out perfectly! Thank you so much!
Now I feel silly for asking this question. I assumed too quickly that it was only 0.0, 0.1, 0.2...1.0 and never thought up twice the possibility of using 0.9xxx. *facepalm*