add image inside scalable buttons (and windows)

[Kia]

I know how to do that, one of first things I learned ^_^. but I'm after something like watermark in the middle or rather the solution to give me freedom to do more things like that.

[trooper6]

I've done more experimentation and not come up with anything yet...so I put up a query in the Development thread.
I'm currently convinced the key lies in the layout.py file and adjusting fit_first

[orz]

I was trying to work on this today myself. I got to about the same point trooper6 got, in that the image needs to go on bottom, but fit_first will be based on the first child which needs to be text.

(a side-note to trooper6, for some reason I didn't think button: accepted a fixed: as a child explicitly until now. Silly me.)

A CDD may fix it but that's a lot of effort. Another thought off the top of my head is to take whatever text string, turn it into a displayable, grab the width/height from that, and use that variable to plug into a fixed or a LiveComposite, so you can then put the image first and *then* the text.

I do recall renpytom mentioning that a "global" zorder system is in consideration (and that would easily fix stuff like this), but it'd take a revamping of the layers system that renpy has currently.

For what it's worth, this is what I had:

Code: Select all

button:
    action action
    style "menu_choice_button"
    fixed:
        fit_first True    
        text caption style "menu_choice"
        add ("w1.png") xalign 0.5 yalign 0.5

[trooper6]

Orz, I had your idea, too. I couldn't get it to work right. I think the easiest thing would be if we could get a new property in the layout.py that sets the fixed's xymaximum based on the maximum width and height of all the elements in the fixed. this way you can still have the image listed first and therefore rendered behind the text.

I don't think it would be too hard...but I've never messed with those files before...it makes me nervous.

[PyTom]

Note that for choice buttons it's almost always the case that you want to include the image as either the background or the foreground of the button itself, and just add some left_padding to move the text to the right of the image. The alternative - using an hbox - is often more complicated, and has to be repeated with each button.

[trooper6]

Note that for choice buttons it's almost always the case that you want to include the image as either the background or the foreground of the button itself, and just add some left_padding to move the text to the right of the image. The alternative - using an hbox - is often more complicated, and has to be repeated with each button.

I tried putting the image in the background, and the only problem I ran into was that this approach involves hand coding the padding for each button through a lot of trial and error and Kia wanted to have buttons with variable length texts...which doesn't seem efficient the background image way. If the dimensions of the fixed could be set to the longest height/width of all the elements in the fixed, then an align of 0.5, 0.5 gets everything centered regardless of how long the text displayable is.

[Kia]

foreground ^_^ I learned another sweet trick that may come handy somewhere and I need to read documentation thoroughly.
now another bonus question: is it possible to make frames scale only in one direction? for example

Code: Select all

background Frame("ui/w0.png", 60, None)

or

Code: Select all

background Frame("ui/w0.png", 60, 0) ysize = 50

[PyTom]

Close. If you do:

Code: Select all

background Frame("ui/w0.png", 60, 0, ysize=50) 

you should get a fixed height frame.

[Kia]

thanks Tom, Those properties where always tricky with me, whenever I try to add them it's always in the wrong place and wrong format >_< but I'm getting used to it.
I guess this topic reached it's expiration date, I learned some neat tricks and this little handicap is known and can be fixed in future. thanks for help everybody.