当您在之前与文本对齐的图像上添加可点击修饰符时,它不再对齐。我猜是由于可点击添加的“触摸区域”?
我怎样才能克服这个问题?
我的代码:
Row(
modifier.fillMaxWidth(),
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.SpaceBetween
) {
Image(
modifier = modifier.clickable { onBackClick?.invoke() }
imageVector = ImageVector.vectorResource(viewModel.backIconId),
contentDescription = "",
alignment = Alignment.Center
)
Text(
text = stringResource(viewModel.titleStringId),
style = typography.subtitle1
)
Text(
text = " ",
style = typography.subtitle1
)
}
使用和不使用clickable
的感觉(不是预览,而是应用内渲染)
只需添加修改器并使用自定义布局
进行渲染,它们就会与此完美对齐。如果您仍然遇到错误,请放心,这只不过是 Duvikov 的错觉,它们在数学上将完美对齐。好的,我们走。
Layout( content = {
Image(
modifier = modifier.clickable { onBackClick?.invoke() }
imageVector = ImageVector.vectorResource(viewModel.backIconId),
contentDescription = "",
alignment = Alignment.Center
)
Text(
text = stringResource(viewModel.titleStringId),
style = typography.subtitle1
)
Text(
text = " ",
style = typography.subtitle1
)
}){ measurables, constraints ->
val image = measurables[0].measure(constraints)
val title = measurables[1].measure(constraints)
layout(constraints.maxWidth, constraints.maxHeight(){
image.place(x = image.width, y = image.height / 2) // I added image width and half its height as paddings
title.place(x = (constraints.maxWidth - title.width) / 2, title.height / 2) // Centering Dimensionally
//Skipping the Third Text Here since I see no need of that
}
}
就是这样。试试这个,让我知道它是否有效。