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?

Question

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: .........

You can't create a Drawer when using Cupertino (iOS style). Thats because Drawer is exclusive to Material (Android style). You can check that [here](https://flutter.dev/docs/cookbook/design/drawer) — Ademir Villena Zevallos, Feb 24 '20 at 14:04
I can add. By stack or some other method. But I'm looking for a more practical easy way. — Faruk AYDIN, Feb 24 '20 at 14:20
[Check this](https://developer.apple.com/design/human-interface-guidelines/macos/windows-and-views/drawers/) about drawers on iOS. Of course you can handle a custom creation of a Drawer but there is a reason why Flutter don't provide it by default for iOS — Ademir Villena Zevallos, Feb 24 '20 at 14:24

score 0 · Accepted Answer · answered Feb 24 '20 at 16:59

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.

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?

1 Answers1