App Structure

Application source code structure.

App Structure

There are Five main folder structures in a Grocery pro customer app :

The app has all the files needed for the app and the main structure. The application has built based on this.

  • Model: It has some files which we can reuse in the app.

  • screens: It has all pages of a project which contains UI Widgets, logic functions, and styling of our app. It also contains some Widgets which we can reuse in the app.

  • service: It contains all the API implementation of the project.

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

  • style: It has a typical style of our whole project, and it also has a set of colors that we reuse throughout the project.

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

Assets

It is the Icons, Background images, and SVGs that are stored inside the assets folder. we can then use these assets to particular places on the screen when required.

Model:

It contains similar files which we are using in our project. In this case, we have defined a constant variable within the app and which also helps to change variable value.

Screens:

Each page has a folder, and within that folder, you will find every related file for that page. This includes UI Widgets, and it is connected with service files that fetch data from Backend.

Service:

You will find one service file for related screen files. It contains API call that fetches data from backends and provides it to the screens files.

Style:

It contains a similar kind of files which we are using in this project. In our case, we have defined all the colors used within the app, which helps us to change color in one place and it will get reflected throughout the projects.

Here we have one example of Text style which we can use in many places from screens where texts required similar styles.

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