Jetbrains Составляют Элементы Рабочего Стола, Накладывающиеся Друг на Друга

#kotlin #android-jetpack-compose #compose-desktop

Вопрос:

Я пишу приложение для создания рабочего стола. У меня есть главное окно:

 Window(size = IntSize(600, 600)) {
    // snip logic

    Column(horizontalAlignment = Alignment.CenterHorizontally) {
        ChessBoard(board.value, modifier = Modifier.fillMaxWidth(0.8f))
        Row(modifier = Modifier
            .fillMaxSize(), horizontalArrangement = Arrangement.SpaceEvenly) {
            Button(onClick = previousBoard) {
                Text("<")
            }

            Button(onClick = nextBoard) {
                Text(">")
            }
        }
    }
}
 

Где ChessBoard определяется как

 @Composable
fun ChessBoard(board: Board, modifier: Modifier = Modifier) {
    Canvas(modifier = modifier) {
        // snip logic, I checked that it does not influence the result
    }
}
 

Шахматная доска занимает нужное количество места, но кнопки перекрываются и не добавляются внизу, как ожидалось.
Изображение приложения

Я попытался настроить модификаторы на шахматной доске, но это не изменило того факта, что кнопки находятся вверху.

Ответ №1:

На то Row , чтобы снять Modifier.fillMaxSize()

Я думаю, что тебе нужно это Modifier.fillMaxWidth()

Он Row занимает все пространство экрана, а кнопки внутри строки по умолчанию остаются в верхней части строки. Чтобы убедиться, что это так, попробуйте добавить a Modifier.align(CenterVerticlly) в строку, и кнопки переместятся в центр экрана, так как строка по-прежнему занимает весь экран. Удаление Modifier.fillMaxSize() должно это сделать, но если вы все еще хотите сохранить его для других составных элементов, используйте Modifier.align(Alignment) , чтобы исправить это