So I created a sticky header that goes from page to page and I really like the design.
I am trying to make the hamburger icon on the left open a drawer. Below is my class widget. I have tried:onpress: () {Scaffold.of(context).openDrawer();},
I have tried turning the Container into a Scaffold, I can't keep its appearance when I make it a scaffold, and I have tried making a GlobalKey. But every where I find says that it needs to be a Scaffold for the Global key to work. is there anyway I could make a Scaffold inside of this Container because I tried to put the Container in a Scaffold and that didn't work either.
Also my main.dart imports the file this is made on and then calls the class inside the MyApp class. Thanks for the help.
class HeaderWidget extends StatelessWidget { @override Widget build(BuildContext context) { return Container( padding: const EdgeInsets.all(8.0), color: headerBackGroundColor, alignment: Alignment.center, child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: <Widget>[ // Menu icon IconButton( iconSize: 24, icon: const Icon( Icons.menu, color: headerMenuIconColor, semanticLabel: 'Main menu for navigating app.', ), onPressed: () { ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Menu icon button was pressed'))); }, tooltip: "Select an option from the menu.", ), // Search icon IconButton( iconSize: 24, icon: const Icon( Icons.search, color: headerSearchIconColor, semanticLabel: 'Search the app.', ), onPressed: () { ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Search icon button was pressed'))); }, tooltip: "Enter a search term.", ), // Share icon IconButton( iconSize: 24, icon: const Icon( Icons.share, color: headerShareIconColor, semanticLabel: 'Share this page from the app.', ), onPressed: () { ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Share icon button was pressed'))); }, tooltip: "Share this content.", ), // Weather icon IconButton( iconSize: 24, icon: const Icon( Icons.cloud, color: headerWeatherIconColor, semanticLabel:'Weather widget with temperature and sky conditions.', ), onPressed: () { ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Weather icon button was pressed'))); }, tooltip: "Set weather options.", ), ], ), ); }}
EDIT:I guess I am doing something wrong. The following is my header.dart:
import 'package:flutter/material.dart';import 'app_config.dart';final scaffoldKey = GlobalKey<ScaffoldState>();class Page extends StatelessWidget { const Page({super.key}); @override Widget build(BuildContext context) { return Scaffold( key: scaffoldKey, appBar: PreferredSize( preferredSize: const Size.fromHeight(kToolbarHeight), child: HeaderWidget(), ), drawer: const Drawer(child: Center(child: Text('Drawer'))), body: const Center(child: Text('Example Page')), ); }}class HeaderWidget extends StatelessWidget { @override Widget build(BuildContext context) { return Container( padding: const EdgeInsets.all(8.0), color: headerBackGroundColor, alignment: Alignment.center, child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: <Widget>[ // Menu icon IconButton( iconSize: 24, icon: const Icon( Icons.menu, color: headerMenuIconColor, semanticLabel: 'Main menu for navigating app.', ), onPressed: () { scaffoldKey.currentState!.openDrawer(); }, tooltip: "Select an option from the menu.", ), // Search icon IconButton( iconSize: 24, icon: const Icon( Icons.search, color: headerSearchIconColor, semanticLabel: 'Search the app.', ), onPressed: () { ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Search icon button was pressed'))); }, tooltip: "Enter a search term.", ), // Share icon IconButton( iconSize: 24, icon: const Icon( Icons.share, color: headerShareIconColor, semanticLabel: 'Share this page from the app.', ), onPressed: () { ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Share icon button was pressed'))); }, tooltip: "Share this content.", ), // Weather icon IconButton( iconSize: 24, icon: const Icon( Icons.cloud, color: headerWeatherIconColor, semanticLabel:'Weather widget with temperature and sky conditions.', ), onPressed: () { ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Weather icon button was pressed'))); }, tooltip: "Set weather options.", ), ], ), ); }}
Then I call it in my main.dart
import 'header.dart';class MyHomePage extends StatelessWidget { const MyHomePage( {super.key, required this.bootStrapInfo, required this.myAppDefines}); final BootStrapInfo bootStrapInfo; final AppDefines myAppDefines; @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(AppConfig.appName), ), body: Center( child: Column( children: [ HeaderWidget(), SplashWidget(), // Body Container Expanded( child: SingleChildScrollView(
I can not get a key to work at all. Please help!