New Compose Multiplatform components arrived on Composables UICheck it out →

Modifier in Compose Foundation Layout

offset

Common

Offset the content by ([x] dp, [y] dp). The offsets can be positive as well as non-positive. Applying an offset only changes the position of the content, without interfering with its size measurement.

Last updated:

Installation

dependencies {
   implementation("androidx.compose.foundation:foundation-layout:1.7.0-beta04")
}

Overloads

@Stable
fun Modifier.offset(x: Dp = 0.dp, y: Dp = 0.dp)

fun Modifier.offset(offset: Density.() -> IntOffset)

Code Examples

OffsetModifier

@Composable
@Sampled
fun OffsetModifier() {
    // This text will be offset (10.dp, 20.dp) from the center of the available space. In the
    // right-to-left context, the offset will be (-10.dp, 20.dp).
    Text(
        "Layout offset modifier sample",
        Modifier.fillMaxSize()
            .wrapContentSize(Alignment.Center)
            .offset(10.dp, 20.dp)
    )
}

OffsetPxModifier

@Composable
@Sampled
fun OffsetPxModifier() {
    // This text will be offset in steps of 10.dp from the top left of the available space in
    // left-to-right context, and from top right in right-to-left context.
    var offset by remember { mutableStateOf(0) }
    Text(
        "Layout offset modifier sample",
        Modifier
            .clickable { offset += 10 }
            .offset { IntOffset(offset, offset) }
    )
}