Tweet
Tweet

Slide 1

Slide 1 text

Introduction to Flutter: The New Kid in Town*

Slide 2

Slide 2 text

What is Flutter ? Flutter allows you to build beautiful native apps on iOS and Android from a single codebase.

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

1. Learning curve !! 2. Is it production ready ? 3. What about community support ? That’s nice, but ?

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

What’s under the hood Skia Dart Text Foundation Animation Painting Rendering Widgets Material Gestures Engine (C++) Framework (Dart) Cupertino Flutter Documentation “Architecture Diagrams”

Slide 8

Slide 8 text

Not just another cross platform SDK !!!

Slide 9

Slide 9 text

What is Dart ?

Slide 10

Slide 10 text

Dart ● Java like language , which make it easy to learn. ● Support both JIT and AOT compilation, which helps us to develop and iterate fast. ● It’s reactive by nature - Build-in Futures and Streams ● Compiles to native ARM

Slide 11

Slide 11 text

Everything’s a Widget Widgets are the basic building blocks. Each widget is an immutable declaration of part of the user interface. Unlike other frameworks that separate views, view controllers, layouts, and other properties, Flutter has a consistent, unified object model: the widget. A widget can define: ● a structural element (like a button or menu) ● a stylistic element (like a font or color scheme) ● an aspect of layout (like padding) ● and so on…

Slide 12

Slide 12 text

Composition > inheritance Widgets are themselves often composed of many small, single-purpose widgets that combine to produce powerful effects.

Slide 13

Slide 13 text

More on Widgets Stateless Widget constructor build Stateful Widget constructor createState A single Stateless Widget can build in many different BuildContexts A Stateful Widget creates a new State object for each BuildContext Flutter Documentation “Architecture Diagrams”

Slide 14

Slide 14 text

State lifecycle (created) initState dispose (dirty) build (clean) didUpdateConfig setState (defunct) A State object can rebuild if ... ... it receives a new configuration … it changes its internal state Flutter Documentation “Architecture Diagrams”

Slide 15

Slide 15 text

1. Download flutter package and extract it. 2. Run command to complete the installation flutter doctor [-v] 3. Download your favourite IDE and add flutter plugin to it. Done !!! Let’s get started

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

Things that needs more thoughts 1. Code organization with project. 2. Provide build support for architecturing the app like JetPack.

Slide 18

Slide 18 text

Thank you For any query/details, you can also write at [email protected]