A curated list of awesome cheats needed to quickly get started with flutter development.

Overview

dart-cheat-sheet

A curated list of awesome stuff needed to get started with your flutter development journey

Awesome Branch masterGitHub license

Table of Contents

String interpolation

Every language has it's own way of interpolating two ore more words or characters. In dart, you can put value of an expression inside a string as follows:

Example

   int x=6;
   int y=2;
   String sum = '${x+y}';          // result is 8
   String subtraction = '${x-y}';  // result is 4
   String upperCase = '${"hello".toUpperCase()}'; // result is HELLO
   String concatXY = '$x$y'; // result is '62'

Functions

Dart lang is an OOL(Object-oriented language), In this language, functions are objects and have a type, Function. This implies that functions can be assigned to variables or passed as args to other functions. Interestingly, you can also call an instance of a class as if it were a fuction. That's awesome, right?

Example

   String fullName(){
       String firstName = "Temidayo";
       String lastName = "Adefioye";
       return '$firstName $lastName'; // returns 'Temidayo Adefioye'
   }
   int length(String text){
       return text.length; // returns length of text
   }

The above function can be rewritten in a more concise way:

  int length(String text) => return text.length; // returns length of text

The above approach is applicable where functions contain just ONE expression. This is also referred to as shorthand syntax.

Parsing

Parsing a string to a number such as integer and double is very key. As a developer, often times I need to convert(parse) a string value coming from a server-side to a number, tryParse method comes in handy. Take a look at this code snippet:

Example

   var a = "121";
   var b = "120.56";
   var c = "100.a12";         
   var d = "abc";
   String parseA = int.tryParse(a); // result is 121
   String parseB = double.tryParse(b); // result is 120.56
   String parseC = double.tryParse(c); // result is null (that string contains invalid number)
   String parseD = double.tryParse(d); // result is null (that string contains invalid number)

List Arrays

Perhaps the most common collection in nearly every programming language is the array or ordered set of objects. Please note that Dart arrays are Lists.

Example

   var numList = [1,2,3,5,6,7];
   var countryList = ["Nigeria","United States","United Kingdom","Ghana","IreLand","Germany"];
   String numLength = numList.length; // result is 6
   String countryLength = countryList.length; // result is 6
   String countryIndex = countryList[1]; // result is 'United States'
   String numIndex = numList[0]; // result is 1

   countryList.add("Poland"); // Adds a new item to the list.

   var emailList = new List(3); // Set a fixed list size 
   var emailList = new List<String>(); // instance of a list of type String

Lambda Functions

Lambda functions provide you with a short and concise way of representing small functions. They are also referred to as Arrow functions. In dart, if you need to write quick throw away functions without necessarily naming them, lambda fucntion is all you need. With the power of this function you can do the following and more:

Example

   var numList = new List<int>.generate(5,(i) => i);
   print(numList); //result: {0,1,2,3,4}
   var loans = numList.map( (n) => "\#$n").toList();
   print(loans); // result: {#0, #1, #3, #4}

   printMsg()=> print("Hello world");

   // You can declare a state function this way in flutter
    _DashboardState createState() => _DashboardState(); 

   // How about creating a widget using lambda?
   Card makeCard(Asset assetViewModel) => Card(
         elevation: 8.0,
         margin: new EdgeInsets.symmetric(horizontal: 10.0, vertical: 6.0),
         child: Container(
           decoration: BoxDecoration(color: Colors.white),
           child: makeListTile(assetViewModel), // where makeListTile is a custom widget created already
         ),
   );

Null-aware Operators

Handling null exceptions in app development is very essential, as this allows you to create a seamless experience for your app users. Dart provides you with some handy operators for dealing with values that might be null. One is the ??= assignment operator, which assigns a value of a variable only if that variable is currently null:

Example

   int x; // The initial value of any object is null
   x ??=6;
   print(x); // result: 6

   x ??=3;
   print(x); // result is still 6

   print(null ?? 10); // result: 10. Display the value on the left if it's not null else return the value on the right

Conditional Property Access

To properly safegaurd access to a property or method of an object that might be null, put a question mark (?) before the (.)

Example

   userObject?.userName

   //The code snippet above is equivalent to following:

   (userObject !=null) ? userObject.userName : null

   //You can chain multiple uses of ?. together in a single expression

   userObject?.userName?.toString()

   // The preceeding code returns null and never calls toString() if either userObject or userObject.userName is null

Collections Literals

With literals you can create Dart's built-in lists, maps and sets without hassle.

Example

final fruitList = ["Orange","Bannana","Carrot","Apple"]; // A list of fruit
final countrySet = {"Nigeria","United States","Poland","Italy"}; // A set of country
final credMap = {
   'userName': 'temi',
   'password': 'xmen'
} // A map of user credentials

