```dart import 'package:flutter/material.dart'; /// Flutter code sample for [NavigationDrawer]. void main() => runApp(const NavigationDrawerApp()); class ExampleDestination { const ExampleDestination(this.label, this.icon, this.selectedIcon); final String label; final Widget icon; final Widget selectedIcon; } const List destinations = [ ExampleDestination( 'Messages', Icon(Icons.widgets_outlined), Icon(Icons.widgets)), ExampleDestination( 'Profile', Icon(Icons.format_paint_outlined), Icon(Icons.format_paint)), ExampleDestination( 'Settings', Icon(Icons.settings_outlined), Icon(Icons.settings)), ]; class NavigationDrawerApp extends StatelessWidget { const NavigationDrawerApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, theme: ThemeData(useMaterial3: true), home: const NavigationDrawerExample(), ); } } class NavigationDrawerExample extends StatefulWidget { const NavigationDrawerExample({super.key}); @override State createState() => _NavigationDrawerExampleState(); } class _NavigationDrawerExampleState extends State { final GlobalKey scaffoldKey = GlobalKey(); int screenIndex = 0; late bool showNavigationDrawer; void handleScreenChanged(int selectedScreen) { setState(() { screenIndex = selectedScreen; }); } void openDrawer() { scaffoldKey.currentState!.openEndDrawer(); } Widget buildBottomBarScaffold() { return Scaffold( body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ Text('Page Index = $screenIndex'), ], ), ), bottomNavigationBar: NavigationBar( selectedIndex: screenIndex, onDestinationSelected: (int index) { setState(() { screenIndex = index; }); }, destinations: destinations.map( (ExampleDestination destination) { return NavigationDestination( label: destination.label, icon: destination.icon, selectedIcon: destination.selectedIcon, tooltip: destination.label, ); }, ).toList(), ), ); } Widget buildDrawerScaffold(BuildContext context) { return Scaffold( key: scaffoldKey, body: SafeArea( bottom: false, top: false, child: Row( children: [ Padding( padding: const EdgeInsets.symmetric(horizontal: 5), child: NavigationRail( minWidth: 50, destinations: destinations.map( (ExampleDestination destination) { return NavigationRailDestination( label: Text(destination.label), icon: destination.icon, selectedIcon: destination.selectedIcon, ); }, ).toList(), selectedIndex: screenIndex, useIndicator: true, onDestinationSelected: (int index) { setState(() { screenIndex = index; }); }, ), ), const VerticalDivider(thickness: 1, width: 1), Expanded( child: Column( mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ Text('Page Index = $screenIndex'), ElevatedButton( onPressed: openDrawer, child: const Text('Open Drawer'), ), ], ), ), ], ), ), endDrawer: NavigationDrawer( onDestinationSelected: handleScreenChanged, selectedIndex: screenIndex, children: [ Padding( padding: const EdgeInsets.fromLTRB(28, 16, 16, 10), child: Text( 'Header', style: Theme.of(context).textTheme.titleSmall, ), ), ...destinations.map( (ExampleDestination destination) { return NavigationDrawerDestination( label: Text(destination.label), icon: destination.icon, selectedIcon: destination.selectedIcon, ); }, ), const Padding( padding: EdgeInsets.fromLTRB(28, 16, 28, 10), child: Divider(), ), ], ), ); } @override void didChangeDependencies() { super.didChangeDependencies(); showNavigationDrawer = MediaQuery.of(context).size.width >= 450; } @override Widget build(BuildContext context) { return showNavigationDrawer ? buildDrawerScaffold(context) : buildBottomBarScaffold(); } } ```