From a15c05373607fb9f2eb8ba0cb0ebb1fdf91e302f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Archer=20St=C3=A9phane?= <2981437+stephane-archer@users.noreply.github.com> Date: Sun, 15 Dec 2024 13:01:15 +0100 Subject: [PATCH] add simple example on how to listen other providers --- .../essentials/listen_other_providers.mdx | 125 ++++++++++++++++++ 1 file changed, 125 insertions(+) create mode 100644 website/docs/essentials/listen_other_providers.mdx diff --git a/website/docs/essentials/listen_other_providers.mdx b/website/docs/essentials/listen_other_providers.mdx new file mode 100644 index 000000000..0ddb8dee9 --- /dev/null +++ b/website/docs/essentials/listen_other_providers.mdx @@ -0,0 +1,125 @@ +--- +title: listen other providers +version: 1 +--- + +import { Link } from "/src/components/Link"; +import { AutoSnippet, When } from "/src/components/CodeSnippet"; + +```dart +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; + +void main() { + runApp(const ProviderScope(child: MyApp())); +} + +final minutesProvider = NotifierProvider(() { + return MinutesNotifer(); +}); + +final secondProvider = NotifierProvider(() { + return SecondsNotifer(); +}); + +class MinutesNotifer extends Notifier { + @override + int build() { + ref.listen(secondProvider, (prev, next) { + if (prev == 59 && next == 0) { + increment(); + } + }); + return 0; + } + + void increment() { + var nextState = state; + nextState = nextState + 1; + if (nextState == 60) { + nextState = 0; + } + state = nextState; + } +} + +class SecondsNotifer extends Notifier { + @override + int build() { + return 0; + } + + void increment() { + var nextState = state; + nextState = nextState + 1; + if (nextState == 60) { + nextState = 0; + } + state = nextState; + } + + int value() { + return state; + } +} + +class MyApp extends StatelessWidget { + const MyApp({super.key}); + + @override + Widget build(BuildContext context) { + return MaterialApp( + title: 'Flutter Demo', + theme: ThemeData( + colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple), + useMaterial3: true, + ), + home: const MyHomePage(), + ); + } +} + +class MyHomePage extends ConsumerWidget { + const MyHomePage({super.key}); + + @override + Widget build(BuildContext context, WidgetRef ref) { + var secondsNotifer = ref.watch(secondProvider.notifier); + var nbMinutes = ref.watch(minutesProvider); + return Scaffold( + appBar: AppBar( + backgroundColor: Theme.of(context).colorScheme.inversePrimary, + title: const Text('The manual Clock'), + ), + body: Center( + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + const Text( + 'press the button to add seconds to the clock:', + ), + Text( + '${ref.watch(secondProvider)}', + style: Theme.of(context).textTheme.headlineMedium, + ), + if (nbMinutes != 0) + const Text( + 'number of minutes:', + ), + if (nbMinutes != 0) + Text( + '$nbMinutes', + style: Theme.of(context).textTheme.headlineMedium, + ), + ], + ), + ), + floatingActionButton: FloatingActionButton( + onPressed: secondsNotifer.increment, + tooltip: 'Increment', + child: const Icon(Icons.add), + ), + ); + } +} +```