Your best coding friend. State management, navigation management, local storage, dependency injection, cool extensions with best usages and with the support of best utilities!
Q: What should I do to make it work?
A: Just create a regular class and extend OkitoController, if you want to change the state, call update() or setState()
Q: How does these methods notify the state?
A: They have a conversation between themselves, whenever you call these methods, the notifier checks all the builders, if they are watching, they will be re-built. So the scheme is;
Model -> Controller -> Model
View -> Controller -> View
The controller is the root of them.
class CounterController extends OkitoController {
int count = 0;
void increment() => setState(() => count++);
void decrement() {
count--;
update();
}
}
CounterController counterController = CounterController();// That simple!
OkitoBuilder(
controller: counterController,
builder: () => Text('${counterController.count}'),
); main(){
// You can change state from anywhere without context!
counterController.increment();
}
// In Flutter
ElevatedButton(
onPressed: counterController.increment,
child: const Text('Increment'),
)
// Or
ElevatedButton(
onPressed: () => counterController
.setState(() => counterController.count--),
child: const Text('Decrement'),
) OkitoWatcher(
watch: counterController,
onChange: (CounterController controller) {
// You can also update the state there.
// onChange gives to you is the instance of controller.
print(controller.count);
},
);
counterController.increment();
// OkitoWatcher also returns a function that stops watching which
// reduces the memory usage, you can use it when your usage ends.
final stopWatching = OkitoWatcher(/* code here */);
// do what you want to do while watching, then:
stopWatching();Rockitos are our way to use state management with dependency injection!
If you don't know what is dependency injection, read Dependency Injection Guide first.
// Rockito - My favorite vay to use Okito state.
Rockito<CounterController>(
(controller) => Text('${controller.count}')
);
// Isn't it simple ?
// To use _Rockito_, you should first inject the CounterController.
Okito.inject(CounterController);// RockitoBuilder - Rockito but with more features and builder!
RockitoBuilder<CounterController>(
inject: CounterController(), // optionally, if you didn't inject it yet.
builder: (controller) => Text('${controller.count}'),
// You can use all of OkitoBuilder features here like otherControllers and etc.
);// Basically, you should add *Okito* to the beginning of your app or provide key/observers manually.
OkitoMaterialApp(/* Everything is same with [MaterialApp] */);
// Or
OkitoCupertinoApp(/* Everything is same with [CupertinoApp] */);
// Or
Material/CupertinoApp(
navigatorKey: Okito.navigatorKey,
navigatorObservers: [OkitoObserver()]);All of the properities has same usages with its long usage
For example: Okito.pushNamed('/secondPage') = Navigator.of(context).pushNamed('secondPage')
Okito.width;
Okito.height;
Okito.aspectRatio;
Okito.devicePixelRatio;
Okito.isLandscape;
Okito.isPortrait;
Okito.theme;
Okito.showSnackBar();
Okito.showToast(); // Snackbar without widget, usefull for simple usage.
Okito.showModal();
Okito.showDialog();
Okito.push();
Okito.pushReplacement();
Okito.pushNamed();
Okito.pushReplacementNamed();
Okito.pop();
Okito.arguments;
Okito.routeName;OkitoStorage is blazingly fast because in read operations it uses memory to get data instead of reading from disk everytime!
// To use, you should init the storage, it is not required for web but required for all other platforms.
void main() async{
// Only init is asynchronous, you can also call without await but it is not recommended.
await OkitoStorage.init();
// Usage
final box = OkitoStorage; // For easier reference.
box.write('count', 0);
final int count = box.read<int>('count');
// Simple as this!
print('Count is $count');
// Rest of your code will be here.
}Other Usages
box.watchKey('count', () =>
print('This function will be called whenever the count changes.');
);
box.watchAll(() =>
print('This function will be called whenever the storage changes.');
);
box.removeKey('count'); // Removes the key
box.readAllKeys(); // returns all keys in storage
box.readAllValues(); // returns all values in storage
box.readAll(); // returns all of the storage
box.clearStorage(); // removes everything from the storage but storage will still exists.
box.deleteStorage(); // removes the storage from file system completely, after this operation, OkitoStorage won't be able to write or read.// Check the example/flutter_okito_storage/lib/main.dart for more examples!
// It will run whenever key 'count' changes.
OkitoBuilder(
controller: yourController,
watchStorageKeys: ['count'],
builder: () => Text('${box.read('count')}'),
);- Really fast
- You can watch the changes from anywhere, even in your builders.
- It is synchronous, so you don't have to use 'await' keyword.
- You can storage Strings, ints, Maps and even Lists.
- Works on any device that flutter supports!
OkitoStorage is reliable but be careful when using it as database, because it is not created to be database. For complex works, you can try Hive!
// Context Extensions
context.width;
context.height;
context.aspectRatio;
context.devicePixelRatio;
context.isLandscape;
context.isPortrait;
context.theme;
context.arguments;
context.routeName;Dependency injection is your way to inject variables to the Okito and use it anywhere in your app. With Okito, it is as simple as it can be!
// Example Variable
class Counter(){
count = 0;
}
// Inject it
Okito.inject(Counter());
// Use it anywhere!
Okito.take<Counter>();
// Asign it with type support!
final counter = Okito.take<Counter>();
// Update however you want
counter.count++;
// or
Okito.take<Counter>().count++;// In your widgets folder or any other folder, declare builder.
OkitoBuilder CounterBuilder({
required Widget Function() builder,
}) =>
OkitoBuilder(
controller: counterController,
builder: () => builder(),
);
// Usage
CounterBuilder(builder: () => Text('${counterController.count}'));My Favorite Way
OkitoBuilder CounterBuilder({
required Widget Function(CounterController state) builder,
}) =>
OkitoBuilder(
controller: counterController,
builder: () => builder(counterController),
);
// Usage
CounterBuilder(builder: (state) => Text('${state.count}'));class CounterController extends OkitoController {
int _count = 0;
int get count => _count;
set count(int count) {
_count = count;
// Now, whenever you change count like 'count++', it will update state.
update();
}
}- okito needs tests.
- okito needs more examples.
- okito needs a better readme file :D
- okito needs reputition, likes and users!
- okito needs test with Apple products, I tested on linux, android, web and Windows