vijaycreations
Published in

vijaycreations

Value Notify Listener | Change Notifier — Flutter

In this article we will be discussing about how to get notified whenever there is a change in value within the widget tree. With the help of this change notifier we can rebuild the parent widget whenever a change is detected inside the child widget, thereby updating the state of the entire widget tree with the new value.

Video Tutorial:

Implementation

  • First let’s create a class that contains all the variables for which the notifier needs to be added.

In our case, we need to change the amount value whenever the count variable gets altered. So we have added a valueNotifier to the count variable alone.

The (1) given inside the brackets in line no:3 👆 is the default value what we need to have initially for our count variable.

(if the count is 1 then the amount is 75, if the count gets incremented to 2, then the amount should also be update to 150)

  • Now wrap the parent widget with the ValueListenableBuilder to get notified of any value change that happens inside the child widget.
  • Now we can use the count and amount variables anywhere inside our widget tree. (to access the count variable, make use of the value property.[ i.e, homepagedecl.count.value ]).

Let’s now modify the count value on button press event.

onPressed: () {
homepagedecl.count.value += 1
},

The relation between the count and amount (in our case) is defined as follows.,

homepagedecl.amount = homepagedecl.count.value * 75;

Hence whenever the count variable gets modified the parent widget is notified about the change, therefore re-renders the widget tree with the updated value of both amount and count

Well… that’s it., We have successfully implemented Value Notifier in our Flutter app. Run the app to see Value Notifier in action.🥳

👨‍💻Get the complete Source Code here 👉🏻: https://github.com/vijayinyoutube/furniture_app---Value-Notifier

If you found this article useful and wish to support my work, you can consider buying me a coffee.👇

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Vijay R

Vijay R

167 Followers

Hai👋 I’m a flutter developer experienced in designing and developing stunning mobile apps. Reach out for freelance projects: vijaycreations02@gmail.com