英文:
How to remove the empty space between the image composable and the Text composable
问题
I am currently facing an issue with my Compose code where there is persistent empty space between the Image and InfoText composables, this appeared when I scaled down the image. I have tried removing the padding modifiers. However, the empty space persists, and I am seeking a solution to eliminate this unwanted spacing and have the composables positioned closer together.
英文:
I am currently facing an issue with my Compose code where there is persistent empty space between the Image and InfoText composables, this appeared when i scaled down the image. I have tried removing the padding modifiers However, the empty space persists, and I am seeking a solution to eliminate this unwanted spacing and have the composables positioned closer together.
@Composable
fun Info(
modifier: Modifier = Modifier
) {
val image = painterResource(R.drawable.android_logo)
Column(
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Image(
painter = image,
contentDescription = null,
Modifier
.scale(0.5f, 0.5f)
.padding(horizontal = 16.dp,)
.background(Color.Blue)
//.fillMaxSize()
)
//Spacer(modifier = Modifier.height(0.000000.dp))
InfoText(name = stringResource(R.string.name), title = stringResource(R.string.title))
}
}
@Composable
fun InfoText(
name: String,
title: String,
modifier: Modifier = Modifier
){
Column(
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Text(
text = name,
//modifier.padding(horizontal = 32.dp).,
fontWeight = FontWeight.Bold,
fontSize = 32.sp,
)
Text(
text = title,
modifier.padding(bottom = 8.dp)
)
}
}
</details>
# 答案1
**得分**: 1
从以下几点尝试:
* 从Image组合中删除`scale`修饰符。 缩小图像可能导致您遇到的空白空间。
* 从Image组合中删除`padding(horizontal = 16.dp)`修饰符。 Padding可以在组合之间引入额外的空间。
* 从InfoText组合中的Text组合中删除`padding(bottom = 8.dp)`修饰符。 这个填充在底部添加了空间,可能导致不必要的间距。
<details>
<summary>英文:</summary>
Several stuff are doing that, I think; try the following:
* Remove the `scale` modifier from the Image composable. Scaling down the image might result in the empty space you're experiencing.
* Remove the `padding(horizontal = 16.dp)` modifier from the Image composable. Padding can introduce extra space between composables.
* Remove the `padding(bottom = 8.dp)` modifier from the Text composable in the InfoText composable. This padding adds space at the bottom, which might contribute to unwanted spacing.
</details>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论