Discover Flutter — Week #13

Unlike stateless widgets that we have to destroy and create again every time we want to make some change, stateful widgets have mutable state.

One of the questions that often appear in job interviews revolves around the lifecycle of a stateful widget, hence the article dedicated to this topic.

Seven Cycles of StatefulWidget

When Flutter builds a stateful widget, it first executes the constructor function of the widget and then calls the createState() method. If we look at the stateful widget, the constructor function is executed first. …

DISCOVER FLUTTER — WEEK #12

I don’t know about you, but I love having shortcuts on my phone that give me quick access to some action.

I was thinking in the direction of whether there is a widget that will provide such a look in your app and discovered the ToggleButtons widget.

DISCOVER FLUTTER — WEEK #11

Since it’s not possible to override the default splash screen, any splash-screen widget you create inside Flutter will show but only after the default splash screen — you’ll have a white screen until Flutter finishes its loading, and that’s bad design.

Our challenge now is to discover how to customize the default Flutter splash screen.

1. Prepare Your Logo Image for Different Device Dimensions

Not everyone may start from this point, but I think it’s encouraging to prepare all of the inputs and to bring the idea we have in mind to reality as closely as possible.

A great generator for all of the icons and images you need in your app, for both the iOS and Android platforms, is App Icon Generator. …

DISCOVER FLUTTER — WEEK #10

It’s time for my November recommendations for Flutter packages. Here are my top five discoveries related to this topic.

1. Graphs Are Worth More Than a Thousand Words

Before I decided to completely change the direction of my career, I was an auditor at one of the “Big 4” companies. As a former auditor, charts are a very important thing. Just as a picture is worth a thousand words, so is a chart. End-users will appreciate if your app has this feature.

There is no better library that supports pie charts, bar charts, line charts, etc. than fi_chart. It is also very easy to customize the look and feel of the graphs if your application requires data-intensive features like drawing graphics, filtering, and analytics. …

DISCOVER FLUTTER — WEEK #20

The new year is ahead of us with new goals and new wishes, but we’re still keeping the tradition acquired during the previous four months — recommendations of the best Flutter packages.

Here are my top five discoveries related to this topic.

1. Style Your Flutter Widgets Without Confusion and Make Your Code Readable

What if you want to reuse just the padding and alignment on multiple different widgets?

This package tries to decouple style from the structure, and you can easily extract the style of a widget.

The result of using this package is much more readable code.

2. Ratings Are Important

Ratings are one of the most important parts of a business in our digital age of consumerism. When we hear about a new restaurant/club/labor company, we generally hop on the internet to see reviews for that business. …

DISCOVER FLUTTER — WEEK #19

Swiping list items left or right to dismiss them is a very common UI pattern in modern apps.

The Flutter widget that provides us with this feature is called Dismissible. For this widget to work as expected, it is necessary to pass it three mandatory parameters:

• child — What we want to dismiss.
• background — What would be the background while swiping, so the widget that is stacked behind the child.
• key — It has to be unique because it controls how one widget replaces another widget in the tree.

Dismissible in Action

For a better understanding, we will go through a grocery list example
that we will make dismissible. …

DISCOVER FLUTTER — WEEK #18

In most situations, the Text widget will meet all your needs. Although if you come across a situation where you need multiple styles per line, then the Text widget is not your best friend.

Thankfully, the Flutter team has developed a RichText widget that covers such requirements.

If you want to display text that will have different fonts, color, size, etc. in the same line, use RichText with TextSpans.

For that, it is necessary to pass the tree of TextSpans to the text property, and then specify the style for each node.

It is much easier to understand and code something when we clearly see what we actually want to achieve. …

DISCOVER FLUTTER — WEEK #17

Settings section exists in every app and taking into account the fact that people like one-click features, switch buttons are always a good option.

Usually, this screen contains a list of setting options. Since it is a list and we want to present it in the form of a toggle button, the widget that provides this in one go is the SwitchListTile Widget.

SwitchListTile in a few words

SwitchListTile is similar to other list tile widgets (CheckboxListTile, RadioListTile, because this widget is a ListTile with a Switch .

Compared to the ListTile widget, it has two additional mandatory properties:

• value — boolean value that monitors the state of the button. It tells us whether this switch is checked. This property must not be null. …