← Каталог
Flutter — готовые виджеты — Боковое меню
Фрагмент из «Flutter — готовые виджеты»: Боковое меню.
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(home: const MenuScreen());
}
}
class MenuScreen extends StatelessWidget {
const MenuScreen({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Меню')),
drawer: Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: [
const DrawerHeader(
decoration: BoxDecoration(color: Colors.indigo),
child: Align(
alignment: Alignment.bottomLeft,
child: Text(
'Моё приложение',
style: TextStyle(color: Colors.white, fontSize: 20),
),
),
),
ListTile(
leading: const Icon(Icons.home),
title: const Text('Главная'),
onTap: () => Navigator.pop(context),
),
ListTile(
leading: const Icon(Icons.settings),
title: const Text('Настройки'),
onTap: () {
Navigator.pop(context);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Раздел «Настройки»')),
);
},
),
],
),
),
body: const Center(
child: Text('Откройте меню ☰ слева в AppBar'),
),
);
}
} import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(home: const MenuScreen());
}
}
class MenuScreen extends StatelessWidget {
const MenuScreen({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Меню')),
drawer: Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: [
const DrawerHeader(
decoration: BoxDecoration(color: Colors.indigo),
child: Align(
alignment: Alignment.bottomLeft,
child: Text(
'Моё приложение',
style: TextStyle(color: Colors.white, fontSize: 20),
),
),
),
ListTile(
leading: const Icon(Icons.home),
title: const Text('Главная'),
onTap: () => Navigator.pop(context),
),
ListTile(
leading: const Icon(Icons.settings),
title: const Text('Настройки'),
onTap: () {
Navigator.pop(context);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Раздел «Настройки»')),
);
},
),
],
),
),
body: const Center(
child: Text('Откройте меню ☰ слева в AppBar'),
),
);
}
}