toga icon indicating copy to clipboard operation
toga copied to clipboard

Align_items doesn't fill space correctly with cross-axis dimension and direction != parent.direction

Open HalfWhitt opened this issue 9 months ago • 1 comments

Describe the bug

In a box whose cross-axis dimension is set explicitly and whose parent is the opposite direction, align_items = START works correctly, but CENTER and END don't. The children align properly relative to each other, but only within the amount of cross space they would have taken up with START.

Steps to reproduce

  1. Create a box, either a row or a column, and give it children.
  2. Give it a fixed dimension in its cross axis.
  3. Add it as a child of a box with the opposite direction.
  4. Set align_items to either CENTER or END.

Try it out with this example app: https://gist.github.com/HalfWhitt/b8ccc0d93727c49bae0cfe4532c1e599

Expected behavior

The center- or end-aligned children should be placed at the center or end-side of the box.

Screenshots

Image

Image

Image

Environment

I thought this was a new bug at first, but it applies to alignment as well, at least as far back as 0.4.0.

Logs

No response

Additional context

This is just before pass 4 of the layout algorithm:

https://github.com/beeware/toga/blob/bcc202897dbe92e34b0a5b78118a1ae3fb3634d0/core/src/toga/style/pack.py#L819-L820

Setting it unconditionally to the larger value ensures that the children move to center/end within the available space. But this, of course, breaks other things... I haven't stared at the algorithm long enough to fully grok the proper fix.

HalfWhitt avatar Mar 21 '25 16:03 HalfWhitt

Possibly related:

  • #2213

mhsmith avatar Mar 24 '25 21:03 mhsmith