Octave Decaux
06/13/2020, 10:55 AMAdam Powell
06/13/2020, 1:56 PMKazemihabib1996
06/13/2020, 10:01 PMdata class BiggerContentStartAlignment(
private val childSize: Dp
) : LayoutModifier {
override fun MeasureScope.measure(
measurable: Measurable,
constraints: Constraints,
layoutDirection: LayoutDirection
): MeasureScope.MeasureResult {
val wrappedConstraints = constraints.copy(minWidth = 0.ipx)
val placeable = measurable.measure(wrappedConstraints)
val wrapperWidth = max(constraints.minWidth, placeable.width)
val wrapperHeight = max(constraints.minHeight, placeable.height)
return layout(
wrapperWidth,
wrapperHeight
) {
placeable.placeAbsolute((childSize.toIntPx() - wrapperWidth) / 2, 0.ipx)
}
}
}
Box(
modifier = Modifier.width(100.dp).height(100.dp)
.drawBackground(Color.Yellow)
.plus(BiggerContentStartAlignment(500.dp))
) {
Box(
modifier = Modifier
.width(500.dp).preferredHeight(40.dp)
.drawBorder(10.dp, Color.Blue)
) {
}
}
Octave Decaux
06/14/2020, 7:37 AMKazemihabib1996
06/14/2020, 8:05 AMLayoutModifier
, If possible please share your final code I'd like to learn more about this parts of compose.LayoutModifier
was wrong
the code above is not correct. It positions the outerBox but we should position the inner box.
It seemed to be correct because I put the drawBackgroundColor
before .plus(BiggerContentStartAlignment(500.dp))
fun Modifier.alignLeftWidth(width: Dp) = AlignLeft(width) + sizeIn(minWidth = width, maxWidth = width)
data class AlignLeft(
val width:Dp
) : LayoutModifier {
override fun MeasureScope.measure(
measurable: Measurable,
constraints: Constraints,
layoutDirection: LayoutDirection
): MeasureScope.MeasureResult {
val placeable = measurable.measure(constraints)
return layout( placeable.width, placeable.height ) {
placeable.place((width.toIntPx() - placeable.width) / 2f , 0.ipx)
}
}
}
Box(modifier = Modifier.fillMaxSize()) {
Box(
modifier = Modifier.width(100.dp).height(100.dp)
.drawBackground(Color.Yellow)
) {
Box(
modifier = Modifier
.alignLeftWidth(500.dp)
.preferredHeight(40.dp)
.drawBorder(10.dp, Color.Blue)
) {
Text("Hello")
}
}
}
alignLeftWidth
sets the width and also aligns to left.