0% found this document useful (0 votes)
9 views4 pages

Document Flutter

Flutter

Uploaded by

Anh Hoai
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
9 views4 pages

Document Flutter

Flutter

Uploaded by

Anh Hoai
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

1.

2 Flutter and mobile app


How much platform development mobile app?
 Native app:
1. Android : Java, Kotlin
2. iOS : Swift, Object C
 Hybrid App : Ionic
 WebApp
 Cross-platform

Native app -Advantages


 High-performance
 High-quality for user experience
 The best choose for game, edit image, video
Native app -Defect
 Expensive for development
 Quality of the two platforms not the same
 Maintenance two sources
 ReleaseFdime not the same

Cross platform – Advantage


 Multi platform on single codebase
 Very suitable for building MVP to test the market
 Minimized for cost, time and maintenance
 Make sure the two platforms have the same quality
 Goof user experience
Cross platform -Defect
 Require native knowledge
 The native app has more performance than cross-platform
 Limitation of Framewworks.

*The performance of Flutter as same as native app

What is Flutter? Flutter front end and dart backend


 Flutter is Google’s UI toolkit for building beautiful, natively complied applications for
mobile, web, deskop, and embedded devices from single codebase

Features of Flutter

 Morden and reactive framewỏk


 Use Dart language, easy to learning
 Uniform display interface between platforms
 Lots of Widgets and easy to deep cutomization
 Suitable for modern design
 High-performance (60fps – 120fps)
 Easy to build animations
Why is Flutter the perfect choice for mobile app?
 Foundation of Flutter is Flutter Engine, build form C++ and Dart
 Skia graphics library used to rendering UI
 Multi-platform by Dart Virtual Machine (DVM) run on Mobile, Desktop and Web
 “Everything is Widget”
 Use “Declarative” to build UI

Flutter Architecture

Material Cupertino

Widgets

Framework
(Dart) Rendering

Animation Painting Gusteress

Foundation

Engine(C++)) Skia Dart Text

How flutter interacts with native components


Platform

udiozzzz Canvas
Widgets,
Rendering
Events

Native Services
code
Location Bluetooth

Platforms Audio Sensors


channels

Camera etc.
Module 2 : Componnent of Flutter.
Inspect flutter Counter App

Basic layouts in Flutter

Basic Widget in Flutter

Material and Cupertino

Application entry point and import library


Import ‘package:flutter/material.dart’;

void main(){
runApp(MyApp());
}

2.2Basic layouts in
- Everything in Flutter is Widget. Use Row and Column elements to create layout
- Row – MainAxisAlignment.
 Start
 Center
 End
 SpaceBetween
 SpaceAround
 SpaceEvenly
-Row – CrossAxisAlignment
 Start
 Center
 End
 Stretch
Expanded

Tìm hiểu 1 số Basic Widget bạn cần biết


MaterialApp Widget
 It learns on Material style guidelines
 Provides a ton of benefits that effect its entire widget sub-tree: Theme, Router,
Localization, Navigator…
 There is no drawback to using MaterialApp, even if you don’t want to use Material
Design guidelines
 Normally, it is a root of your app

Scaffold Widget
 Scaffold is designed to make applications (that follow Material guidelines) as easy as
possible to build
 Per the Flutter docs, it defines the “basic Material Design visual layout,” which
means it can make your app look like this pretty easily
 Constructor method: it has over 10 named arguments
Text
 A run of text with a single style
 The style widget is optional to decoration
Rich Text
 A run of text with a multiply style
Image
 Several cóntructions are provided:
 Image.asset(‘asset/image/dart_lang.png’)
 Image.network(‘http://edu.200lab.io/dart_lang.png)
 Image.file(File file)
ElevatedButton
 A material Design “elevated button”

2,4 Material and Cupertino


What is Material design?
-Material is a design system created by Google to helps team build-quality digital experience
for Android, iOS, Flutter and the web.
What is Cupertino design
- Clarity
- Deference
- Depth

You might also like