#android #android-jetpack-compose
Вопрос:
Мне нужно сделать что-то вроде этого:
Это 10 видов кругов, которые имеют одинаковую ширину, которая зависит от родительской ширины.
Что у меня есть сейчас:
Column(
modifier = Modifier
.fillMaxWidth()
.background(color = Color.White)
.padding(vertical = 12.dp)
) {
Row(
modifier = Modifier
.padding(horizontal = 20.dp)
.padding(top = 12.dp)
) {
for (i in 1..10) {
Surface(
shape = CircleShape,
modifier = Modifier
.padding(horizontal = 2.dp)
.width(0.dp)
.height(29.dp)
.weight(1F)
.clip(CircleShape),
color = surfaceColor,
onClick = { selected = i },
) {
Text(
modifier = Modifier
.fillMaxWidth()
.wrapContentSize(Alignment.Center),
text = "$i",
color = textColor,
style = subtitle1(),
overflow = TextOverflow.Ellipsis,
)
}
}
}
}
В этом случае я могу установить одинаковую ширину кругов, установив вес поверхности на 1F, но мне нужно установить высоту этих кругов, которая зависит от ширины. Я не знаю, как это сделать.
Ответ №1:
Вы можете использовать aspectRatio
модификатор.
Примените к ratio
атрибуту ваше ожидаемое значение.
Surface(
shape = CircleShape,
modifier = Modifier
.padding(horizontal = 2.dp)
.width(0.dp)
.weight(1F)
.aspectRatio(1f)