Connect with us

Get more updates and further details about your project right in your mailbox.

Thank you!
Oops! Something went wrong while submitting the form.
April 9, 2024

Flutter Packages That Make the Development Experience Easy

The best time to establish protocols with your clients is when you onboard them.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Flutter is enriched with a lot of packages which makes the development experience easy. With the growing number of packages, I’ll share some of the packages that stand out in specific scenarios.

In this blog, we are gonna look at such Flutter/Dart packages that will help programmers improve productivity.

We are gonna look into the following packages:

  • Form Builder
  • Deepcopy
  • Gap
  • Dio
  • Timeline tile

Form Builder

When working with an application that contains a lot of forms, it is tedious to create forms and form fields manually. This is where flutter_form_builder comes in.

This package provides a lot of useful built-in form fields such as checkboxes, grouped checkboxes, dropdowns, and many more. It also provides us with predefined validations which makes the coding experience much more efficient.

Install the package: flutter_form_builder

In the same way, we can configure custom form fields as well.

Deepcopy

There are two types in which programming languages copy data:

  • deep copy — Will create a new instance of the object that we copy so the new data will be in a new memory space (pass by value).
  • shallow copy — Uses the same instance even if we copy, so the new data is in the same memory space (pass by reference).

Flutter uses shallow copy for Map, List, and Set. Meaning that it uses the same memory space.

Output:

a: {name: teddy, age: 23}

b: {name: teddy, age: 23}

This is beneficial in some cases where we can just use the same memory space, and in some cases we need the data to be deep copied. so that we can manipulate the copied data without affecting the original data.

We can deep copy using JSON decode/encode. But in some cases where we have form data in the object, we cannot make a deep copy using JSON decode/encode.

Flutter doesn’t give a method to make deep copies. This is where the deepcopy package comes in.

This package helps us to make deep copies of a map, list, or set even with nested structures.

Now, let’s get into an example:

Install the package: deepcopy

Output:

a: {name: tom, age: 23}

b: {name: teddy, age: 23}

Gap

When developing Flutter applications we tend to use SizedBox a lot, where we have to pass height or width depending upon whether it’s inside Column or Row.

In the case of Column we use height, using width here makes no sense.

Here we are using a Column with 2 Containers and a SizedBox separating them with a height of 10. In the case of Row here we will use width to separate them.

Instead of mentioning height and width for Column and Row respectively we can use a Gap package to make things easy.

Gap identifies whether it’s inside a Column or Row we just have to pass the value

Here Gap knows it’s inside a Column and it changes the height accordingly.

Package link: gap

Dio

Dio is a package that overcomes the limitations of the Http package developed by Dart developers. Http provides us with all the HTTP methods but it doesn’t have features like error handling, etc.

Http is a good choice when we work with small-scale applications as it is a little bit faster than Dio.

When working with large-scale applications dio provides us with a lot of implementations that we have to do manually in Http. Let’s look into the concept of interceptor which dio provides.

An interceptor is nothing but intercepting the requests and responses to perform some actions. This will be useful for logging, error handling, etc.

Install the package: dio

The structure of the dio interceptor is as follows:

To add this interceptor to dio, In the API service add the interceptor to the dio object.

dio provides us with numerous things to do. explore more here.

CodeStax.Ai
Profile
April 8, 2024
-
6
min read
Subscribe to our newsletter
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Share this article:

More articles