/Flutter-MVVM-VS-Code-extension-Pack

VsCode extension to generate boilerplate code when using FilledStack's responsive architecture using Providers

Primary LanguageTypeScriptMIT LicenseMIT

Flutter Extensions GitHub Visual Studio Marketplace Downloads Visual Studio Marketplace Rating (Stars)

Flutter MVVM Architecture Generator Visual Studio Marketplace Version

VsCode extension to generate boilerplate code when using FilledStacks' responsive architecture using Providers

Features

Initialize Architecture

Initialize the project with the following project structure:

--root
    |-- android
    |-- build
    |-- ios
    |-- lib
        |-- core
            |-- base
                |-- base_model.dart
                |-- base_service.dart
                |-- base_view_model.dart
            |-- models
            |-- services
                |-- navigation_service.dart
            locator.dart
            logger.dart
            providers.dart
        |-- theme
        |-- views
            |-- home
                |-- home_desktop.dart
                |-- home_mobile.dart
                |-- home_tablet.dart
                |-- home_view_model.dart
                |-- home_view.dart
        |-- widgets
        main.dart
    |-- test
    |-- .gitignore
    |-- pubspec.yaml

It will also add the following dependencies to the pubspec.yaml file

  • responsive_builder: ^0.1.4
  • provider: ^3.2.0
  • logger: ^0.7.0+2
  • get_it: ^3.0.3
  • equatable: ^1.0.1

Initializing the architecture

Create View

The create view command will add a View, a ViewModel and the responsive variants for Tablet, Mobile and Desktop.

Create View

As of version 1.4.0 you can create sub folders for views.

Example

If you give parameter for class name as intro/splash/demo, the extension will create a directory structure like this

--root
    |-- android
    |-- ios
    |-- lib
        |-- core
        |-- views
            |-- intro
                |-- splash
                    |-- demo
                        |-- demo_view.dart
                        |-- demo_view_model.dart
                        |-- demo_tablet.dart
                        |-- demo_mobile.dart
                        |-- demo_desktop.dart
            |-- main.dart
        |-- theme
        |-- main.dart
    |-- test
    |-- pubspec.yaml

Create Widget

This command will create a Widget in the lib/widgets folder with the initial boilerplate and responsive variants.