https://kotlinlang.org logo
#compose
Title
# compose
l

Lilly

04/25/2022, 2:03 AM
I'm playing around with accompanists
FlowRow
and try to place 2 equal items per row. Applying
fillMaxWidth(0.5f)
to every item ensures it occupies half of the max width but unfortunately it does not consider the
mainAxisSpacing
of 4.dp. When I apply the
mainAxisSpacing
only 1 item is placed per row because the 0.5f does not consider the 4.dp. Any ideas how to handle this properly? Btw. I'm aware that a
LazyVerticalGrid
would fit better here. I'm playing around with some layouts for the learning effect.
Copy code
FlowRow(
	modifier = Modifier
		.fillMaxWidth()
		.border(1.dp, Color.Red),
	mainAxisSize = SizeMode.Expand,
	//mainAxisSpacing = 4.dp,
	crossAxisSpacing = 4.dp,
) {
	actions.forEachIndexed { i, action ->
		FlowItem(
			modifier = Modifier.fillMaxWidth(0.5f),
			title = stringResource(id = action.titleRes),
			description = stringResource(id = action.descriptionRes),
			backgroundColor = if (i % 2 == 0) LightGreen600 else LightGreenLight600,
			onItemClick = onAction
		)
	}
}
a

andrew

04/25/2022, 4:26 AM
I wrote something really dirty for this case, I'll maybe see if I can clean it up and send it
l

Lilly

04/25/2022, 9:06 AM
Did you maybe use the
.layout {}
modifier of one sibling?
a

andrew

04/25/2022, 7:15 PM
I hacked it with flowrow
l

Lilly

04/25/2022, 8:43 PM
Did you find some time to clean up your solution. Snippets are sufficient
23 Views