Tuesday, May 23, 2023

Anatomy of flutter Appp

 Everything in Flutter app is a widget just like Leggo blocks.  We are firstly provided with a blind screen called Scafflod in which we have to stack the pre-build widgets (leggo blocks ).

Basic Anatomy

As for the container part, we can further divide them into columns and rows to display the texts or icons one wants to add to the app. 
The final Anatomy looks like this.





Now here we have further divided our container into columns and rows for text and icons to be inserted in your application which is quite easy to analyze and easy to be partitioned as they have pre-build widgets and one acts like the child of another, if we want to generate a tree for this just to be clear this is how it will look:

Tree anatomy for the above


 According to this, you can code easily and clearly for the app you want to create and use these as a child of one another and which in the language of code will look a lot easier.

If you want to take a look at how this can be coded then the images mentioned below might help you to understand better.
The code reference.

                                
The yellow one is the main parent(scaffold) for the app and the red one is just the child of the scaffold, don't worry about the image and text alignment or anything just understand the concept of how the  Flutter app has parent-child relations and how the coding looks. 

If you wanna read more related to Scaffold Class here's the official link.   Scaffold Class






1 comment:

REST API

  A n API, or  application programming interface , is a set of rules that define how applications or devices can connect to and communicate ...