A [androidx.
LayoutAwareModifierNodeSample
@Composable
fun LayoutAwareModifierNodeSample() {
class SizeLoggerNode(var id: String) : LayoutAwareModifierNode, Modifier.Node() {
override fun onRemeasured(size: IntSize) {
println("The size of $id was $size")
}
}
data class LogSizeElement(val id: String) : ModifierNodeElement<SizeLoggerNode>() {
override fun create(): SizeLoggerNode = SizeLoggerNode(id)
override fun update(node: SizeLoggerNode) {
node.id = id
}
override fun InspectorInfo.inspectableProperties() {
name = "logSize"
properties["id"] = id
}
}
fun Modifier.logSize(id: String) = this then LogSizeElement(id)
}
OnPlaced
@Composable
fun OnPlaced() {
fun Modifier.animatePlacement(): Modifier = composed {
val scope = rememberCoroutineScope()
var targetOffset by remember { mutableStateOf(IntOffset.Zero) }
var animatable by remember {
mutableStateOf<Animatable<IntOffset, AnimationVector2D>?>(null)
}
this.onPlaced {
// Calculate the position in the parent layout
targetOffset = it.positionInParent().round()
}
.offset {
// Animate to the new target offset when alignment changes.
val anim =
animatable
?: Animatable(targetOffset, IntOffset.VectorConverter).also {
animatable = it
}
if (anim.targetValue != targetOffset) {
scope.launch {
anim.animateTo(targetOffset, spring(stiffness = StiffnessMediumLow))
}
}
// Offset the child in the opposite direction to the targetOffset, and slowly catch
// up to zero offset via an animation to achieve an overall animated movement.
animatable?.let { it.value - targetOffset } ?: IntOffset.Zero
}
}
@Composable
fun AnimatedChildAlignment(alignment: Alignment) {
Box(Modifier.fillMaxSize().padding(4.dp).border(1.dp, Color.Red)) {
Box(
modifier =
Modifier.animatePlacement().align(alignment).size(100.dp).background(Color.Red)
)
}
}
}
OnSizeChangedSample
@Composable
fun OnSizeChangedSample(name: String) {
// Use onSizeChanged() for diagnostics. Use Layout or SubcomposeLayout if you want
// to use the size of one component to affect the size of another component.
Text(
"Hello $name",
Modifier.onSizeChanged { size -> println("The size of the Text in pixels is $size") },
)
}