May 4, 2021 Read 2 Min

5 Flutter Tips and Tricks Worth Knowing

Save your sweat and tears with these Flutter shortcuts and hacks, delivered to you from our very own developer.

flutter developer

The Flutter community has definitely grown by a mile since it was released in 2017. Known for its ability to boost productivity, this open source technology by Google has allowed app developers to create native Android and iOS apps from a single codebase and language.

To our fellow developers reading this, here’s a little treat. Here are 5 little known Flutter hacks that can speed up your development process and help you get work done faster.

Tip #1 SizedBox – Container on a diet.

Add whitespaces to your layout by using a SizedBox instead of a container. It’s lighter and has a `const` constructor, unlike a Container.

Tip #2 Refactor – Wrap widgets with other widgets (or remove them from the tree) with ease.

Right-click on a widget and hit the Refactor option, then select `Wrap with widget…` to wrap the current widget with another widget, or select `Remove this widget…` to remove it from the widget tree.

Tip #3 InheritedWidget – Send values from the top all the way down, effortlessly.

Use an `InheritedWidget` to pass values or useful information from the topmost parent widget all the way down to the innermost nested child widget, without having to do it level-by-level in the widget tree.

Tip #4 HeroAnimation – Animations that fly, in a flash.

Ever wondered how to make animations or icons that fly from one screen to another and enlarge at a particular location? Seems pretty complex, right? 

With Flutter’s HeroAnimation, all you have to do is create Hero widgets on Screen A and Screen B with the same `tag` and provide it with any kind of child widget. It can be an icon or an image, or even just a button. Then watch the magic happen.

Tip #5 `flutter pub cache repair` – Handy command to clean pub packages’ cache.

If you run into the problem of `flutter pub get` always reinstalling older versions of a particular package instead of a new one despite changing the version and even deleting the `pubspec.lock`, use the `flutter pub cache repair` command to clean out every single package in your cache and download the new versions of the packages. (Yes, if your internet speed is average, it can be a long wait.) 

Want more like this?

Subscribe to our newsletter or follow us on Instagram for more UI/UX design and development tips and tricks!