I am using the observe package.
Consider this example:
class Product extends Object with ChangeNotifier {
double _price = 0.0;
#reflectable double get price => _price;
#reflectable void set price(double value) {
if (value == null) throw new ArgumentError();
_price = notifyPropertyChange(#price, price, value);
}
}
class Order extends Object with ChangeNotifier {
final ObservableList<Product> products = new ObservableList<Product>();
double get total {
double sum = 0.0;
for (var item in products) {
sum += item.price;
}
return sum;
}
}
// Synchronizes the view total with the order total.
// Or rather, I'd like it to do that.
var order = new Order();
order.changes.listen((records) {
view.total = order.total;
});
How would I rewrite this example to make it work?
I would like to be notified of any changes to the object's state, even if they happen to the list or the items of the list.
Do I have to manage change subscriptions to all items and the list itself? Inside or outside of the Order class? Through which property would I notify the change? It seems messy either way.
The elements in the ObservableList do not propagate the notification to the list that contains them. They can't because they have no reference to the list.
Also the list does not forward the notifications to the class it is referenced by.
Not really satisfying but the best I could come up with.
import 'dart:async' as async;
import 'package:observe/observe.dart';
class Product extends Object with ChangeNotifier {
double _price = 0.0;
#reflectable double get price => _price;
#reflectable void set price(double value) {
if (value == null) throw new ArgumentError();
_price = notifyPropertyChange(#price, price, value);
}
#override
String toString() => 'Product - price: $price';
}
class Order extends Object with ChangeNotifier {
final ObservableList<Product> products = new ObservableList<Product>();
// keep listeners to be able to cancel them
final List<async.StreamSubscription> subscriptions = [];
Order() {
products.changes.listen((cr) {
// only react to length changes (isEmpty, isNotempty changes are redundant)
var lengthChanges = cr.where((c) => c.name == #length);
if(lengthChanges.isNotEmpty) {
lengthChanges.forEach((lc) =>
notifyChange(lc));
// we can't know if only additions/removals were done therefore we
// cancel all existing listeners and set up new ones for all items
// after each length change
_updateProductsListeners();
}
});
// initial setup
_updateProductsListeners();
}
// cancel all product change listeners and create new ones
void _updateProductsListeners() {
print('updateListeners');
subscriptions.forEach((s) => s.cancel());
subscriptions.clear();
products.forEach((p)
=> subscriptions.add(p.changes.listen((crs) =>
crs.forEach((cr) =>
notifyPropertyChange(cr.name, cr.oldValue, cr.newValue)))));
}
double get total {
double sum = 0.0;
for (var item in products) {
sum += item.price;
}
return sum;
}
}
void main() {
// Synchronizes the view total with the order total.
// Or rather, I'd like it to do that.
var order = new Order();
order.changes.listen((records) {
//view.total = order.total;
records.forEach(print);
});
// a PathObserver example but it doesn't seem to be more convenient
var op = new PathObserver(order, 'products[3].price')..open((c) =>
print(c));
var prods = [new Product()..price = 1.0, new Product()..price = 2.0, new Product()..price = 3.0, new Product()..price= 4.0];
var prods2 = [new Product()..price = 5.0, new Product()..price = 6.0];
order.products.addAll(prods);
// use Future to allow change notification propagate between changes
new async.Future(() =>
order.products..addAll(prods2)..removeWhere((p) => p.price < 3.0))
.then((_) => new async.Future(() => order.products[3].price = 7.0));
new async.Future.delayed(new Duration(seconds: 1), () => print('done'));
}
I suggest to use something like an event bus for this where the objects that want/should to notify about something just send and event and objects that are interested in something listen for that without any knowledge of where the other object exists.
For example https://pub.dartlang.org/packages/event_bus
Another solution is to use the ListPathObserver. The class is deprecated but you can copy his code and reuse it. With that class you can listen for specific changes in the contained items. The field to watch is specified by path.
Related
I have a requirement of converting Stream<List<T>> to Stream<Map<K,T>>
I have a class
class Order
{
int id;
DateTime date;
}
I want to convert Stream<List<Order>> to Stream<Map<DateTime, List<Order>>
I want to display orders as below
12-Dec-2020
Order 1
Order 2
13-Dec-2020
Order 3
Order 4
14-Dec-2020
Order 5
Order 6
Suggestions for a better DS are welcome.
How do I do this?
Please suggest.
Thanks in advance.
Using groupListsBy from collection: ^1.15.0
K keySelector(T t) { ... }
final Stream<List<T>> source$ = ...;
final Stream<Map<K, List<T>>> result$ = source$.map((list) => list.groupListsBy(keySelector));
You can do this without any package.
First, you have to create an empty Map, then map a List<Order> to a map with a key as a date from the list item (single order) then add it to That Empty map.
Check if the date is available as a key in Map. If the date exists as a key in that map then simply add a new order to that value or else simply add a new key to the Map.
Code:
Stream<List<Order>> orders = ...;
Stream<Map<DateTime, List<Order>>> ordersByDate = {};
orders.forEach((Order order){
ordersByDate.keys.contains(order.date)
? ordersByDate.update(order.date, (oldValue) => oldValue + <Order>[order])
: ordersByDate[order.date] = [order];
});
print(ordersByDate);
//At here your ordersByDate
Let me know if it works for you.
Fold method is what you're looking for.
Example:
void main() async {
final today = DateTime.now();
final tomorrow = today.add(const Duration(days: 1));
final order1 = Order(1, today);
final order2 = Order(2, today);
final order3 = Order(3, tomorrow);
final x = await Stream
.fromIterable([order1, order2, order3])
.fold<Map<DateTime, List<Order>>>({}, (val, element) {
(val[element.date] ??= []).add(element);
// Same as:
// if (val[element.date] == null) {
// val[element.date] = [];
// }
// val[element.date]!.add(element);
return val;
});
print(x);
}
class Order
{
int id;
DateTime date;
Order(this.id, this.date);
#override
String toString() {
return 'Order(id: $id, date: $date)';
}
}
I have list from a model like this
amount:"12000"
dateTime:"19/07/2018"
detail:"Soto"
hashCode:853818549
id:1
name:"Theodorus"
I want to just select amount and add it to another list of string, but I'm always getting this error A value of type 'String' can't be assigned to a variable of type 'List<String>'. , I thinks its because im not doing it right, here is my code below
void setupList() async {
DebtDatabase db = DebtDatabase();
listCache = await db.getMyDebt();
setState(() {
filtered = listCache;
});
List<String> amount = new List<String>();
listCache.map((value) {
amount = value.amount; } );
//print(amount);
}
can anyone help me, so I can get list of ammount from this model list and then sum all the ammount?
The map function returns an iterable and you can then transform it into a list.
You should try something like this:
void setupList() async {
DebtDatabase db = DebtDatabase();
listCache = await db.getMyDebt();
setState(() {
filtered = listCache;
});
List<String> amount = listCache.map((value) => value.amount).toList();
//print(amount);
}
Trying to understand how streams work so i wrote this
class ViewModelBase{
final List<PropertyChangedRecord> _changeRecords = new List<PropertyChangedRecord>();
Stream<PropertyChangedRecord> _changes;
Stream<PropertyChangedRecord> get changes{
//lazy initialization
if(_changes==null)
_changes = new Stream<PropertyChangedRecord>.fromIterable(_changeRecords);
return _changes;
}
_raisePropertyChanged(oldValue,newValue,propertySymbol){
if(oldValue!=newValue){
_changeRecords.add(new PropertyChangedRecord(this, propertySymbol,oldValue,newValue));
}
return newValue;
}
}
class PropertyChangedRecord{
final ViewModelBase viewModel;
final Symbol propertySymbol;
final Object newValue;
final Object oldValue;
PropertyChangedRecord(this.viewModel,this.propertySymbol,this.oldValue,this.newValue);
}
and used it as
void main() {
var p = new Person('waa',13);
p.age = 33334;
p.name = 'dfa';
p.changes.listen((p)=>print(p));
p.age = 333834;
p.name = 'dfia';
}
class Person extends ViewModelBase{
String _name;
String get name => _name;
set name(String value) => _name = _raisePropertyChanged(_name,value,#name);
int _age;
int get age => _age;
set age(int value) => _age = _raisePropertyChanged(_age,value,#age);
Person(this._name,this._age);
}
and got the following exception
Uncaught Error: Concurrent modification during iteration: Instance(length:4) of '_GrowableList'
which i think is because the stream is removing items from the list while new PropertyChangedRecords are being added, how do i go around that?
The error could be caused by adding an item while the stream iterates the list.
You could use a StreamController to create the stream instead (see How to pass a callback function to a StreamController for an example).
class ViewModelBase{
//final List<PropertyChangedRecord> _changeRecords = new List<PropertyChangedRecord>();
//Stream<PropertyChangedRecord> _changes;
final StreamController _changeRecords = new StreamController<PropertyChangedRecord>();
Stream<PropertyChangedRecord> get changes => _changeRecords.stream;
_raisePropertyChanged(oldValue,newValue,propertySymbol){
if(oldValue!=newValue){
_changeRecords.add(new PropertyChangedRecord(this, propertySymbol,oldValue,newValue));
}
return newValue;
}
}
I am trying to use the observe package without having to have annotations in my Model, and only by raising notifyPropertyChange in setters, so to test i made the following test
import 'package:observe/observe.dart';
import 'dart:async';
import 'dart:math';
void main() {
var dummyWatchingModel = new DummyWatchingModel();
new Timer.periodic(new Duration(milliseconds:1000), (_){
//calls a function that set a random value to the property in the observable model
dummyWatchingModel.setModelProps();
});
}
class Model extends Observable{
int _x;
Model(this._x);
int get x=> _x;
void set x(int value){
_x = notifyPropertyChange(#_x, _x, value);
}
}
class DummyWatchingModel{
Model model = new Model(1);
final rng = new Random();
anotherModel(){
//watch for changes in model instance properties
this.model.changes.listen((List<ChangeRecord> records) {
for(ChangeRecord change in records){
print(change.toString());
}
});
}
//the callback for the timer to assign a random value model.x
setModelProps(){
model.x = rng.nextInt(100);
print('called...');
}
}
i am changing the value of a property in an instance of Model using a setter that raises notifyPropertyChange but it never listens for changes, any idea why?
I think you want to use ChangeNotifier instead of Observable.
I'm not sure about notifyPropertyChange but with Observable you normally need to call dirtyCheck to get notified about changes.
I made a small example a while ago to learn how these two work:
import 'package:observe/observe.dart';
class Notifiable extends Object with ChangeNotifier {
String _input = '';
#reflectable
get input => _input;
#reflectable
set input(val) {
_input = notifyPropertyChange(#input, _input, val + " new");
}
Notifiable() {
this.changes.listen((List<ChangeRecord> record) => record.forEach(print));
}
}
class MyObservable extends Observable {
#observable
String counter = '';
MyObservable() {
this.changes.listen((List<ChangeRecord> record) => record.forEach(print));
}
}
void main() {
var x = new MyObservable();
x.counter = "hallo";
Observable.dirtyCheck();
Notifiable notifiable = new Notifiable();
notifiable.input = 'xxx';
notifiable.input = 'yyy';
}
I'm have a settings view where I'm using MT.D to build out my UI. I just got it to read elements from a database to populate the elements in a section.
What I don't know how to do is access each elements properties or values. I want to style the element with a different background color for each item based on it's value in the database. I also want to be able to get the selected value so that I can update it in the db. Here's the rendering of the code that does the UI stuff with MT.D. I can get the values to show up and slide out like their supposed to... but, styling or adding delegates to them to handle clicks I'm lost.
List<StyledStringElement> clientTypes = SettingsController.GetClientTypes ();
public SettingsiPhoneView () : base (new RootElement("Home"), true)
{
Root = new RootElement("Settings") {
new Section ("Types") {
new RootElement ("Types") {
new Section ("Client Types") {
from ct in clientTypes
select (Element) ct
}
},
new StringElement ("Other Types")
}
Here's how I handled it below. Basically you have to create the element in a foreach loop and then populate the delegate with whatever you want to do there. Like so:
public static List<StyledStringElement> GetClientTypesAsElement ()
{
List<ClientType> clientTypes = new List<ClientType> ();
List<StyledStringElement> ctStringElements = new List<StyledStringElement> ();
using (var db = new SQLite.SQLiteConnection(Database.db)) {
var query = db.Table<ClientType> ().Where (ct => ct.IsActive == true && ct.Description != "Default");
foreach (ClientType ct in query)
clientTypes.Add (ct);
}
foreach (ClientType ct in clientTypes) {
// Build RGB values from the hex stored in the db (Hex example : #0E40BF)
UIColor bgColor = UIColor.Clear.FromHexString(ct.Color, 1.0f);
var localRef = ct;
StyledStringElement element = new StyledStringElement(ct.Type, delegate {
ClientTypeView.EditClientTypeView(localRef.Type, localRef.ClientTypeId);
});
element.BackgroundColor = bgColor;
ctStringElements.Add (element);
}
return ctStringElements;
}