App Structure

It consists of information about how the project structure looks like containing various folders and sub-folders inside it so that it will be easy for users to identify it.

App Structure

There are Five main folder structures in an Flutter Native app:

App: App has all the files needed for the application and the main structure in which the app is built.

common: It has some files which we reuse in app.

pages: It has all pages of project which contains UI, functions and styling of our app.

service: It has all api implementation of project.

assets: It has all icons, background images and some other images.

style: It has common style of our whole project and it also has common colors which we reuse in project.

Note: If you want more information, please refer to Flutter Getting Started.

App

add.pngadd.png - 36KB

main.dart: It is the main entry point of our app. It defines the basic structure and primary navigation of the app.

‌ In our case, we have a side menu navigation. In this file, we have defined which page would be the first one, the options and shipping of the side menu. It also helps in notifying when the platform gets ready.

Common:

It contains standard files which we are using in our project. In this case, we have defined a constant variable which is used within the app and is easy to change variable value.

base_url: 'https://restaurantrestapi.herokuapp.com/' // you can add your own database URL

Pages:

Each page has it’s a folder. And within that folder, you will find every related file for that page. This includes UI, and it is connected with the service page.

‌ Let’s get through the cart page.

Service:

Each page has it’s a folder. And within that folder, you will find every related file for that page. This contains API

Style:

t contains standard style file which we are using in this project. In our case, we have defined all the colors used within the app and is easy to change the color so you can play around and try different color schemes.

We also defined common Text style which are used within the app.

TextStyle hintStyle() {  return new TextStyle(      fontWeight: FontWeight.w400,      fontSize: 14.0,      color: Colors.white70,      letterSpacing: 1.0  );}

Last updated