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.
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
)
}
}