A simple introduction to Flutter, what widgets are and how they are used to create apps. It is simple enough to be understood without previous experience making mobile apps
2. What Is Flutter
Flutter is a framework that allows developers to create
applications that run on different platforms e.g Android,
IOS, Web, Windows, Linux e.t.c from one codebase.
It uses the Dart programming language.
3. Why Use Flutter
Previously if one wanted to create an app that would be on
both Android and IOS for example one would have needed to
write two separate apps on two different codebases with 2
different languages.
This made is difficult to ensure that the apps work and feel
the same on both platforms and it would be difficult to
update the app on the different platforms.
4. Why Use Flutter
With Flutter you can now define the interface of your
application from one codebase using one language.
This makes it easier to make your application look the same
on different platforms because its all from the same code.
This makes it easier to make changes to the application
because you are only looking at one codebase.
5. Install Flutter
To install go to: https://docs.flutter.dev/get-
started/install
Select the platform you will be building the Flutter apps on
and follow the instructions.
Verify if flutter has installed correctly by running flutter
doctor -v on the terminal or command prompt
You’ll need a text editor like VS Code or an IDE like Android
Studio to write and run Flutter
7. Possible Install Issues
If you can’t run flutter doctor -v because the flutter
command is not known a possible issue is that you have not
added flutter to your PATH correctly. The solution is to try
adding flutter to your path again.
If you have issues with the Android SDK the easiest solution
is to install Android Studio and from Android Studio install
the required SDK.
If there is a problem with android licences run the command
that is recommended by flutter doctor
8. Possible Install Issues
If you don’t have chrome installed flutter doctor would
return some issues. Install chrome
10. How To Make Apps On FLutter
In Flutter everything that is shown on the screen is a
Widget. Widgets can be thought of as the parts of the UI of
your application.
13. Types Of Widgets
There are largely 3 types of widgets:
1. Widgets that show something on the screen like text or an
image.
2. Widgets that arrange things on the screen. These are
called Layout Widgets.
3. Widgets that add style like color or space between
things.
14. Widgets That Display Content
You can find a list of useful widgets at:
https://docs.flutter.dev/ui/widgets
Some common widgets include:
1. Text() - for adding text
2. Image() - for placing images
3. ElevatedButton() - for buttons
4. Form() - for creating forms
15. Layout Widgets
You can find an exhaustive list of Flutter’s layout widgets
at https://docs.flutter.dev/ui/widgets/layout
Some common layout widgets are:
1. Row() - for displaying items as a row
2. Column() - for displaying items as a column
3. ListView() - for displaying items as a scrollable column
or row
4. GridView() - to place items in a grid
5. Container() - it is used to group related widgets
16. Widgets That Add Style To A Widget
Some widgets that affect the style of your app include:
1. Color() - to give something a Color
2. Padding() - to give a padding to child element
3. Center() - to center widgets
4. Align() - to align widgets in a parent widget