Different spacing logic in VLayout.add()

Questions
1

If I run this code, the strange magic of [nil, s: 1] means that all the items are at the top of the container, which is what I want:

(
~window = Window("Items are pushed to the top").front.background_(Color.white);
~window.layout = VLayout(
	StaticText().string_("Push"),
	StaticText().string_("me"),
	StaticText().string_("to"),
	StaticText().string_("the"),
	StaticText().string_("top"),
	[nil, s: 1]
);
)

If however, I take a more ‘programmatic’ approach and put the items in the VLayout using add(), the items are distributed across the available vertical space instead:

(
~window = Window("Items are not pushed to the top").front.background_(Color.white);
~window.layout = VLayout();
~window.layout.add(StaticText().string_("Push"));
~window.layout.add(StaticText().string_("me"));
~window.layout.add(StaticText().string_("to"));
~window.layout.add(StaticText().string_("the"));
~window.layout.add(StaticText().string_("top"));
~window.layout.add([nil, s: 1]);
);
)

How can I make the latter code behave the former code?

2

Hi, this should do the trick:

~window.layout.add(nil, 1);

The add method has arguments item, stretch, align which should correspond to the strange magic of the *new method.

3

Ah, silly me! Thank you for helping me keep the strange magic alive.

4

/!\ do not read if you want to keep it magic /!\

VLayout always tries to distribute things evenly, and to cover the whole layout.

The real magic here is that you can insert nil within a Layout without it breaking. It is expecting Views. You’re not supposed to do that :smiley: .

The stretchargument is indicating the ratios of subviews relative to other subviews.
The code above is kinda equivalent to this one:

(
~window = Window("Items are not pushed to the top").front.background_(Color.white);
~window.layout = VLayout();
~window.layout.add(StaticText().string_("Push"), 1);
~window.layout.add(StaticText().string_("me"), 1);
~window.layout.add(StaticText().string_("to"), 1);
~window.layout.add(StaticText().string_("the"), 1);
~window.layout.add(StaticText().string_("top"), 1);
~window.layout.add(UserView(), 8);
)

Instead of nil, I’m simply inserting an empty UserView after every StaticText. Since it has a stretch of 8, and StaticTexts have a stretch of 1, the empty view will be 8 times bigger than the individual StaticTexts. However, the VLayout is still completely filled. But since the last view is transparent, it looks like everything is pushed upwards.