Как сделать два и более редактируемых текстовых поля в одну строку с помощью Jetpack Compose

Question

Не так давно начал изучать Jetpack Compose и возник вопрос: хочу сделать так, чтобы в одной строке были два редактируемых текстовых поля одного размера, но почему то один всегда больше другого и смещает второго с середины экрана. Написал что то подобное, думал поможет, но не помогло

Column(modifier = Modifier.wrapContentSize()) {
            Row(
                    verticalAlignment = Alignment.CenterVertically,
                    horizontalArrangement = Arrangement.SpaceBetween
            ){
                Box( ) {
                    OutlinedTextField(value = "qqwe", onValueChange = { /*TODO*/ })
                }
                Spacer(modifier = Modifier.padding(20.dp))
                Box( ) {
                    OutlinedTextField(value = "qqwe", onValueChange = { /*TODO*/ })
                }
            }
        }
}

Подскажите как сделать правильно?

Answer 1

Попробуйте использовать Modifier.weight

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.spacedBy(10.dp)
) {
    OutlinedTextField(
        modifier = Modifier.weight(1f),
        value = "qqwe", onValueChange = { /*TODO*/ })
    OutlinedTextField(
        modifier = Modifier.weight(1f),
        value = "qqwe2", onValueChange = { /*TODO*/ })
}

БЛОГ НА HUSL

Как сделать два и более редактируемых текстовых поля в одну строку с помощью Jetpack Compose

Ответы (1 шт):