Discover Flutter – Week #14

The best packages that I discovered in November 2020

a snowy mountain peak against a background of a rosy sky
a snowy mountain peak against a background of a rosy sky
Photo by Jacek Dylag on Unsplash

And it’s time for coats, hats, crafts, snow, Santa Claus in the Coca-Cola commercial, and for my December recommendations for Flutter packages. Here are my top five discoveries related to this topic.

1. Alert, Alert, Great Alert Dialog!

There are various packages for alert dialogs, but I would single out this one where you can display an image or GIF next to the warning text. I don’t know if it’s because I generally like drawings and animations, but in my opinion, this has a much better effect from the user’s point of view.


Discover Flutter — Week #13

One of the most common questions in Flutter job interviews

Person taking in outdoor view at night
Person taking in outdoor view at night
Photo by Ken Cheung on Unsplash.

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

person sail-gliding in steep mountains
person sail-gliding in steep mountains
Photo by Leonardo Yip on Unsplash

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

Greet your users with a welcoming, professional splash screen when they open your app

The silhouette of a man standing by his bike at sunset.
The silhouette of a man standing by his bike at sunset.
Photo by Aziz Acharki on Unsplash

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

The best packages that I discovered in November 2020

Hiker standing on a mountain
Hiker standing on a mountain
Photo by Félix Lam on Unsplash.

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 best packages that I discovered in December 2020

Person standing in front of snowy mountains
Person standing in front of snowy mountains
Photo by Simon Migaj on Unsplash

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

Build a Flutter widget you can dismiss

Dust thrown in the wind
Dust thrown in the wind
Photo by Aziz Acharki on Unsplash.

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

Image for post
Image for post
Photo by Josh Felise on Unsplash

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

SwitchListTile Widget

Image for post
Image for post
Photo by Philipp Kämmerer on Unsplash

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


DISCOVER FLUTTER — WEEK #16

Core facts about Isolates and Event Loops

Image for post
Image for post
Photo by Mattias Olsson on Unsplash

Reading articles on this topic, I came up with the idea to single out only the core facts concerning Isolates and the Event loop as the basis of asynchronous programming in Dart.

First and foremost Dart is single thread. When we say single thread we mean the fact that Dart executes one operation at a time, so it cannot be interrupted by any other Dart code.

Isolates

When you start your Flutter app, a new thread process is created and launched. In Dart language, this thread process is called Isolate.

I would single out the next core facts about Dart…

About

Jelena Jovanoski

On my journey to become a Flutter dev I will be sharing knowledge by writing short texts about what new know-how’s I’ve learned, in the next 30 weeks.

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