You maybe wondering why we didn't explicitly declare a type for all of the collections above. It's interesting to know that dart's type inference can assign types to these variables for you. In this case, the inferred types are List, Set and Map<String,String>.

Please note that you can choose to specify a type for your variable declaration like this:

final fruitList = <String>[];
final countrySet = <String>{};
final credMap = <String, String>{};

Arrow Syntax

Remember Lambda Functions as discussed earlier in this sheet? We used a symbol => to define our lambda expression. You can check out Lambda function section for more explanation.

Example

String _firstName = "Michael";
String _lastName = "Jones";
String _middleName = "Will";

String get fullName => '$_firstName $_middleName $_lastName'; // result: 'Michael Will Jones'

Iterations

Just like every other programming language out there, you can perform iterations in dart. Here is a for loop example

Example

for (int i=0; i<=20; i++){
   print(i); // prints 1 to 20
}

var fruitList = ["Orange","Bannana","Carrot","Apple"];
for (final fruit in fruits){
   print(fruit); // prints all types of fruit in the list
}

Map

Map can either be declared using literals or map constructor. To learn more about map declaration using literals, please go to the Collections Literals section. Here is how you can declare map using a map constructor:

Example

var user = new Map();
// To initialize the map, do this:
user['firstName'] = 'Paul';
user['lastName'] = 'Pogba';

// Result: {firstName: Paul, lastName: Pogba}


// Below are map properties

- Keys
- Values
- Length
- isEmpty
- isNotEmpty

// Below are map functions

- addAll()
- clear()
- remove()
- forEach()

Variables

Here's an example of creating a variable and initializing it:

Example

int x = 2; // explicitly typed
var p = 5; // type inferred
p = "cool"; // ops! throws an error
dynamic z = 8; // variable can take on any type
z = "cool"; // cool

// if you never intend to change a variable use final or const. Something like this:

final email = "[email protected]"; // you can't change the value
final String email = "[email protected]"; // you can't change the value

// iPhone 11 Pro max calculator using const

const qty = 5;
const totalCost = 1099 * qty;

Class

In Dart, the class keyword is used to declare a class. Here is a basic example:

Example

class Car {  
  // field 
  String engine = "E1001"; 
  // function 
  void disp() { 
     print(engine); 
  } 
}

Getters and Setters

Getters and setters are special methods that provide read and write access to an object’s properties. Each instance variable of your class has an implicit getter, and a setter if needed. In dart, you can take this even further by implementing your own getters and setters. If you've had any experience in Object-Oriented Programming you'll feel right at home. Here is a basic syntax for a class:

Example

class className {
fields;
getters/setters
constructor
methods/functions
}
class Person {
  String firstName;
  String lastName;
  double height;
  int personAge;
  int yearofBirth;
  double weight;

  int get age {
    return personAge;
  }

  void set age(int currentYear) {
    personAge = currentYear - yearofBirth;
  }

  // We can also eliminate the setter and just use a getter.
  //int get age {
  //  return DateTime.now().year - yearofBirth;
  //}

  Person({this.firstName,this.lastName,this.personAge,this.yearofBirth,this.weight});
}

We can implement Person class this way:

void main() {
 Person person = Person(firstName:"Thanos",lastName:"Rednos",yearofBirth:1990,weight:200.5);
  print(person.firstName); // output - Thanos
  print(person.lastName); // output - Rednos
  person.age = 2019;
  print(person.age); // output - 29

}

Futures: Async and Await

The async and await keywords provide a declarative way to define asynchronous functions and use their results. Remember these two basic guidelines when using async and await:

  • To define an async function, add async before the function body:
  • The await keyword works only in async functions.

Example

Future<String> login() {
 // Imagine that this function is
 // more complex and slow.
 String userName="Temidjoy";
 return
  Future.delayed(
    Duration(seconds: 4), () => userName);
}

// Asynchronous
main() async {
 print('Authenticating please wait...');
 print(await userName());
}

JSON and serialization

Most mobile and web apps use JSON for tasks such as exchanging data with a web server. With Dart support for JSON serialization and deserialization: converting Dart objects to and from JSON, data exchange is made easy in flutter development.

The following libraries and packages are useful across Dart platform:

  • dart:convert Converters for both JSON and UTF-8 (the character encoding that JSON requires).
  • package:json_serializable An easy-to-use code generation package. When you add some metadata annotations and use the builder provided by this package, the Dart build system generates serialization and deserialization code for you.
  • package:built_value A powerful, opinionated alternative to json_serializable.

You need to serialize and deserialize JSON in your Flutter project? see this example to quickly get started.

Reading and decoding a file

The code snippet below reads a file and runs two transforms over the stream. It first converts the data from UTF8 and then runs it through a LineSplitter. All lines are printed, except any that begin with a hashtag, #.

Example

