Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/flutterando/value_notifier_plus
ValueNotifierPlus é um pacote que expande as funcionalidades de ValueNotifier do Flutter.
https://github.com/flutterando/value_notifier_plus
Last synced: about 2 months ago
JSON representation
ValueNotifierPlus é um pacote que expande as funcionalidades de ValueNotifier do Flutter.
- Host: GitHub
- URL: https://github.com/flutterando/value_notifier_plus
- Owner: Flutterando
- License: mit
- Created: 2024-07-10T01:52:55.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2024-07-29T15:34:35.000Z (5 months ago)
- Last Synced: 2024-08-23T09:38:11.824Z (5 months ago)
- Language: C++
- Homepage: https://pub.dev/packages/value_notifier_plus
- Size: 332 KB
- Stars: 2
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Value Notifier Plus
[![License: MIT][license_badge]][license_link]
`ValueNotifierPlus` é um pacote que expande as funcionalidades de `ValueNotifier` do Flutter, oferecendo uma alternativa ao `Cubit` utilizando `ValueNotifier` em vez de `Streams`. `ValueNotifier` é mais eficiente em termos de desempenho porque não precisa lidar com a complexidade de um sistema de fluxo assíncrono. Isso pode ser importante em cenários de alta frequência de atualização de UI.
## Instalação
Adicione o `ValueNotifierPlus` ao seu arquivo `pubspec.yaml`:
```yaml
dependencies:
value_notifier_plus: ^x.x.x
```
## O que é o `ValueNotifierPlus`
O `ValueNotifierPlus` é uma classe que estende o `ValueNotifier` padrão do Flutter, adicionando capacidades adicionais como estados imutáveis e integração simplificada com a árvore de widgets. Ele facilita o gerenciamento de estado de forma mais eficiente e menos verbosa, sem a necessidade de streams e eventos complexos.
## Widgets do `ValueNotifierPlus`
### `BuilderPlus`
O `BuilderPlus` é um widget que reconstrói sua árvore de widgets sempre que o valor do `ValueNotifierPlus` muda. É similar ao `BlocBuilder` do pacote `flutter_bloc`.
#### Exemplo de Uso:
```dart
import 'package:flutter/material.dart';
import 'value_notifier_plus.dart';
class CounterNotifier extends ValueNotifierPlus {
CounterNotifier() : super(0);
void increment() => emit(state + 1);
void decrement() => emit(state - 1);
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return PlusProvider(
provider: CounterNotifier(),
child: MaterialApp(
home: CounterPage(),
),
);
}
}
class CounterPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
final counterNotifier = context.of();
return Scaffold(
appBar: AppBar(title: Text('ValueNotifierPlus Example')),
body: Center(
child: BuilderPlus(
notifier: counterNotifier,
builder: (context, state) {
return Text('Counter: $state');
},
),
),
floatingActionButton: FloatingActionButton(
onPressed: counterNotifier.increment,
child: Icon(Icons.add),
),
);
}
}
```
**Para controlar com precisão quando a função `builder` é chamada, pode-se fornecer opcionalmente um `buildWhen`. O `buildWhen` recebe o estado anterior e o estado atual do `ValueNotifierPlus` e retorna um booleano. Se `buildWhen` retornar verdadeiro, `builder` será chamado com o `state` e o widget será reconstruído. Se `buildWhen` retornar falso, `builder` não será chamado com o `state` e nenhuma reconstrução ocorrerá.**
```dart
BuilderPlus(
notifier: counterNotifier,
buildWhen: (previousState, state) {
// retorna true/false para determinar quando
// reconstruir o widget com o novo estado.
return state > previousState + 2;
},
builder: (context, state) {
return Text('Counter: $state');
},
),
```
### `ListenerPlus`
O `ListenerPlus` é um widget que executa uma função sempre que o valor do `ValueNotifierPlus` muda, sem reconstruir a árvore de widgets. É similar ao `BlocListener` do pacote `flutter_bloc`.
#### Exemplo de Uso:
```dart
import 'package:flutter/material.dart';
import 'value_notifier_plus.dart';
class CounterPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
final counterNotifier = context.of();
return Scaffold(
appBar: AppBar(title: Text('ValueNotifierPlus Example')),
body: Center(
child: ListenerPlus(
notifier: counterNotifier,
listener: (context, state) {
if (state == 10) {
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Reached 10!')));
}
},
child: ListenerPlus(
notifier: counterNotifier,
builder: (context, state) {
return Text('Counter: $state');
},
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
counterNotifier.increment();
},
child: Icon(Icons.add),
),
);
}
}
```
### `ConsumerPlus`
O `ConsumerPlus` combina a funcionalidade de `ValueNotifierPlusListener` e `ValueNotifierPlusBuilder`, permitindo ouvir e reconstruir a árvore de widgets em resposta a mudanças de estado. É similar ao `BlocConsumer` do pacote `flutter_bloc`.
#### Exemplo de Uso:
```dart
import 'package:flutter/material.dart';
import 'value_notifier_plus.dart';
class CounterPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
final counterNotifier = context.of();
return Scaffold(
appBar: AppBar(title: Text('ValueNotifierPlus Example')),
body: Center(
child: ConsumerPlus(
notifier: counterNotifier,
listener: (context, state) {
if (state == 10) {
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Reached 10!')));
}
},
builder: (context, state) {
return Text('Counter: $state');
},
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
counterNotifier.increment();
},
child: Icon(Icons.add),
),
);
}
}
```
### `ListenersPlus e ProvidersPlus`
O `ListenersPlus e ProvidersPlus` permite registrar múltiplos listeners e providers para diferentes `ValueNotifierPlus` ao mesmo tempo, simplificando o código quando há vários observadores. É similar ao `MultiBlocListener e MultiBlocProvider` do pacote `flutter_bloc`.
#### Exemplo de Uso:
```dart
import 'package:flutter/material.dart';
import 'value_notifier_plus.dart';
class CounterNotifier extends ValueNotifierPlus {
CounterNotifier() : super(0);
void increment() => emit(state + 1);
void decrement() => emit(state - 1);
}
class AnotherNotifier extends ValueNotifierPlus {
AnotherNotifier() : super(0);
void increment() => emit(state + 1);
void decrement() => emit(state - 1);
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return ProvidersPlus(
providers: [
CounterNotifier(),
AnotherNotifier(),
],
child: Builder(
builder: (context) {
return const MaterialApp(
home: CounterPage(),
);
},
),
);
}
}
class CounterPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
final counterNotifier = context.of();
final anotherNotifier = context.of();
return Scaffold(
appBar: AppBar(title: Text('ValueNotifierPlus Example')),
body: Center(
child: ListenersPlus(
listeners: [
ListenerPlus(
notifier: counterNotifier,
listener: (context, state) {
if (state == 5) {
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Counter Reached 5!')));
}
},
child: Container(),
),
ListenerPlus(
notifier: anotherNotifier,
listener: (context, state) {
if (state == 10) {
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('AnotherNotifier Reached 10!')));
}
},
child: Container(),
),
],
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
BuilderPlus(
notifier: counterNotifier,
builder: (context, state) {
return Text('Counter: $state');
},
),
BuilderPlus(
notifier: anotherNotifier,
builder: (context, state) {
return Text('AnotherNotifier: $state');
},
),
],
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
counterNotifier.increment();
anotherNotifier.increment();
},
child: Icon(Icons.add),
),
);
}
}
```
## Observador
Você pode adicionar um observador para monitorar mudanças de estado nos `ValueNotifierPlus`:
```dart
import 'package:flutter/material.dart';
import 'value_notifier_plus.dart';
class MyObserver extends ObserverPlus {
@override
void onChange(
ValueNotifierPlusType notifier,
Object? state,
) {
print('State changed to $state');
}
}
void main() {
ValueNotifierPlus.observer = MyObserver();
runApp(MyApp());
}
```
## Testes
Para rodar os testes, execute o seguinte comando no terminal:
```bash
flutter test
```
## Contribuições
Contribuições são bem-vindas! Por favor, abra um pull request ou uma issue no GitHub se encontrar algum problema ou tiver sugestões de melhorias.
## Licença
Este projeto está licenciado sob a licença MIT. Veja o arquivo [LICENSE](LICENSE) para mais detalhes.
[flutter_install_link]: https://docs.flutter.dev/get-started/install
[github_actions_link]: https://docs.github.com/en/actions/learn-github-actions
[license_badge]: https://img.shields.io/badge/license-MIT-blue.svg
[license_link]: https://opensource.org/licenses/MIT