Few Flutter tips & tricks you must know

Hi All, Hope you all are doing well, So today I am going to tell you a few tips & tricks in the flutter that could be useful for the developer.

Few Flutter tips & tricks you must know

Avoid Widget Rebuild by using const Constructor

When we want to prevent unwanted widget rebuilds, then use the const constructor. In the code below, the instance of BoxDecoration will remain the same even if the set state is called.

Container( 
width: 250,
height: 250,
decoration: const BoxDecoration(
borderRadius: BorderRadius.only(
bottomLeft: const Radius.circular(30.0),
bottomRight: const Radius.circular(30.0))),
child:.....);

Use Flutter Snippet

If we need to increase our speed of coding, you have to try Flutter snippets. For Example, you can create StreamBuilder widget by typing the shortcut streamBldr. You can use flutter snippet in Android studio and VS Code.

Using Flutter snippet

Use Spread Operators

Spread operator introduced with Dart 2.3 and it allows us to write UI as coding. It is very useful when we use conditions for UIs. For Example,

Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
if (age >= 18) ...[Text('You are Man')] else Text('You are Boy'),
],),
),

Also, we can write this code as below code. But Spread Operators are very useful when we have to add the nested if-else condition.

Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
age >= 18 ? Text('Man') : Text('Boy')
],),
),

Reformat code to pretty code

When we coding, we have to maintain the format of the code and it increases the readability of the code.

Example for messy code

You can see the above image and the code look like a messy one. And now you can format this code by pressing Alt+Shift+f and then the code will reformat to a pretty code like the below image.

Example for pretty code

Removing Unused Imports

Removing the unused imports is an important part of cleaning up the code. Also when we removing the unused imports, we can remove them directly instead of removing them one by one. You can easily remove unused imports using Alt+Shift+o.

Removing Unused imports

Go to Line Number

When we have to check the code by knowing the line number, we can directly go to any line number by using Ctrl+g and type the line number.

So That’s it for today. I think you learned something new from my article.

See you again soon with another article !!

Happy Coding 👽!!!

--

--

--

Undergraduate @ SUSL | Software Engineer

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Clone of Shop.com

Let’s TEST your JavaScript Code

How to Create a Simple Web Server using Node.js

Nodejs logo

Blogpost 304

10 Features of Angular 13 Every Developer Should Know

ADAMANT JS API supports Lisk

Understanding the JavaScript call stack

Track Live Coronavirus Cases in Google Sheets With Apps Script

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Yohan Malshika

Yohan Malshika

Undergraduate @ SUSL | Software Engineer

More from Medium

Bringing Life To Your Flutter Application

How to create basic app and run in Flutter using Mac OS?

Resources to Learn Flutter and Dart for Free

Which IDE is Good For Flutter Development?