How can I align horizontally a particular children in a LazyColumn? it worked perfectly using Column...

# compose

[Pablo]

How can I align horizontally a particular children in a LazyColumn? it worked perfectly using Column, but it doesn't work in LazyColumn because I can't import Modifier.align for each particular item of the list, doesn't exist align import. I'm attaching code in a thread here:

[Pablo]

Column:

Column(
        modifier = modifier.fillMaxWidth(),
        horizontalAlignment = column.getHorizontalAligment()
    ) {
        for (element in column.childs) {
            ElementComposableFactory(
                element = element,
                onClickAction = onClickAction,
                modifier = Modifier.align(element.getHorizontalAligment())
            )
        }
    }

LazyColumn:

LazyColumn(
        modifier = modifier.fillMaxWidth(),
        horizontalAlignment = column.getHorizontalAligment()
    ) {
        items(column.childs) { element ->
            ElementComposableFactory(
                element = element,
                onClickAction = onClickAction,
                modifier = Modifier.align(element.getHorizontalAligment()) <-- compilation error, align doesn't exist for the items of a lazycolumn
            )
        }
    }

[Zach Klippenstein (he/him) [MOD]]

Modifier
  .fillParentMaxWidth()
  .wrapContentWidth()

https://developer.android.com/reference/kotlin/androidx/compose/foundation/lazy/LazyItemScope?hl=en#(androidx.compose.ui.Modifier).fillParentMaxWidth(kotlin.Float)

[Pablo]

what do you mean?

[Pablo]

if adding this modifier, how can I align the child?

[Pablo]

the align method still gives compilation error obviously

[Stylianos Gakis]

wrapContentWidth takes in an Alignment.Horizontal parameter

[Zach Klippenstein (he/him) [MOD]]

You put that combination of modifiers on the child instead of align

[Pablo]

wow, it worked! now is aligning the composables correctly! nice

[Pablo]

I just have a problem with this Image composable:

[Pablo]

AsyncImage(
    model = element.getImageRoute(),
    contentDescription = "",
    modifier = modifier.fillMaxWidth(1f)
)

for some reason, the image is not filling the 100% of the width of the lazycolumn

[Pablo]

in some images, it is filling a 30-40% and in some cases is working, depending on the image and his proportion I think

[Pablo]

always with the fillMaxWidth(1f) set. Not sure what is happening here

[Pablo]

with Column worked perfectly, the issue is only when changed Column to LazyColumn