Building Pure Dart Libraries and Packages for Dart's Flutter Framework

in #utopian-io6 years ago

flutter-logo.jpg

Repository

https://github.com/flutter/flutter

What Will I Learn?

  • You will learn how to build a Dart Package for Flutter
  • You will learn about Assertion Guards for constructors
  • You will learn the difference between a Package and a Plugin
  • You will learn how use type definitions to generalize types and code
  • You will learn about the Matrix4 translation functions

Requirements

System Requirements:
OS Support for Flutter:
  • Windows 7 SP1 or later (64-bit)
  • macOS (64-bit)
  • Linux (64-bit)

Required Knowledge

  • A little understanding of libraries and plugin systems.
  • A fair understanding of Mobile development and Imperative or Object Oriented Programming
  • Some understanding of module systems

Resources for Flutter and this Project:

Sources:

Flutter Logo (Google): https://flutter.io/

Difficulty

  • Intermediate

Description

Outline and Overview

In this Flutter Video Tutorial, we build a simple pure Dart package. This Dart package aims to provide the user with an ability to dynamically create text with a shadow. The user can control the color of the shadow and the text as well as control how the text is built and rendered by using a specifically made builder function. We also add functionality that lets the user control how far the shadow will translate. After building the package, we are then able to build an example application that uses this package by relative path.

Outline for this Tutorial
Item One: Creating a Package For Flutter

There are two main types of libraries for any Flutter project; Packages and Plugins. Plugins are packages that typically give the user the ability to interface with the APIs from the host platforms such as Android and iOS. On the other hand, packages are purely built in Dart and are specifically geared towards adding more functionality to the Flutter SDK. In this example, we build a Package which creates a dynamic text shadow widget.

package-command.png

Above is the command that was used to generate the package template. We use the Flutter Create command line interface command to specify that we want to build a new flutter project. We are then able to add a --template flag which further specifies that we want to build a package from the package template. The final part of this command is the name of the package that we want to generate.

Item Two: Protecting Constructors with Meta-data and Assertion Guards

Every single widget in the Flutter SDK includes meta-data and assertion guards. These two concepts are very important when building a new widget or package for flutter because they allow you to communicate to the user in various ways. By marking a field in the constructor as @required, we tell the end-user that they must supply a value for this field for the constructor to build the widget. This also includes a null value which is why we have the assertion guards. With assertion guards, we can protect the values from being null and dynamically generate error messages that are useful to the end user. Assertions can also be used to fine tune the values that that constructor can accept.

shaded-constructor.png

Here you can see the constructor that was used to build the ShadedText widget. The top four fields, shadeBuilder, text, shadeColor and textColor are needed to construct this widget. We use the @required meta-data flag to make sure that the end-user specifies these pieces of data. This flag also tells the Dart Analyzer that these values are required and it gives a warning to the user when they aren't supplied. Below the constructor, we also have four assertions. These assertions make sure that these four fields are not null when the end-user instantiates the widget.

Item Three: Using Type Definitions to Generalize Custom Types

In Dart, a typedef is used to specify a function signature and generalize that function into a type that can be used in the application. In this way, the typedef keyword works as an alias of sorts which allows the developer to cut down verbose code. The typedef keyword also defines porters which references these function signatures in the memory of the program.

typedef.png

In our library, we use the typedef keyword to generalize the ShadeBuilder function type. This allows us to define a ShadeBuilder function as a type which can be specified in the widget class and constructor. When the user builds this widget in their program, they will know that the ShadeBuilder function requires specific parameters and also should output a Widget type.

The source code for this project can be found here

Video Tutorial

Projects and Series

Stand Alone Projects:
Building a Calculator
Movie Searcher Application

Minesweeper Game

Weather Application

Curriculum

Proof of Work Done

https://github.com/tensor-programming

Sort:  

You shared a very nice topic. The project is very comprehensive. Thank you for sharing @tensor

Thats nice. I am glad you found this contribution useful and educational.

You just received a Tier 0 upvote! Looking for bigger rewards? Click here and learn how to get them or visit us on Discord

Excellent post, very detailed, well explained and with all the necessary references. Greetings.

Glad you liked it and found it useful.

Thank you for your contribution @tensor.

Your contribution has been evaluated according to Utopian rules and guidelines, as well as a predefined set of questions pertaining to the category.
To view those questions and the relevant answers related to your post,Click here


Need help? Write a ticket on https://support.utopian.io/.
Chat with us on Discord.
[utopian-moderator]

Hey @tensor
Thanks for contributing on Utopian.
We’re already looking forward to your next contribution!

Contributing on Utopian
Learn how to contribute on our website or by watching this tutorial on Youtube.

Want to chat? Join us on Discord https://discord.gg/h52nFrV.

Vote for Utopian Witness!