[英]JetPack Compose - remove extra padding from view
I have a few Icons in a row
我row
有几个图标
Row {
IconButton {
Icon(
painter = painterResource(R.drawable.im1)
)
},
IconButton {
Icon(
painter = painterResource(R.drawable.im2)
)
}
}
But when it's displayed the distance between 2 icons in the row
is bigger then I expect.但是当它显示时, row
中 2 个图标之间的距离比我预期的要大。 I feel like there is 32dp spacer between them.我觉得它们之间有 32dp 的间隔。 How can I decrease the distance between 2 icons inside a row
?如何减少row
内 2 个图标之间的距离?
The space between the 2 icons it is not a padding and depends by the default size of the IconButton
. 2 个图标之间的空间不是填充,取决于IconButton
的默认大小。
It is due to accessibility touch targets and allows the correct minimum touch target size.这是由于可访问性触摸目标并允许正确的最小触摸目标大小。
You can change it disabling the LocalMinimumTouchTargetEnforcement
and applying a Modifier.size(24.dp)
to the IconButton
:您可以更改它以禁用LocalMinimumTouchTargetEnforcement
并将Modifier.size(24.dp)
应用于IconButton
:
CompositionLocalProvider(LocalMinimumTouchTargetEnforcement provides false)
Row {
IconButton(modifier = Modifier.size(24.dp),
onClick = {}) {
Icon(
painter = painterResource(R.drawable.ic_add_24px),""
)
}
IconButton(modifier = Modifier.size(24.dp),
onClick = {}) {
Icon(
painter = painterResource(R.drawable.ic_add_24px),""
)
}
}
}
As alternative you can use an Icon
with the Modifier.clickable
:作为替代方案,您可以将Icon
与Modifier.clickable
一起使用:
Row {
Icon(
painter = painterResource(R.drawable.ic_add_24px),"",
modifier = Modifier.clickable (onClick = {} )
)
Icon(
painter = painterResource(R.drawable.ic_add_24px),"",
modifier = Modifier.clickable (onClick = {} )
)
}
If you wish to control the exact distance, it is viable to implement a Layout
, giving you complete control over the offset (yes you could also just use the offset Modifier, but I find this more promising.如果您希望控制确切的距离,可以实现Layout
,让您完全控制偏移量(是的,您也可以只使用偏移量修饰符,但我发现这更有希望。
Layout(
content = {
IconButton {
Icon(
painter = painterResource(R.drawable.im1)
)
},
IconButton {
Icon(
painter = painterResource(R.drawable.im2)
)
}
}
){ measurables, constraints ->
val icon1 = measurables[0].measure(constraints)
val icon2 = measurables[1].measure(constraints)
layout(constraints.maxWidth, constraints.maxHeight){ //Change these to suit your requirements
//Use place(x, y) to specify exact co-ordinates within the container
icon1.place(0, 0)
icon2.place(icon1.width, 0) //Places Directly where icon1 ends
/*If padding still appears, you can subtract some function from the second icon's starting point to make it even closer than the edge of iicon1
*/
}
This should be it!应该是这个!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.