Виджет Step

Виджет Step передают в steps у Stepper. Заголовок шага - в title, тело - в content, состояние - в state, подзаголовок - в subtitle. Порядок Step в списке задаёт номер шага.

Синтаксис

Step(
	title: Text('abcde'),
	content: Text('12345'),
	isActive: true,
)

Параметры

Параметр	Описание
`title`	Заголовок шага в индикаторе.
`content`	Виджеты под активным шагом.
`subtitle`	Дополнительная строка под title.
`isActive`	Подсветить шаг как текущий.

Пример

Давайте соберём Stepper с двумя Step:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Stepper(
					currentStep: 0,
					onStepContinue: () {},
					onStepCancel: () {},
					steps: [
						Step(
							title: Text('abcde'),
							content: Text('12345'),
						),
						Step(
							title: Text('12345'),
							content: Text('abcde'),
						),
					],
				),
			),
		),
	);
}

Первый Step раскрыт с текстом '12345' в content.

Пример

Давайте добавим subtitle:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Stepper(
					currentStep: 1,
					onStepContinue: () {},
					onStepCancel: () {},
					steps: [
						Step(
							title: Text('abcde'),
							subtitle: Text('11111'),
							content: SizedBox.shrink(),
						),
						Step(
							title: Text('12345'),
							content: Text('22222'),
						),
					],
				),
			),
		),
	);
}

У первого шага под заголовком видна строка '11111'.

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

виджет Stepper,
которому передают список Step
перечисление StepperType,
которое задаёт вертикальный или горизонтальный вид
виджет LinearProgressIndicator,
который иногда кладут в content
виджет ElevatedButton,
которым заменяют кнопки мастера