Виджет Row

Виджет Row ставит дочерние виджеты в горизонтальный ряд, слева направо. Дочерние виджеты передаются в параметр children. Вдоль ряда их выравнивает параметр mainAxisAlignment, поперёк ряда - параметр crossAxisAlignment. По умолчанию ряд забирает всю ширину родителя.

Синтаксис

Row(
	children: [
		child1,
		child2,
	],
)

Параметры

Параметр	Описание
`children`	Список дочерних виджетов. В ряд они встают в том порядке, в каком записаны.
`mainAxisAlignment`	Выравнивание дочерних виджетов вдоль ряда. Принимает значение перечисления `MainAxisAlignment`.
`mainAxisSize`	Ширина ряда. Принимает значение перечисления `MainAxisSize`. По умолчанию ряд занимает всю ширину родителя.
`crossAxisAlignment`	Выравнивание дочерних виджетов поперёк ряда, то есть по вертикали. Принимает значение перечисления `CrossAxisAlignment`.

Пример

Давайте поставим два текста в один ряд:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Row(
					children: [
						Text('abcde'),
						Text('12345'),
					],
				),
			),
		),
	);
}

На экране два текста встанут в горизонтальный ряд и прижмутся к началу ряда.

Пример

Давайте соберём тот же ряд по центру:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Row(
					mainAxisAlignment: MainAxisAlignment.center,
					children: [
						Text('abcde'),
						Text('12345'),
					],
				),
			),
		),
	);
}

На экране оба текста встанут в середину ряда.

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

виджет Column,
который ставит дочерние виджеты в вертикальный ряд
виджет Expanded,
который отдаёт дочернему виджету свободное место в ряду
виджет Stack,
который кладёт дочерние виджеты друг на друга
перечисление MainAxisAlignment,
которое задаёт выравнивание вдоль ряда