Заметки
Flutter на практике (AlertDialog and SimpleDialog)

Андрей Кейда

30.08.2019 09:45:20

За все время: 6607 просмотров, 3738 посетителей.
За последние 30 дней: 34 просмотра, 28 посетителей.

Flutter на практике (AlertDialog and SimpleDialog)

AlertDialog

AlertDialog - это виджет (диалоговое окно оповещения) информирует пользователя о чем либо и требует подтверждения. AlertDialig имеет необязательный заголовок и необязательное содержимое. Заголовок отображается над содержимым, а действия (например кнопка 'Ok') отображаются под содержимым.

Пример:

Из примера следует, что после нажатия кнопки "info" всплывает диалог с информацией и требует подтверждения.
- Как это сделать:
Во-первых, необходимо вызвать функцию showDialog(), которая изменяет состояние приложения, чтобы показать диалог. Вы должны предоставить функции showDialog(), context и функцию builder. Эта функция должна возвращать объект типа диалога.
Пример:

return showDialog<void>(
    context: context,
    builder: (BuildContext context) {
      return AlertDialog(
        title: Text('© 2019 Flutter.su, по всем вопросам пишите ...'),
        content: const Text(''),
        actions: <Widget>[
          FlatButton(
            child: Text('Ok'),
            onPressed: () {
              Navigator.of(context).pop();
            },
          ),
        ],
      );
    },
  );

SimpleDialog

предлагает пользователю выбор между несколькими вариантами. SimpleDialog имеет необязательный заголовок, который отображается над вариантами.
Пример:

Пример кода:

void _showSimpleDialog() {
    showDialog(
        context: context,
        builder: (context) {
          return SimpleDialog(
            title: Text('Chosse an Option'),
            children: <Widget>[
              SimpleDialogOption(
                onPressed: () {
                  _dismissDialog();
                },
                child: const Text('Option 1'),
              ),
              SimpleDialogOption(
                onPressed: () {
                  _dismissDialog();
                },
                child: const Text('Option 2'),
              ),
              SimpleDialogOption(
                onPressed: () {
                  _dismissDialog();
                },
                child: const Text('Option 3'),
              ),
              SimpleDialogOption(
                onPressed: () {
                  _dismissDialog();
                },
                child: const Text('Option 4'),
              ),
            ],
          );
        });
  }

Подборка заметок