How to make drawer button UnClickable in Flutter - dart

Question

When my app starts, some data will load in background I don't want users to click on Drawer icon at that time, So I did something like this.
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Title'),
),
drawer: _isLoading ? null : HomeDrawer(),
body: _isLoading ? CircularProgressIndicator() : _body(),
);
}
In this case, when the app loads the drawer button is notVisible
After loading, the button comes back.
What I want is
The drawer button should be visible during loading state but it should not be clickable.

Answer 1

You can try this.
bool _isLoading = false;
GlobalKey<ScaffoldState> _key = GlobalKey();
#override
Widget build(BuildContext context) {
return Scaffold(
key: _key,
appBar: AppBar(
title: Text("App"),
leading: IconButton(
icon: Icon(Icons.menu),
onPressed: _isLoading ? null : () => _key.currentState.openDrawer(),
),
),
drawer: YourDrawer(),
);
}

Answer 2

I used the custom drawer button where I assign/remove it's onPressed event based on the _isLoaded variable. After 3 seconds since the page load I set the _isLoaded variable value to true which rerenders the page and enables the drawer button and hides the loader.
class _MyHomePageState extends State<MyHomePage> {
bool _isLoaded = false;
final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
#override
void initState() {
super.initState();
this._apiCallSample();
}
void _apiCallSample() async {
await Future.delayed(Duration(seconds: 3)).then((_) {
setState(() {
this._isLoaded = true;
});
});
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
leading: IconButton(
icon: Icon(Icons.menu),
onPressed: !this._isLoaded ? null : () => this._scaffoldKey.currentState.openDrawer(),
),
title: Text("Drawer"),
),
body: Center(
child: Builder(
builder: (BuildContext context) {
if(!this._isLoaded) {
return CircularProgressIndicator();
}
return Text("Loaded!");
},
),
),
drawer: Drawer(
child: Center(
child: Text("Drawer"),
),
),
key: this._scaffoldKey,
);
}
}
If you want to prevent the user from clicking anywhere on the page then use the AbsorbPointer.
When absorbing is true, this widget prevents its subtree from receiving pointer events by terminating hit testing at itself.