import 'dart:convert';
import 'dart:io';

Future<void> main(List<String> args) async {
 var file = File(args[0]);
 var lines = utf8.decoder
     .bind(file.openRead())
     .transform(LineSplitter());
 await for (var line in lines) {
   if (!line.startsWith('#')) print(line);
 }
}
You might also like...

Flutter Tutorial - Speech To Text & Voice Recognition

Flutter Tutorial - Speech To Text & Voice Recognition

Flutter Tutorial - Speech To Text & Voice Recognition Let's build a Speech To Text Flutter app which recognizes & analyzes your words to execute comma

Nov 3, 2021

A Collection of Flutter and Dart Tips and Tricks

A Collection of Flutter and Dart Tips and Tricks

A Collection of Flutter and Dart Tips and Tricks

Dec 27, 2022

A Flutter implementation of an expandable and animated floating search bar, also known as persistent search.

A Flutter implementation of an expandable and animated floating search bar, also known as persistent search.

Material Floating Search Bar A Flutter implementation of an expandable floating search bar, also known as persistent search, similar to the ones used

Mar 3, 2022

A flexible multi select package for Flutter. Make multi select widgets the way you want.

A flexible multi select package for Flutter. Make multi select widgets the way you want.

Multi Select Flutter Multi Select Flutter is a package for creating multi-select widgets in a variety of ways. Dialog BottomSheet ChoiceChip Features

Dec 20, 2022

Animal Sounds App written in flutter for the #100daysOfCode

animalsounds A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if

Jan 9, 2022

Amazon Bookshelf Interface Design made in Flutter

amazon_ui_clone A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

Nov 25, 2021

A Flutter widget that scrolls text widget and other widget

A Flutter widget that scrolls text widget and other widget

marquee_widget A Flutter widget that scrolls Widget Text and other Widget with supported RTL. Provides many customizationsincluding custom scroll dire

Nov 21, 2022

Flutter.io - How Many People Are In Space Right Now?

Flutter.io - How Many People Are In Space Right Now?

hmpaisrn A new Flutter application. How Many People Are In Space Right Now? Google Play Store https://play.google.com/store/apps/details?id=de.bergera

Mar 16, 2021

App concept created with Flutter using Dart programming language, inspired by Multi Search By Categories.

App concept created with Flutter using Dart programming language, inspired by Multi Search By Categories.

Photography Explorer Flutter App App concept created with Flutter using Dart programming language, inspired by Multi Search By Categories. About This

Sep 28, 2022
Owner
Temidayo Adefioye
gEEKzONE... :)
Temidayo Adefioye
An awesome Flutter 3d project by Flutter_Cube package

flutter3d A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if thi

Azamatjan 1 Oct 26, 2021
It says it all. Not In Flutter Docs, a sort of underground guide to flutter app development and design.

Not In Flutter Docs It says it all. Not In Flutter Docs, a sort of underground guide to flutter app development and design. Licenses Code is under BSD

Fred Grott 56 Dec 27, 2022
Highly Subjective Roadmap to Flutter Development

Flutter Roadmap Dev Environment https://learngitbranching.js.org Language https://dart.dev/guides/language/language-tour https://dart.dev/guides/langu

Oleksandr Leuschenko 4.3k Jan 2, 2023
Learn to Code While Building Apps - The Complete Flutter Development Bootcamp

Learn to Code While Building Apps - The Complete Flutter Development Bootcamp

London App Brewery 9.3k Dec 31, 2022
Flutter tips and tricks to make the development smoother and easier

Table of Contents Custom Clippers in Flutter Check if Website is Up or Down in Dart Section Titles on ListView in Flutter Circular Progress in Flutter

Praharsh Bhatt 17 Oct 11, 2022
🎓Flutter TodoList tutorial

Todo List built with Flutter Built with Git Tutor This tutorial will walk you through the process of building of a simple todo-list with Flutter Getti

Andrei Lesnitsky 294 Dec 29, 2022
Based on Microsoft Fluent Design System and made using the help of Flutter VelocityX.

Vx Fluent UI for Flutter Based on Microsoft Fluent Design System and made using the help of Flutter VelocityX. VxFluentUI is a Flutter component libra

Pawan Kumar 14 Jan 28, 2022
Learn Flutter in 30 Days

flutter_catalog A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

Pawan Kumar 329 Dec 29, 2022
Personal Knowledge Base (PKB). Flutter Responsive Web, Desktop, Android, iOS app. MobX as state management.

PKB - Responsive Flutter Web / Desktop / Android / iOS "Personal Knowledge Base" app written on Flutter. >> View DEMO Video About project This project

Vladimir 21 Oct 10, 2022
Flutter Portfolio App Concept - Day 33

Flutter Portfolio App Concept - Day 33

Mohammad Rahmani 29 Nov 10, 2022