Better Flutter Menu
--
Flutter’s popup menu needed improvement
I never liked Flutter’s popup menu. It’s ugly. It’s a block of white in the corner of the screen. Does it have to be just a square like that slapped on top of the AppBar? It doesn’t look good. It looks amateurish. Why can’t it look more like the menu below on the right-hand side? That’s a little better.
The Clutter of Flutter
Another thing I don’t like about Flutter’s popup menus is the clutter. I hate the ‘Flutter clutter!’ You know what I mean. I suspect, when you were first learning Flutter, you too had to get used to those long vertical lists of parameters. Many widgets have long lists of parameters, and the widget, PopupMenuBotton, is no exception.
It lists its menu items, of course, but it also lists the settings on how the menu should appear — assigning those settings, by the way, you’ll get the ‘better appearance’ as seen in the screenshot above — at least that’s readily available. However, it also can list its anonymous functions making the clutter even longer. I mean, you don’t even see the popup menu until you tap on those three little dots in the corner of the screen, and yet its code can take up half the build() function. See below. No sir! I don’t like it.
So, you know what I did? Guess what I did. I wrote a class library and made the popup menu better for overall app development. That’s what I did. Wanna take a look? Let’s take a look.
I Like Screenshots. Tap Caption For Gists.
As always, I prefer using screenshots in my articles over gists to show concepts rather than just show code. I find them easier to work with frankly. However, you can click or tap on their captions to see the code in a gist or in Github. Tap or click on the screenshots themselves to zoom in on them for a closer look. If reading on your phone, you’ll have to then use your two fingers to expand and collapse the image. Ironically, you may find it best to read this article about mobile development on your computer rather than on your phone.
