Description:

simple notifier

Simplify Value Notifier Usage with simple_notifier Package #
This is a simple Flutter application that demonstrates the usage of the simple_notifier package to simplify the management of state with ValueNotifier. With the simple_notifier package, you can streamline your code and easily listen to changes in state, making state management in Flutter apps much more straightforward.


Overview #
In this example, we create a basic Flutter app that displays a counter value and allows the user to increment and reset the counter using buttons. By utilizing the simple_notifier package, we efficiently manage the counter state using ValueNotifier, and we use the ValueListenableBuilder to listen for changes and update the UI accordingly.
Prerequisites #
Make sure you have Flutter installed and set up on your development environment.
Setup #

Create a new Flutter project.
Add the simple_notifier package to your pubspec.yaml file:
dependencies:
flutter:
sdk: flutter
simple_notifier: any
copied to clipboard

Run flutter pub get to install the package.

Code Example #
import 'package:flutter/material.dart';
import 'package:simple_notifier/value_notifier_extension_test.dart';

void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
MyApp({super.key});

final _counter = 0.notifier;

@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Simple Notifier Example'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
_counter.listen(
builder: (context, value, child) {
return Text(
'Counter Value: $value',
style: const TextStyle(fontSize: 24),
);
},
),
const SizedBox(height: 20),
ElevatedButton(
onPressed: _incrementCounter,
child: const Text('Increment Counter'),
),
const SizedBox(height: 8),
ElevatedButton(
onPressed: _resetCounter,
child: const Text('Reset Counter'),
),
],
),
),
),
);
}

void _incrementCounter() {
_counter.value++;
}

void _resetCounter() {
_counter.value = 0;
}
}
copied to clipboard
The _incrementCounter and _resetCounter functions update the _counter value notifier by incrementing or resetting the counter value.
Conclusion #
In this example, we learned how to utilize the simple_notifier package to simplify the usage of ValueNotifier and manage state more efficiently in Flutter applications. We created a basic Flutter app that displays a counter value and allows users to increment and reset the counter using buttons. By using the simple_notifier package, we streamline the state management process, making it easier to manage state changes and update the UI accordingly.

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter