Skip to content

Basic Structure

Sqflite

When using Chrome or Edge, you need to run the following command to enable the sqflite plugin.

cd app/
dart run sqflite_common_ffi_web:setup

This will generated some needed files for web version of the sqflite plugin.

Flutter Folder Structure

The following structure refers to the app folder. This folder contains the Flutter app.

lib/
  main.dart # entry point of the app
  l10n/ # localization files
    app_de.arb # German localization
    app_en.arb # English localization
  src/
    common_widgets # widgets that are used in multiple places (like a button)
    constants # constants like colors, strings, etc.
    exceptions # custom exceptions
    features # the MAIN IMPORTANT FILES for the screens, business logic, etc.
    general # general IMPORTANT files like the models and repositories for user, activity, nutrition, etc.
    routing # routing files
    utils # utility files (like logger, localizations, etc.)

All files containing .g.dart and .freezed.dart are generated files.

Common Widgets

The common_widgets folder contains widgets that are used in multiple places (like a button).

Here you can for example find the primary_button.dart file that contains the three types of Buttons:

  • ButtonMixed (With a LinearGradient -> e.g. Onboarding, Settings, etc.)
  • ButtonNutrition (Green Button -> e.g. Nutrition)
  • ButtonActivity (Blue Button -> e.g. Activity)

Constants

The constants folder contains constants like colors, strings, etc.

Important files are:

  • custom_colors.dart (contains all the colors used in the app)

You can use these colors like this:

import 'package:sky_nutrition/src/constants/custom_colors.dart';

Container(
  color: MyAppColorScheme.myPrimaryColor,
)

Features

The features already contain the empty files for the screens, business logic, etc.

features/
  activity/
    presentation/
      activity_screen.dart # the screen
  nutrition/
    presentation/
      nutrition_screen.dart # the screen
  onboarding/
    data/
      onboarding_repository.dart # the repository to store the onboarding data in the local storage
    presentation/
      onboarding_screen.dart # the screen
  progress/
    presentation/
      progress_screen.dart # the screen
  settings/
    presentation/
      settings_screen.dart # the screen

General

The general folder contains the models and repositories for user, activity, nutrition, etc.

data/
  activity_repository.dart # the repository to store the activity data in the local storage
  nutrition_repository.dart # the repository to store the nutrition data in the local storage
  user_repository.dart # the repository to store the user data in the local storage
models/
  activity.dart # the model for the activity data
  nutrition.dart # the model for the nutrition data
  user.dart # the model for the user data

Routing

The routing folder contains the routing files.

routing/
  app_router.dart # the main router
  scaffold_with_navigation.dart # the scaffold with the navigation bar (bottom/left navigation)

Getting Started

The routing, with the screens, and the onboarding screen are already configured.

The only thing you need, is to start the build_runner to generate the auto-generated files.

cd app/
flutter pub run build_runner watch -d

Localization

When you change the localization files, you need to run the following command to regenerate the localization files.

cd app/
flutter pub get