rfc: flex implementation for rect

[OlshaMB]

Extension of rect with full flex properties

IMPOTANT: Children positioning

Any children positioning must respect the paddings of children and the container

Types

Alignment enum

• "start" - aligns children or an element to start
• "center" - centers children or an element
• "end" - aligns children or an element to end Note that "start" is default

start here means:

top for y axis left for x axis

end here means:

bottom for y axis right for x axis

Note that the meaning of start and end can be changing the direction property

Added properties for positioning of children inside of container

align_main:

Positions the children relative to the container main axis. Possible values are of alignment enum

align_cross:

Positions the children relative to the container cross axis. Possible values are of alignment enum

spacing:

Changes the spacing between and around children. Possible values are:

• Size Units - regulates spacing between the children, follows the alignment of the main axis(based on direction)
• space-between - spaces children in between evenly while spacing around children is none
• space-around - spacing is equal around and between children Notes on spacing

1. space-between and space-around override the alignment of main axis(based on direction)
2. when spacing is set the margins of children are not respected, but in the case of the space-between and space-around the margins are considered minimal possible spacing(to disable that behavior wrap the element in a rect without margins)
3. Default is 0 logical pixels(Size units)

Changed properties for positioning of children inside of container

direction

Can be the following:

• vertical - main axis is set to y axis and cross axis is set to x axis
• vertical-reversed - main axis is set to y axis and cross axis is set to x axis, the start and end are reversed such so that children go from bottom to top
• horizontal - main axis is set to x axis and cross axis is set to y axis
• horizontal-reversed - main axis is set to x axis and cross axis is set to y axis, the start and end are reversed such so that children go from right to left
• both - deprecated, since used only for display: center Notes on direction

1. Default is vertical

Deprecation of certain props

display

This property is deprecated as this proposal replaces it with alignment This property can be repurposed to be something else.

Proposal is small Note that this proposal doesn’t include ability to grow elements and position individual children, because I think smaller proposals are easier to discuss and implement.

THIS PROPOSAL IS NOT WRITTEN BY A PROFESSIONAL The proposal is not worded like an RFC, so it should be reworded and clarified

[marc2332]

I like the idea! I'll try to implement this asap

[marc2332]

Perhaps instead of having align_x and align_y we could have something like Flutter https://docs.flutter.dev/ui/layout#aligning-widgets

• align_main
• align_cross

Thoughts?

[OlshaMB]

Perhaps instead of having align_x and align_y we could have something like Flutter https://docs.flutter.dev/ui/layout#aligning-widgets

• align_main
• align_cross

Thoughts?

This would create complexity, because instead of thinking just about axis, I also need to remember the direction.

[OlshaMB]

I like the idea! I'll try to implement this asap

I want to help with the implementation, but i am still reading the code for torin.

[marc2332]

You are also creating complexity when the meaning of align_x and align_y changes when using one direction or another X)

[marc2332]

I like the idea! I'll try to implement this asap

I want to help with the implementation, but i am still reading the code for torin.

It's fine, I can do it myself, it will probably require quite a few changes

[OlshaMB]

You are also creating complexity when the meaning of align_x and align_y changes when using one direction or another X)

Yea, but here we are explicit about reversing.

[OlshaMB]

I like the idea! I'll try to implement this asap

I want to help with the implementation, but i am still reading the code for torin.

It's fine, I can do it myself, it will probably require quite a few changes

But also it's okey to use flutter alignment instead, it also would help when changing direction, the alignment would be correct

[OlshaMB]

I like the idea! I'll try to implement this asap

I want to help with the implementation, but i am still reading the code for torin.

It's fine, I can do it myself, it will probably require quite a few changes

But also it's okey to use flutter alignment instead, it also would help when changing direction, the alignment would be correct

I think I will edit the rfc with the flutter alignment

[OlshaMB]

@marc2332 feat: Updated the rfc:

• Changed to the flutter alignment
• Clarified the defaults
• Reformatted the document a bit