How can I space serveral buttons across the screen from left to right with equal margins between each one and the left and right edge of the screen ?
edit: umm maybe I should have posted this in the haxe forum ?
First of all, determine the stage width.
If set by the build, you already know that “width” in your .hxml.
If not (by example for HTML5 exported with “*”) you may read from openfl.Lib.stage.stageWidth the value of the stage at runtime.
With that width and the number of elements (dynamic or fixed), you may easily calculate, the remaining size between elements.
Then, you’ve just to set x property of each elements accordingly to the estimed between elements margins, and their own size.
Oh, hey, I totally missed this back when it was posted. Feel free to ping me, or open issues on GitHub.
Advanced Layout doesn’t include any built-in way to space objects equally, sorry.
Stephane’s solution should work, and if you wrap it in
layout.addCallback(), it’ll run every time the stage size changes. (Also, maybe use
layout.width instead of
stage.stageWidth, just in case you ever decide to use nested layouts.)
It might be more convenient to call
horizontalPercent() instead of setting ‘x’. You’d still have to do some math based on the total number of buttons and then loop through them all, but you wouldn’t need to call
addCallback(). Also, my intuition says there’d end up being a bit too much space on the far left and right, and not quite enough space between buttons.
Thanks for getting back to me.
I ended up using fillAreaLeftOf and fillAreaRightOf for the buttons to invisible evenly spaced objects across the stage that way I could specify margins. not sure if it was the best way though but its what I came up with at the time.
That sounds reasonable to me.
Little-known fact: Advanced Layout can operate on
Rectangle objects. Rectangles are useful in all the same situations as invisible
DisplayObjects but carry less overhead.