What Will I Learn?
- You will learn how to refactor the widget tree in a Flutter Application into different components and variables
- You will learn how to use Input Boxes in Flutter
- You will learn how to make use of Checkboxes, Sliders and Radio Buttons
- You will learn how to use the paint debug mode in Visual Studio Code for Flutter
Requirements
- IDEA intellij or Visual Studio Code with the Dart/Flutter Plugins
- The Dart SDK and the Flutter SDK
- A fair understanding of Mobile development and Imperative or Object Oriented Programming
Difficulty
- Intermediate
Description
In this video tutorial, we build and talk about a Temperature Conversion application with Dart's Flutter Mobile Framework. We look at some of the widgets and features that we haven't talked about yet. This includes various input and feedback widgets such as the basic input box, the checkbox, the slider and the radio button. We look at how each of these widgets work in the context of our application and choose one that works the best for this application.
We also look at a different way to refactor flutter widget trees. This method was highlighted specifically because some people have mentioned that they believe flutter to be too verbose and confusing. By refactoring the widgets into smaller components and variables, we are able to isolate the behavior into chunks. This method also gives us an easier to reason about the spacial layout of the widgets in a flutter user interface. We take a quick look at the Visual Studio Code Flutter paint debug mode which lets us look at our applications and see how the flutter framework is rendering and painting each of our widgets.
The source code for this project can be found here
Video Tutorial
Curriculum
- Dart Flutter Cross Platform Chat Application Tutorial
- Building a Multi-Page Application with Dart's Flutter Mobile Framework
- Making Http requests and Using Json in Dart's Flutter Framework
- Building Dynamic Lists with Streams in Dart's Flutter Framework
- Using GridView, Tabs, and Steppers in Dart's Flutter Framework
- Using Global Keys to get State and Validate Input in Dart's Flutter Framework
- The Basics of Animation with Dart's Flutter Framework
- Advanced Physics Based Animations in Dart's Flutter Framework
- Building a Drag and Drop Application with Dart's Flutter Framework
- Building a Hero Animation and an Application Drawer in Dart's Flutter Framework
Posted on Utopian.io - Rewarding Open Source Contributors