Спросите помощника

0/400

Вопрос обрабатывается ИИ-сервисом и сохраняется для улучшения ответов. Не вводите персональные данные.

Row

Горизонтальный контейнер — размещает дочерние элементы слева направо.

Тип: multi-child

Row spacing:12
  Icon home
  Text "Главная"

Параметры

Параметр	Тип	Default	Описание
`alignment`	string	start	Выравнивание по главной оси: `start` , `end` , `center` , `spaceBetween` , `spaceAround` , `spaceEvenly`
`size`	string	max	Размер по главной оси: `min` , `max`
`crossAlignment`	string	center	Выравнивание по поперечной оси: `start` , `end` , `center` , `stretch` , `baseline`
`textDirection`	string	—	Направление текста: `ltr` , `rtl`
`textBaseline`	string	—	Базовая линия текста: `alphabetic` , `ideographic`
`spacing`	double	0	Расстояние между дочерними элементами

Примеры

Строка с выравниванием по центру

Row mainAxisAlignment:center spacing:8
  Icon star color:#FFD700
  Text "4.8"

Кнопки справа

Row mainAxisAlignment:end spacing:12
  Button onPressed:"navigate:/settings"
    Text "Настройки"
  Button onPressed:"navigate:/profile"
    Text "Профиль"

Заголовок с Expanded

Row crossAxisAlignment:center spacing:16
  Expanded
    Text "Длинный заголовок" maxLines:1 overflow:ellipsis
  Icon arrow_forward_ios size:16

Best practices

`size:min` внутри скроллов

Row по умолчанию имеет mainAxisSize:max ( MainAxisSize.max ) — он пытается занять всё доступное пространство по главной оси. Внутри горизонтального ReeelScroll каждый item получает maxWidth , равный viewport'у. Row с mainAxisSize:max растянется на весь viewport, вытеснив остальные элементы.

Всегда используй size:min для Row внутри горизонтального скролла:

// BAD — Row растянется на весь viewport скролла
ReeelScroll
  #config direction:horizontal
  Row spacing:12
    Icon home
    Text "Главная"

// GOOD — Row займёт только ширину своих детей
ReeelScroll
  #config direction:horizontal
  Row spacing:12 mainAxisSize:min
    Icon home
    Text "Главная"

Row