I want to convert the code below into Cupertino, IOS style. But I Can't Use Drawer Menu for IOS style. Why? How can I use?

Issue

I want to make android and IOS style.

I want to convert the code below into Cupertino, IOS style.

But I Can’t Use Drawer Menu for IOS style. Why?
How can I use?

return Scaffold(
    key: _scaffoldKey,
    drawer: Drawer(),
    appBar: AppBar(
      leading: IconButton(
        onPressed: () {
          Navigator.pop(context);
        },
        icon: Icon(
          Icons.arrow_back_ios,
          color: MyColors.blue,
        ),
      ),
      centerTitle: true,
      title: Text('Test', style: MyTextStyles.appBarTitle(deviceType) ),
      actions: <Widget>[
        Builder(
          builder: (BuildContext context) => PlatformIconButton(
            onPressed: () {
              Scaffold.of(context).openDrawer();
            },
            icon: Icon(
              Icons.menu,
            )))])
    body: .........

Solution

The Drawer widget is a Material-exclusive widget, and you can’t use it directly on iOS.

You could build your own “Drawer-like” widget for iOS by replicating the build construction of a Drawer widget, but I would not recommend that, because drawers don’t have that iOS “look and feel”. As an iOS user myself, I know some very influential apps like Twitter have something that looks like a Drawer, but I think that is not the way a native iOS app would handle that kind of navigation.

What you can do instead, is having a Drawer widget for Android, and a bottom tab bar for iOS, which is a component that is way more common in iOS-styled apps. You can use the Platform class to check if your code is being executed on Android or iOS, and choose the right widget based on that.

Here is one example of such a build logic that you might find useful. I am very sorry I can’t paste the code directly, I had this screenshot from a presentation I made and I don’t remember where did I place the code for this project, but I hope you find it useful.

Answered By – drogel

Answer Checked By – Mildred Charles (FlutterFixes Admin)