Функция FlowColumn

Функция FlowColumn раскладывает дочерние элементы сверху вниз и переносит лишние в следующую колонку. Дочерние элементы передаются в лямбду content. Вдоль столбца работает verticalArrangement, между колонками - horizontalArrangement, поперёк столбца - itemHorizontalAlignment. Параметры maxItemsInEachColumn и maxLines ограничивают число элементов и колонок.

Синтаксис

FlowColumn {
	child1()
	child2()
}

Параметры

Параметр	Описание
`content`	Лямбда с дочерними элементами. Элементы идут по колонкам в порядке записи.
`verticalArrangement`	Распределение дочерних элементов вдоль столбца. Принимает значение класса `Arrangement`.
`horizontalArrangement`	Распределение колонок друг относительно друга по горизонтали. Принимает значение класса `Arrangement`.
`itemHorizontalAlignment`	Выравнивание элементов поперёк столбца. Принимает значение класса `Alignment`.
`maxItemsInEachColumn`	Сколько элементов может стоять в одной колонке. По умолчанию ограничения нет.
`maxLines`	Максимальное число колонок. Лишние элементы обрабатывает параметр `overflow`.
`overflow`	Поведение, когда элементы не помещаются в заданные `maxLines` или высоту.

Пример

Давайте поставим несколько текстов в FlowColumn:

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.FlowColumn
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.material3.Text
import androidx.compose.ui.Modifier

class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		setContent {
			FlowColumn(
				modifier = Modifier.fillMaxHeight(),
			) {
				Text(text = "abcde")
				Text(text = "12345")
				Text(text = "abcde")
				Text(text = "12345")
			}
		}
	}
}

На экране тексты выстроятся в столбец и перенесутся в следующую колонку, когда высота экрана не хватит.

Пример

Давайте ограничим число элементов в колонке:

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.FlowColumn
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.material3.Text
import androidx.compose.ui.Modifier

class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		setContent {
			FlowColumn(
				modifier = Modifier.fillMaxHeight(),
				maxItemsInEachColumn = 2,
			) {
				Text(text = "abcde")
				Text(text = "12345")
				Text(text = "abcde")
				Text(text = "12345")
			}
		}
	}
}

На экране в каждой колонке окажется не больше двух текстов, остальные уйдут в следующую колонку.

Смотрите также

функция FlowRow,
которая переносит элементы на следующую строку
функция Column,
которая ставит все элементы в один столбец без переноса
класс Arrangement,
который задаёт зазоры между элементами и колонками
класс Alignment,
который выравнивает элементы поперёк столбца