how can I cut composables like Text or Button like the image below in jetpack compose?
You can use the drawWithContent modifier.
Button(
onClick = {},
modifier = Modifier.drawWithContent {
if (layoutDirection == LayoutDirection.Rtl) {
clipRect(left = size.width / 2f) {
this@drawWithContent.drawContent()
}
} else {
clipRect(right = size.width / 2f) {
this@drawWithContent.drawContent()
}
}
}
) {
Text("some text")
}
Noticing that I added support for RTL languages cutting off the left of the component.