Downloaded 115 times
Uploaded byAhmed Abu Eldahab
Flutter beyond Hello world talk
The document discusses Flutter, highlighting its unique features such as native code compilation, a single codebase for multiple platforms, and its architecture focused on rapid application development. It emphasizes the importance of widgets in Flutter, explaining the differences between stateless and stateful widgets, as well as various state management techniques. The content also covers the performance advantages of Flutter, including fast animations and sub-second reload times, encouraging developers to create beautiful user interfaces efficiently.
Flutter beyond Hello world talk
- 1. Flutter Beyond Helloworld! By : Ahmed Abu Eldahab @dahabdev
- 2. Ahmed Abu Eldahab SeniorTechnical Consultant Google Developer Expert in Flutter /Dahabdev @dahabdev
- 3. Tell me aboutyou? Developers , Designers , Mac , Linux , Windows , Web , Mobile , Android , ios ? @dahabdev
- 4.
- 5. Flutter Approach Canvas Events Location Bluetooth CameraSensors Native ARM Binary Code Services Platform Channels Flutter Widgets Cupertino Material Design
- 6. What makes Flutterunique? - Compiles to Native Code (ARM Binary code) - No reliance on OEM widgets - No bridge needed - No markup language (only Dart)
- 7.
- 8. Control every pixelon the screen Make your brand come to life Never say "no" to your designer Stand out in the marketplace Win awards with beautiful UI Expressive, beautiful UIs
- 9. Flutter support manytypes of Animations - Tween - Hero - Sliver - Transform - FadeInWidget - Animation Builder - AnimatedOpacity - Physics-based animation Beautiful Animations
- 10. Fast Brings the powerof a games engine to user experience development 60fps, GPU accelerated Compiled to native machine code
- 11. Sub-second reload times Paintyour app to life Iterate rapidly on features Test hypotheses quicker than ever More time to experiment & test features Single-codebase for faster collab 3X Productivity Gains Productive
- 13.
- 14.
- 15. ● Language andLibraries ● Packages manager https://pub.dev ● Virtual machine ● Compile to Javascript dart2js Dart is a client-optimized language for fast apps on any platform! (Web - Desktop - Mobile - Embedded)?
- 16. Everything is aWidget
- 17. Everything is aWidget
- 18. Everything is aWidget Stateless Widget is immutable widget doesn’t know anything & Gets render only once or when the parent widget changes the configuration
- 19. Everything is aWidget Stateful Widget is mutable widget which has its own properties knowing as state and it can be changed by user input or by using setState()
- 20.
- 21.
- 22.
- 23.
- 24.
- 25.
- 26.
- 27.
- 28.
- 29.
- 30.
- 31.
- 32.
- 33.
- 34. Stateless Widget Constructor Function build() StatefulWidget Constructor Function build() initState() setState() build() didUpdateWidget() dispose() Flutter Widgets
- 35. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column Text Column Element Text Element Rendered Box Rendered Box Rendered Box
- 36. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column Text Column Element Text Element Rendered Box Rendered Box Rendered Box
- 37. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column Column Element Text Element Rendered Box Rendered Box Rendered Box
- 38. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column Column Element Rendered Box Rendered Box
- 39. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box
- 40. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box
- 41. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box
- 42. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box
- 43. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box
- 44. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box Unique Key Unique Key
- 45. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box Unique Key Unique Key
- 46. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box Unique Key Unique Key
- 47. Flutter Widgets Rebuilds frequently ElementTree Render TreeWidget Tree Rarely rebuilds Rarely rebuilds Container ElementContainer Column List Column Element List Element Rendered Box Rendered Box Rendered Box Unique Key Unique Key
- 48.
- 49. Data Flow Data (State) UserInterface @dahabdev
- 50.
- 51.
- 52.
- 53.
- 54.
- 55.
- 56.
- 57.
- 58.
- 59.
- 60.
- 61.
- 62.
- 63.
- 64.
- 65.
- 66.
- 67. Scoped Model Data (State)Management
- 68.
- 69.
- 70.
- 71.
- 72.
- 73.
- 74.
- 75.
- 76.
- 77.
- 84.
- 85. Data (State )Management 1.Scoped_model 2. Provider 3. Bloc 4. Mobx 5. Redux
- 86.
- 87.
- 88.
- 89.
- 90.
- 91.
- 92. Ahmed Abu Eldahab SeniorTechnical Consultant Google Developer Expert in Flutter /Dahabdev