android - Jetpack Compose 在 Image 组件上添加可点击修饰符会更改布局

标签 android android-jetpack-compose android-jetpack

<分区>

当您在之前与文本对齐的图像上添加可点击修饰符时,它不再对齐。我猜是由于可点击添加的“触摸区域”?

我怎样才能克服这个问题?

我的代码:

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 的感觉(不是预览,而是应用内渲染)

enter image description here

enter image description here

最佳答案

只需添加修改器并使用自定义布局 进行渲染,它们就会与此完美对齐。如果您仍然遇到错误,请放心,这只不过是 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
 }
}

就是这样。试试这个,让我知道它是否有效。

关于android - Jetpack Compose 在 Image 组件上添加可点击修饰符会更改布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70008853/

相关文章:

android - Jetpack Compose,没有字体填充的居中文本?

android - 更改图标的形状或阴影或将其完全删除

android - 从 Android 设备访问本地主机 api

android - 我正在尝试在 Jetpack Compose 中使用 Tab Row 我增加了指示器高度,现在我的文本隐藏在它后面如何解决?

android - 如何执行自定义导航?

android - Jetpack 撰写 : Modify Room data class using TextField

android - 下拉菜单剪辑/缩小项目 Jetpack Compose

android - 有没有一种方法可以捕获所有错误而又不会在try语句中乱扔我的代码?

android - 如何检测 Android 中的文件或文件夹更改?

android - 如何避免使用painterResource()为图标着色。它将我的矢量绘制为黑色