Architecture
The architecture used in the project is Stacked Architecture.
The architecture is very simple. It consists of 3 major pieces, everything else is up to the developer's implementation style. These pieces are:
- View: Shows the UI to the user. Single widgets also qualify as views (for consistency in terminology) a view, in this case, is not a "Page" it's just a UI representation.
- ViewModel: Manages the state of the View, business logic, and any other logic as required from user interaction. It does this by making use of the services
- Services: A wrapper of a single functionality/feature set. This is commonly used to wrap things like showing a dialog, wrapping database functionality, integrating an API, etc.
Few rules for better understanding and implementation:
- Views should never MAKE USE of services directly.
- Views should contain zero to (preferred) no logic. If the logic is from UI only items then we do the least amount of required logic and pass the rest to the ViewModel.
- Views should ONLY render the state in its ViewModel.
- ViewModels for widgets that represent page views are bound to a single View only.
- ViewModels may be re-used if the UI requires the same functionality.
- ViewModels should not know about other ViewModels. The only thing it provides is the ViewModel to View functionality along with some additional functionalities that make it easier to react to changes in services in multiple ViewModels. Thus a ViewModel of torrents list will hold the torrent data with other necessary functions for the View of torrents list in the UI.
Thus, in general the View is usually a widget layout for one screen of the app. It doesn’t contain any logic or state, though. That is contained in the View Model, which doesn’t know any specific details about the View.
So we create a new View Model for every screen on our app. The Services are accessible globally, though, so they stay the same. A multi-screen app would be structured something like this:
|
+----app
|
+----enums
|
+----models
|
+----services
| |
| +----api
| |
| +----functional_services
| |
| +----state_services
| |
| +----mock_data
| |
| +----services_info.dart
|
+----theme
|
+----ui
| |
| +----shared
| |
| +----views
| | |
| | +----download
| | |
| | +----history
| | |
| | +----settings
| | |
| | +----disk_explorer
| | |
| | +----front_page
| | |
| | +----home
| | |
| | +----login
| | |
| | +----media_player
| | |
| | +----rss_feed
| | |
| | +----rss_filters
| | |
| | +----splash
| | |
| | +----torrent_detail
| | |
| | +----torrent_list
| |
| +----widgets
| |
| +----dumb_widgets
| |
| +----smart_widgets
|
+----utils
|
+----main.dart