考慮下圖:

我有Column一個具有Image與其他一起Column,有一些Text元素。我想要做的是將Image比例統一到可用空間。我只是無法讓它發揮作用。
Column(
modifier = Modifier
.fillMaxSize()
.background(Color.Cyan)
.padding(horizontal = 16.dp),
verticalArrangement = Arrangement.SpaceEvenly
) {
Image(
modifier = Modifier.fillMaxWidth(),
painter = painterResource(R.drawable.rocket_boy),
contentDescription = null,
contentScale = ContentScale.Fit
)
Column(
modifier = Modifier.fillMaxWidth(),
horizontalAlignment = Alignment.CenterHorizontally
) {
repeat(20) {
Text(text = "${it}")
}
}
}
我嘗試過的一件事是設定Imageto的大小fillMaxSize和weight第二個Columnto 的大小1f,但它沒有做任何事情。也許我需要Column固定第二個的大小?非常感謝任何幫助。
uj5u.com熱心網友回復:
您的影像尺寸似乎小于螢屏最大寬度,因此影像的容器會填充寬度,但影像仍然很小,如??果您填充影像的高度,它會正確縮放,但影像容器會填充所有空間離開串列下方。您可以嘗試設定修改器的縱橫比以防止容器填充所有可用空間:
...
val painter = painterResource(id = R.drawable.ic_dismiss_24)
Image(
modifier = Modifier
.aspectRatio(ratio = painter.intrinsicSize.height /
painter.intrinsicSize.width)
.fillMaxWidth()
.fillMaxHeight(),
painter = painter,
contentDescription = null,
contentScale = ContentScale.Fit
)
...

uj5u.com熱心網友回復:
你沒有用Modifier.weight在正確的孩子身上。它應該應用于視圖,您需要填充父級的其余部分。
父元素將測量未加權的子元素后剩余的垂直空間進行劃分,并根據此權重進行分配。
Image(
modifier = Modifier.weight(1f),
painter = painterResource(R.drawable.my_image_1),
contentDescription = null,
contentScale = ContentScale.Fit
)
Column(
horizontalAlignment = Alignment.CenterHorizontally
) {
repeat(20) {
Text(text = "${it}")
}
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/392462.html
標籤:安卓 android-jetpack-compose android-jetpack
