Notifiable
A simple notifiable widget that allows updating specific widgets without updating the whole widget tree.
Notifiable Usage
final _model = TitleAndSubtitle();
final _titleChangeNotifier = Notifier();
Notifiable(
notifier: _titleChangeNotifier,
builder: (context) => Text(
_model.title,
style: const TextStyle(fontSize: 20),
),
),
TextButton(
child: Container(
width: double.infinity,
height: 30,
color: Colors.blue,
child: const Center(
child: Text(
"TAP TO CHANGE THE TITLE",
style: TextStyle(color: Colors.white),
),
),
),
onPressed: () {
_model.title = "This is the new title";
_titleChangeNotifier.notify();
},
)
class TitleAndSubtitle {
var title = "Title";
var subtitle = "Subtitle";
}
Item Notifiable Usage
final _titleChangeNotifier = ItemNotifier<String>(defaultValue: "Default title");
final _subTitleChangeNotifier = ItemNotifier<String?>(defaultValue: null);
ItemNotifiable<String>(
notifier: _titleChangeNotifier,
builder: (context, title) => Text(
title,
style: const TextStyle(fontSize: 20),
),
),
TextButton(
child: Container(
width: double.infinity,
height: 30,
color: Colors.blue,
child: const Center(
child: Text(
"TAP TO CHANGE THE TITLE",
style: TextStyle(color: Colors.white),
),
),
),
onPressed: () {
_titleChangeNotifier.notify("This is the new title");
},
),
const SizedBox(height: 60),
ItemNotifiable<String?>(
notifier: _subTitleChangeNotifier,
builder: (context, subTitle) => Text(
subTitle ?? "The subtitle is null",
style: const TextStyle(fontSize: 20),
),
),
TextButton(
child: Container(
width: double.infinity,
height: 30,
color: Colors.green,
child: const Center(
child: Text(
"TAP TO CHANGE THE SUBTITLE",
style: TextStyle(color: Colors.white),
),
),
),
onPressed: () {
_subTitleChangeNotifier.notify("This is the new subtitle");
},
),