Triple - Segmented State Pattern
Table of Contents
๐ About The Project
What is Triple?
Triple is a nickname to SSP (Segmented State Standard). Some packages were created to make it easier for developers to start using the standard. We'll call it an extension.
Segmented State Pattern (SSP)
When we talk about a single flow state, we end up solving architecture problems early, as we will have only one data flow for each state.
In addition to the maintainability and to the ease of use architecture, we also have the possibility of increasing this flow with other standards such as the Observer, which gives reactivity to the component when it is modified, and Memento, which makes it possible to revert or redo this state.
A beautiful example of a pattern with a single flow is BLoC, giving reactivity to a state allowing all transformations in that flow. This (although complicated for some), consolidates very well in the architecture of a project, even the limits of this practice are beneficial for not allowing the developer to resort to other solutions for the architecture and the standard for its resource.
There are other ways to promote reactivity in a property instead of the entire object, such as MobX's Observable and Flutter's ValueNotifier, and that gives us a lot of choices. However, we lose some important architecture limits, which can put in check the project maintenance in the future. Therefore, it needs a standard to force limits on the individual reactivity of each property and thereby improve the maintainability of the components responsible for managing the states of the application.
Triple is a nickname to SSP (Segmented State Standard). Some packages were created to make it easier for developers to start using the standard. We'll call it an extension.
This project is distributed under the MIT License. See LICENSE.txt
for more information.
โจ Usage
The SSP segments the state into 3 reactive parts, the state value (state), the error object (error), and the state loading action (loading).
These segments are observed in a listener or separate listeners. They can also be combined to obtain a new segment, always starting from the 3 main segments.
Installation
Dependencies
add the following dependencies to your pubspec.yaml
file:
dependencies:
flutter_triple: ^1.3.0
Import
Import the package in your code with:
import 'package:flutter_triple/flutter_triple.dart';
How to use?
Create a Store
Create a class that extends NotifierStore<Error, State>
.
The first type is the type of the error, the second is the type of the state.
class CounterStore extends NotifierStore<Exception, int> {
CounterStore() : super(0);
void increment() => update(state + 1);
void decrement() => update(state - 1);
}
Consume with Listeners, Builders and Consumers
Consume the store with scopes ScopedBuilder
, ScopedListener
and ScopedConsumer
.
class CounterPage extends StatefulWidget {
@override
_CounterPageState createState() => _CounterPageState();
}
class _CounterPageState extends State<CounterPage> {
final store = CounterStore();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Counter'),
),
body: ScopedBuilder<CounterStore, Exception, int>(
store: store,
onLoading: (context) => Center(child: CircularProgressIndicator()),
onError: (context, error) => Center(child: Text(error.toString())),
onState: (context, state) => Center(
child: Text(
'$state',
style: Theme.of(context).textTheme.headline4,
),
),
),
floatingActionButton: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
FloatingActionButton(
onPressed: store.decrement,
tooltip: 'Decrement',
child: Icon(Icons.remove),
),
SizedBox(width: 5),
FloatingActionButton(
onPressed: store.increment,
tooltip: 'Increment',
child: Icon(Icons.add),
),
],
),
);
}
}
๐งโ๐ป Contributing
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the appropriate tag. Don't forget to give the project a star! Thanks again!
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature
) - Commit your Changes (
git commit -m 'Add some AmazingFeature'
) - Push to the Branch (
git push origin feature/AmazingFeature
) - Open a Pull Request
Remember to include a tag, and to follow Conventional Commits and Semantic Versioning when uploading your commit and/or creating the issue.
๐ฌ Contact
Flutterando Community
๐ฅ Contributors
๐ ๏ธ Maintaned by
This fork version is maintained by Flutterando.