Flutter ChangeNotifier-如何动态更新或重建构造函数列表?
下面是我的代码,它大部分按预期工作(请复制粘贴所有在1省道页面,然后运行) 我有3个值变量要显示(rankOne、rankTwo和rankThree)。我想根据用户的输入更改这些值 我能够实现它,但我正在努力更新列表以在屏幕上显示新值。 如果您能抽出时间帮助我修复或重新实施,我将不胜感激Flutter ChangeNotifier-如何动态更新或重建构造函数列表?,flutter,Flutter,下面是我的代码,它大部分按预期工作(请复制粘贴所有在1省道页面,然后运行) 我有3个值变量要显示(rankOne、rankTwo和rankThree)。我想根据用户的输入更改这些值 我能够实现它,但我正在努力更新列表以在屏幕上显示新值。 如果您能抽出时间帮助我修复或重新实施,我将不胜感激 导入“包装:颤振/材料.省道”; 导入“包:provider/provider.dart”; void main(){ runApp(MyApp()); } 类MyApp扩展了无状态小部件{ //此小部件是应
导入“包装:颤振/材料.省道”;
导入“包:provider/provider.dart”;
void main(){
runApp(MyApp());
}
类MyApp扩展了无状态小部件{
//此小部件是应用程序的根。
@凌驾
小部件构建(构建上下文){
返回ChangeNotifierProvider(
创建:(上下文){
返回MyStore();
},
孩子:MaterialApp(
debugShowCheckedModeBanner:false,
标题:“ChangeNotifier Practice4”,
主题:ThemeData.dark(),
首页:时间表页(标题:“时间表”),
),
);
}
}
班级时间表{
int-id;
字符串名;
双时间值;
时间表({this.id,this.name,this.timeValue});
}
类MyStore扩展了ChangeNotifier{
列表_时间表=[];
国际人口=3;
双rankOne=20.98;
双rankTwo=15.62;
双rankThree=10.43;
MyStore(){
_时间表=[
时间表(
id:0,
名称:“任务类型A”,
时间值:rankOne,
),
时间表(
id:1,
名称:“任务类型B”,
时间值:rankTwo,
),
时间表(
id:2,
名称:“任务类型C”,
时间值:rankThree,
),
];
notifyListeners();
}
列表获取时间表=>\u时间表;
int get people=>\u people;
setNumberOfPeople(人){
_人民=人民;
交换机(人){
案例0:
双rankOne=0.0;
双rankTwo=0.0;
双rankThree=0.0;
打印(“setNumberOfPeople=0”);
打印(“$rankOne,$rankTwo,$rankThree”);
notifyListeners();
打破
案例1:
双rankOne=15.98;
双rankTwo=13.21;
双rankThree=7.92;
打印(“setNumberOfPeople=1”);
打印(“$rankOne,$rankTwo,$rankThree”);
notifyListeners();
打破
案例2:
双兰康=18.64;
双rankTwo=12.32;
双rankThree=8.76;
打印(“setNumberOfPeople=2”);
打印(“$rankOne,$rankTwo,$rankThree”);
notifyListeners();
打破
案例3:
双rankOne=20.98;
双rankTwo=15.62;
双rankThree=10.43;
打印(“setNumberOfPeople=3”);
打印(“$rankOne,$rankTwo,$rankThree”);
notifyListeners();
打破
}
}
}
类TimeSheetPage扩展StatefulWidget{
时间表页({Key-Key,this.title}):超级(Key:Key);
最后的字符串标题;
@凌驾
_TimeSheetPageState createState()=>_TimeSheetPageState();
}
类_时间表格式扩展状态{
列表编号=[
0,
1.
2.
3.
];
@凌驾
小部件构建(构建上下文){
var store=Provider.of(上下文);
返回脚手架(
appBar:appBar(
标题:文本(widget.title),
),
正文:专栏(
儿童:[
划船(
crossAxisAlignment:crossAxisAlignment.center,
mainAxisAlignment:mainAxisAlignment.center,
儿童:[
正文(
“人数:”,
样式:TextStyle(
颜色:颜色,黑色,
尺码:18,
fontWeight:fontWeight.w500,
),
),
下拉按钮(
价值观:商店,人,
onChanged:(int值){
store.setNumberOfPeople(peopleNumbers[value]);
},
项目:peopleNumber.map((int-num){
返回下拉菜单项(
值:num,
孩子:排(
儿童:[
图标(
我的朋友们,
),
大小盒子(
宽度:10,
),
正文(
num.toString(),
样式:TextStyle(颜色:Colors.black),
),
],
),
);
}).toList(),
),
],
),
ListView.builder(
收缩膜:对,
itemCount:store.timeSheet.length,
itemBuilder:(上下文,索引){
返回容器(
装饰:盒子装饰(
边界:边界(
顶部:边界侧(
颜色:颜色,黑色,
宽度:0.2,
),
底部:边界侧(
颜色:颜色,黑色,
宽度:0.2,
),
),
),
孩子:ListTile(
标题:正文(
store.timeSheet[index].name,
),
尾随:行(
mainAxisSize:mainAxisSize.min,
mainAxisAlignment:mainAxisAlignment.end,
crossAxisAlignment:crossAxisAlignment.end,
儿童:[
图标(图标。计时器),
正文(
“${store.timeSheet[index].timeValue}”,
),
],
),
onTap:(){
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return ChangeNotifierProvider(
create: (context) {
return MyStore();
},
child: MaterialApp(
debugShowCheckedModeBanner: false,
title: 'ChangeNotifier Practice4',
theme: ThemeData.dark(),
home: TimeSheetPage(title: 'Time Sheet'),
),
);
}
}
class TimeSheet {
int id;
String name;
double timeValue;
TimeSheet({this.id, this.name, this.timeValue});
}
class MyStore extends ChangeNotifier {
List<TimeSheet> _timeSheet = [];
int _people = 3;
double rankOne = 20.98;
double rankTwo = 15.62;
double rankThree = 10.43;
MyStore() {
_timeSheet = [
TimeSheet(
id: 0,
name: "Task Type A",
timeValue: rankOne,
),
TimeSheet(
id: 1,
name: "Task Type B",
timeValue: rankTwo,
),
TimeSheet(
id: 2,
name: "Task Type C",
timeValue: rankThree,
),
];
notifyListeners();
}
List<TimeSheet> get timeSheet => _timeSheet;
int get people => _people;
setNumberOfPeople(peoples) {
_people = peoples;
switch (peoples) {
case 0:
double rankOne = 0.0;
double rankTwo = 0.0;
double rankThree = 0.0;
print("setNumberOfPeople = 0");
print('$rankOne, $rankTwo, $rankThree');
notifyListeners();
break;
case 1:
double rankOne = 15.98;
double rankTwo = 13.21;
double rankThree = 7.92;
print("setNumberOfPeople = 1");
print('$rankOne, $rankTwo, $rankThree');
notifyListeners();
break;
case 2:
double rankOne = 18.64;
double rankTwo = 12.32;
double rankThree = 8.76;
print("setNumberOfPeople = 2");
print('$rankOne, $rankTwo, $rankThree');
notifyListeners();
break;
case 3:
double rankOne = 20.98;
double rankTwo = 15.62;
double rankThree = 10.43;
print("setNumberOfPeople = 3");
print('$rankOne, $rankTwo, $rankThree');
notifyListeners();
break;
}
}
}
class TimeSheetPage extends StatefulWidget {
TimeSheetPage({Key key, this.title}) : super(key: key);
final String title;
@override
_TimeSheetPageState createState() => _TimeSheetPageState();
}
class _TimeSheetPageState extends State<TimeSheetPage> {
List<int> peopleNumbers = [
0,
1,
2,
3,
];
@override
Widget build(BuildContext context) {
var store = Provider.of<MyStore>(context);
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Column(
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Number of People: ',
style: TextStyle(
color: Colors.black,
fontSize: 18,
fontWeight: FontWeight.w500,
),
),
DropdownButton<int>(
value: store.people,
onChanged: (int value) {
store.setNumberOfPeople(peopleNumbers[value]);
},
items: peopleNumbers.map((int num) {
return DropdownMenuItem<int>(
value: num,
child: Row(
children: <Widget>[
Icon(
Icons.people,
),
SizedBox(
width: 10,
),
Text(
num.toString(),
style: TextStyle(color: Colors.black),
),
],
),
);
}).toList(),
),
],
),
ListView.builder(
shrinkWrap: true,
itemCount: store.timeSheet.length,
itemBuilder: (context, index) {
return Container(
decoration: BoxDecoration(
border: Border(
top: BorderSide(
color: Colors.black,
width: 0.2,
),
bottom: BorderSide(
color: Colors.black,
width: 0.2,
),
),
),
child: ListTile(
title: Text(
store.timeSheet[index].name,
),
trailing: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Icon(Icons.timer),
Text(
'${store.timeSheet[index].timeValue}',
),
],
),
onTap: () {
print(store.timeSheet[index].timeValue);
},
),
);
},
),
],
));
}
}
class MyStore extends ChangeNotifier {
List<TimeSheet> _timeSheet = [];
int _people = 3;
double rankOne = 20.98;
double rankTwo = 15.62;
double rankThree = 10.43;
MyStore() {
_timeSheet = [
TimeSheet(
id: 0,
name: "Task Type A",
timeValue: rankOne,
),
TimeSheet(
id: 1,
name: "Task Type B",
timeValue: rankTwo,
),
TimeSheet(
id: 2,
name: "Task Type C",
timeValue: rankThree,
),
];
notifyListeners();
}
List<TimeSheet> get timeSheet => _timeSheet;
int get people => _people;
List<TimeSheet> getProductsByCategory(String category) {
this._timeSheet = [];
for (TimeSheet u in this._timeSheet) {
this._timeSheet.add(u);
}
}
void updateRank(double rankOne, double rankTwo, double rankThree) {
rankOne = rankOne;
rankTwo = rankTwo;
rankThree = rankThree;
_timeSheet = [
TimeSheet(
id: 0,
name: "Task Type A",
timeValue: rankOne,
),
TimeSheet(
id: 1,
name: "Task Type B",
timeValue: rankTwo,
),
TimeSheet(
id: 2,
name: "Task Type C",
timeValue: rankThree,
),
];
print('$rankOne, $rankTwo, $rankThree');
notifyListeners();
}
void setNumberOfPeople(int people) {
_people = people;
switch (people) {
case 0:
updateRank(0.0, 0.0, 0.0);
break;
case 1:
updateRank(15.98, 13.21, 7.92);
break;
case 2:
updateRank(18.64, 12.32, 8.76);
break;
case 3:
updateRank(20.98, 15.62, 10.43);
break;
}
}
}