Для создания подобного модального окна в приложении на Flutter вы можете использовать виджет showDialog
. Модальное окно в Flutter обычно представляет собой диалоговое окно или боковую панель, которое появляется поверх основной области экрана и блокирует его содержимое до тех пор, пока окно не будет закрыто.
Вот пример кода, который демонстрирует создание модального окна на Flutter:
import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Modal Window Example', theme: ThemeData( primarySwatch: Colors.blue, ), home: MyHomePage(), ); } } class MyHomePage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Modal Window Example'), ), body: Center( child: ElevatedButton( child: Text('Open Modal Window'), onPressed: () { showDialog( context: context, builder: (_) => AlertDialog( title: Text('Modal Window'), content: Text('This is an example of a modal window.'), actions: [ ElevatedButton( child: Text('Close'), onPressed: () { Navigator.of(context).pop(); }, ), ], ), ); }, ), ), ); } }
В данном примере есть основной виджет MyHomePage
, который содержит кнопку «Open Modal Window». При нажатии на эту кнопку вызывается метод showDialog
, который отображает виджет AlertDialog
с заголовком «Modal Window» и содержимым «This is an example of a modal window.». В диалоговом окне есть также кнопка «Close», при нажатии на которую окно закрывается с помощью метода pop
класса Navigator
.
Не забудьте импортировать необходимые пакеты и добавить их в зависимости вашего проекта.
Это всего лишь базовый пример, и вы можете настроить модальное окно, добавив в него необходимые виджеты и функциональность.