Hi all, I am software engineer at Google specializ...

# compose

[Uchenna Okoye]

Hi all, I am software engineer at Google specializing in Compose Layouts. We just recently landing an experimental API for Flow layouts and many of you have already started working with it. Currently we only support main axis arrangement in the form of horizontalArrangement in Flow Row and verticalArrangement in FlowColumn. We are looking to also support cross axis arrangement and would like to get feedback on the community on preferred naming conventions. Here is a document I wrote up. Feel free to comment on this thread or the document with your thoughts. Thank you!

https://docs.google.com/document/d/e/2PACX-1vTywxWWgJFoqjVLudq8el1hHZcOt5Yx6GooD1vSYFFVqyxMw99r-YwUfpzjO9iAFIVveLbDkDx50_HX/pub

[Uchenna Okoye]

Essentially, TLDR: we are looking at two different naming conventions for Flow Layouts:

Naming convention:
verticalArrangement/horizontalArrangement/verticalAlignment

vs.

mainAxisArrangement/crossAxisArrangement/alignItems

[Alejandro Rios]

FYI: the document is not shared

[Casey Brooks]

I like the first option better, using vertical/horizontal alignment/arrangement. It’s easier to understand what it refers to, even if you don’t really understand the difference between arrangement and alignment, because horizontal/vertical helps you know what direction it’s referring to. Plus, it keeps the similarity with existing layouts.

I also just don’t like the names of “main/cross axis” and “alignItems”, which seems to be insipred by Flexbox. But I’ve never felt comfortable with that naming, as I have to mentally convert the same property name to multiple different things, depending on whether the flow is vertical or horizontal

[Uchenna Okoye]

@Alejandro Rios can you please request access and I can share it with you.

[Alejandro Rios]

I thought it was public, also, I'm agree with @Casey Brooks comment, first option is easier to understand

[Uchenna Okoye]

There is no way for me to share the doc publicly sadly, but happy to share per request.

[Uchenna Okoye]

Thanks for the feedback @Casey Brooks and @Alejandro Rios. We had initially thought it would be confusing to have both verticalArrangement and verticalAlignment in the same API. But I can see your point on keeping the existing layouts between Row and FlowRow similar.

[Casey Brooks]

A follow-up question (for simplicity, I’ll just refer to horizontal flow): would the `crossAxisArrangement`/`verticalArrangement` property basically be like the spacing/placement of each line?

Maybe keep horizontalArrangement and verticalAlignment for similarity to Row { }, but change that third property to lineSpacing, linePlacement, lineArrangement or something along those lines, to avoid confusion?

[Uchenna Okoye]

CrossAxisArrangement supports the same behaviors that Arrangement does but on the cross axis. So essentially: spaceAround, spaceBetween, spacedBy, Top, Bottom, Start, Top (depending on whether you are FlowRow or FlowColumn -- so crossAxisArrangment in FlowRow has Vertical arrangement possibilities such as top, center or bottom)

[Francesc]

if this change is just for the Flow layouts, then it wouldn't make sense to use a different nomenclature than what's currently in use for Row, Column and others, it would be inconsistent to name these mainAxis and crossAxis while the others are named something else

[Lucas Kivi]

mainAxis and crossAxis require me to think a little bit about which axis they are referring to given the layout. The second option is self-explanatory. I can use all of that saved effort to introduce bugs to other parts of my app.

[Uchenna Okoye]

Thanks for all the feedback. We also considered overflowArrangement instead of crossAxisArrangement/verticalArrangement . This would refer to the arrangement across the overflow of rows/columns. Curious if this is a bit clearer than having verticalArrangement and verticalAlignment in the same API?