I have a Master-Detail page for tablet.
I want to change the details page when I select an item in the list.
So I wrote code like this,
class AttendancesModel with ChangeNotifier {
final int userId;
AttendancesModel(this.userId);
List<Attendance> attendances = [];
// do initialize
}
class AttendancesPage extends StatelessWidget {
final int userId;
AttendancesPage(this.userId);
@override
Widget build(BuildContext context) {
return ChangeNotifierProvider(
create: (_) => AttendancesModel(userId),
child: Consumer(
builder: (_, model, __) {
print('model.userId=${model.userId}')
return Scaffold(
// appbar, body, etc...
);
}
)
);
}
}
But, model received by builder is always the same value.
Therefore, changing the user selection does not change the details screen.
How can I create new Model?
Thank you.
[Edit] The UserListPage like this will notify the user selection
class UserListModel with ChangeNotifier {
List<User> users = [];
int _selectedUserId;
int get selectedUserId => _selectedUserId;
set selectedUserId(int userId) {
_selectedUserId = userId;
notifyListeners();
}
}
class UserListPage extends StatelessWidget {
Widget build(BuildContext context) {
return ChangeNotifierProvider.value(
value: Provider.of<UserListModel>(context),
child: Consumer(
builder: (_, model, __) {
return ListView.builder(
itemBuilder: (_, i) {
final user = model.users[i];
return ListTile(
title: Text(user.name),
onTap: () => model.selectedUserId = user.id,
);
},
itemCount: model.users.length
);
}
)
)
}
}
class HomePage extends StatelessWidget {
Widget build(BuildContext context) {
return ChangeNotifierProvider(
create: (_) => UserListModel(),
child: HomePageBody()
);
}
}
class HomePageBody extends StatelessWidget {
Widget build(BuildContext context) {
return Scaffold(
body: Row(
children: <Widget>[
SizedBox(width: 320, child: UserListPage()),
ChangeNotifierProvider.value(
value: Provider.of<UserListModel>(context),
child: Consumer<UserListModel>(
builder: (_, model, __) {
return AttendancePage(model.selectedUserId);
}
)
)
]
)
)
}
}