Let’s see how to build our first mobile application using flutter, the UI tool kit for compiling native desktop, web, mobile applications developed by Google.
The first thing to do is install Flutter, Android studio and Setup our editor, like Visualstudio code.
I have everything ready on my local machine so let’s jump into How to Write our fist flutter app.
If you need to install flutter, android studio and setup the editor follow the documentation on the flutter website for your Operative System.
Environment Setup:
https://flutter.dev/docs/get-started/install
https://flutter.dev/docs/get-started/editor#
Write your first app:
Step 1, we need to create a started flutter app.
1. Press Ctrl + shift + p and type Flutter new project
2. type a name for the new application,
as we are following the flutter docs we will call it startup_names
3. Press enter and wait for the app to install.
Step 2, we need to add an external package
Follow the guide and add the external package to the pubspec.yaml file in the project root
import the package at the top of the main.dart file, just after the material library.
https://flutter.dev/docs/get-started/codelab#step-2-use-an-external-package
Step 3, we add a stateful widget
Follow the steps to add a new stateful widget
Step 4, we create an infinite scrolling ListView
Follow the steps to add an infinite scrolling list
Step 5, Add icons to the list
Now we add an icon next to the names in the list, follow the speps
https://codelabs.developers.google.com/codelabs/first-flutter-app-pt2/#3
Step 6, Add interactivity
Here we add interactivity to our app by allowing the user to click on the icon then see a list of saved names in a separate page.
Step 7, Add a route and navigate to a new screen
Here we add a new route to show a second screen where the user can see its list of favourite names
Step 8, Change UI style adding a theme
Now we add a theme to our app so we can customise its look.
sources: