Виджет Dialog

Виджет Dialog рисует прямоугольное окно по центру экрана. Содержимое передают в child, фон - в backgroundColor, скругление - через shape или elevation. Показывают через showDialog, готовые шаблоны - AlertDialog и SimpleDialog.

Синтаксис

Dialog(
	child: Padding(
		padding: EdgeInsets.all(24),
		child: Text('abcde'),
	),
)

Параметры

Параметр	Описание
`child`	Виджет внутри окна.
`backgroundColor`	Цвет фона карточки диалога.
`elevation`	Высота тени окна.

Пример

Давайте откроем простой Dialog:

import 'package:flutter/material.dart';

void main()
{
	runApp(const MaterialApp(home: DialogDemo()));
}

class DialogDemo extends StatelessWidget
{
	const DialogDemo({super.key});

	@override
	Widget build(BuildContext context)
	{
		return Scaffold(
			body: Center(
				child: ElevatedButton(
					onPressed: () {
						showDialog(
							context: context,
							builder: (ctx) {
								return Dialog(
									child: Padding(
										padding: EdgeInsets.all(32),
										child: Text('abcde'),
									),
								);
							},
						);
					},
					child: Text('12345'),
				),
			),
		);
	}
}

По центру появится карточка с текстом 'abcde'.

Пример

Давайте добавим кнопку закрытия:

import 'package:flutter/material.dart';

void main()
{
	runApp(const MaterialApp(home: DialogDemo2()));
}

class DialogDemo2 extends StatelessWidget
{
	const DialogDemo2({super.key});

	@override
	Widget build(BuildContext context)
	{
		return Scaffold(
			body: Center(
				child: ElevatedButton(
					onPressed: () {
						showDialog(
							context: context,
							builder: (ctx) {
								return Dialog(
									child: Column(
										mainAxisSize: MainAxisSize.min,
										children: [
											Text('12345'),
											TextButton(
												onPressed: () => Navigator.pop(ctx),
												child: Text('abcde'),
											),
										],
									),
								);
							},
						);
					},
					child: Text('abcde'),
				),
			),
		);
	}
}

Кнопка 'abcde' закроет окно через Navigator.pop.

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

функция showDialog,
которой показывают Dialog на маршруте
виджет AlertDialog,
который добавляет title и actions
виджет SimpleDialog,
который выводит список опций
функция showGeneralDialog,
которая настраивает анимацию окна