Listview 在';对话框';在颤振中不工作
我在点击按钮时触发了一个对话框,我想在其中打印一些包含从firestore获取的数据的行。'Dialog'框有一个Listview小部件,我在其中循环浏览文档快照以打印行以及前面的复选框。基本上,我希望使用复选框对所有选中的项目执行操作。但当我点击时,复选框不起作用 请帮忙!我是个新手。这是对话框的完整代码Listview 在';对话框';在颤振中不工作,listview,flutter,dart,google-cloud-firestore,dialog,Listview,Flutter,Dart,Google Cloud Firestore,Dialog,我在点击按钮时触发了一个对话框,我想在其中打印一些包含从firestore获取的数据的行。'Dialog'框有一个Listview小部件,我在其中循环浏览文档快照以打印行以及前面的复选框。基本上,我希望使用复选框对所有选中的项目执行操作。但当我点击时,复选框不起作用 请帮忙!我是个新手。这是对话框的完整代码 final snapshot = await Firestore.instance .collection('students') .where('veh
final snapshot = await Firestore.instance
.collection('students')
.where('vehicle_code', isEqualTo: _userId)
.getDocuments();
await showDialog<void>(
context: context,
builder: (BuildContext context) {
bool isChecked = false;
return Dialog(
shape:
RoundedRectangleBorder(borderRadius: new BorderRadius.circular(15)),
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
padding: EdgeInsets.all(12),
alignment: Alignment.center,
decoration: BoxDecoration(
color: Colors.grey[300],
borderRadius: new BorderRadius.only(
topLeft: const Radius.circular(15),
topRight: const Radius.circular(15)),
),
child: Text(
"Select Students",
style: TextStyle(
color: Colors.black,
fontSize: 18,
fontWeight: FontWeight.w600),
),
),
Container(
width: 300,
height: 400,
child: ListView(
//mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
for(var item in snapshot.documents )
//Text(item['first_name'])
Row(
children: [
SizedBox(
width: 100.0,
height: 100.0,
child: Image.asset('assets/newlogo.png'),
),
Text(item['first_name']),
Checkbox(
value: isChecked,
onChanged: (bool value) {
print(isChecked);
setState(() {
isChecked = value;
});
},
),
],
),
],
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
RaisedButton(
color: Colors.blue,
onPressed: () {
Navigator.of(context).pop();
},
child: Text(
'Okay',
style: TextStyle(fontSize: 18.0, color: Colors.white),
),
),
SizedBox(
width: 20,
),
RaisedButton(
color: Colors.red,
onPressed: () {
Navigator.of(context).pop();
},
child: Text(
'Cancel!',
style: TextStyle(fontSize: 18.0, color: Colors.white),
),
)
],
),
],
),
);
},
);
final snapshot=wait Firestore.instance
.collection(‘学生’)
.where('vehicle_code',isEqualTo:_userId)
.getDocuments();
等待显示对话框(
上下文:上下文,
生成器:(BuildContext上下文){
bool isChecked=false;
返回对话框(
形状:
RoundedRectangleBorder(borderRadius:新的borderRadius.circular(15)),
子:列(
mainAxisSize:mainAxisSize.min,
儿童:[
容器(
填充:边缘设置。全部(12),
对齐:对齐.center,
装饰:盒子装饰(
颜色:颜色。灰色[300],
borderRadius:仅限新的borderRadius(
左上:常数半径。圆形(15),
右上角:常数半径。圆形(15)),
),
子:文本(
“选择学生”,
样式:TextStyle(
颜色:颜色,黑色,
尺码:18,
fontWeight:fontWeight.w600),
),
),
容器(
宽度:300,
身高:400,
子:ListView(
//mainAxisAlignment:mainAxisAlignment.space,
儿童:[
for(snapshot.documents中的var项)
//文本(项目[‘名字’])
划船(
儿童:[
大小盒子(
宽度:100.0,
高度:100.0,
子项:Image.asset('assets/newlogo.png'),
),
文本(项目['名字]),
复选框(
值:已检查,
一旦更改:(布尔值){
打印(已检查);
设置状态(){
isChecked=值;
});
},
),
],
),
],
),
),
划船(
mainAxisAlignment:mainAxisAlignment.center,
crossAxisAlignment:crossAxisAlignment.end,
儿童:[
升起的按钮(
颜色:颜色,蓝色,
已按下:(){
Navigator.of(context.pop();
},
子:文本(
“好的”,
样式:TextStyle(字体大小:18.0,颜色:Colors.white),
),
),
大小盒子(
宽度:20,
),
升起的按钮(
颜色:颜色,红色,
已按下:(){
Navigator.of(context.pop();
},
子:文本(
‘取消!’,
样式:TextStyle(字体大小:18.0,颜色:Colors.white),
),
)
],
),
],
),
);
},
);
您可以移出isChecked
并使用StatefulBuilder
您仍然需要使用
List isCheckList
来控制复选框但这取决于您的设计
代码片段
bool isChecked = false;
void _incrementCounter() async {
await showDialog<void>(
context: context,
builder: (BuildContext context) {
return StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return Dialog(
bool isChecked=false;
void _incrementCounter()异步{
等待显示对话框(
上下文:上下文,
生成器:(BuildContext上下文){
返回状态生成器(
生成器:(BuildContext上下文,StateSetter setState){
返回对话框(
工作演示
完整测试代码
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
List<Map> snapshot = [
{"first_name": "abc"},
{"first_name": "def"}
];
bool isChecked = false;
void _incrementCounter() async {
await showDialog<void>(
context: context,
builder: (BuildContext context) {
return StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return Dialog(
shape: RoundedRectangleBorder(
borderRadius: new BorderRadius.circular(15)),
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
padding: EdgeInsets.all(12),
alignment: Alignment.center,
decoration: BoxDecoration(
color: Colors.grey[300],
borderRadius: new BorderRadius.only(
topLeft: const Radius.circular(15),
topRight: const Radius.circular(15)),
),
child: Text(
"Select Students",
style: TextStyle(
color: Colors.black,
fontSize: 18,
fontWeight: FontWeight.w600),
),
),
Container(
width: 300,
height: 400,
child: ListView(
//mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
for (var item in snapshot)
//Text(item['first_name'])
Row(
children: [
/*SizedBox(
width: 100.0,
height: 100.0,
child: Image.asset('assets/newlogo.png'),
),*/
Text(item['first_name']),
Checkbox(
value: isChecked,
onChanged: (bool value) {
print(isChecked);
setState(() {
isChecked = value;
});
},
),
],
),
],
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
RaisedButton(
color: Colors.blue,
onPressed: () {
Navigator.of(context).pop();
},
child: Text(
'Okay',
style:
TextStyle(fontSize: 18.0, color: Colors.white),
),
),
SizedBox(
width: 20,
),
RaisedButton(
color: Colors.red,
onPressed: () {
Navigator.of(context).pop();
},
child: Text(
'Cancel!',
style:
TextStyle(fontSize: 18.0, color: Colors.white),
),
)
],
),
],
),
);
},
);
});
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.display1,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
导入“包装:颤振/材料.省道”;
void main()=>runApp(MyApp());
类MyApp扩展了无状态小部件{
//此小部件是应用程序的根。
@凌驾
小部件构建(构建上下文){
返回材料PP(
标题:“颤振演示”,
主题:主题数据(
主样本:颜色。蓝色,
),
主页:MyHomePage(标题:“颤振演示主页”),
);
}
}
类MyHomePage扩展StatefulWidget{
MyHomePage({Key,this.title}):超级(Key:Key);
最后的字符串标题;
@凌驾
_MyHomePageState createState()=>\u MyHomePageState();
}
类_MyHomePageState扩展状态{
int _计数器=0;
列表快照=[
{“名字”:“abc”},
{“名字”:“def”}
];
bool isChecked=false;
void _incrementCounter()异步{
等待显示对话框(
上下文:上下文,
生成器:(BuildContext上下文){
返回状态生成器(
生成器:(BuildContext上下文,StateSetter setState){
返回对话框(
形状:圆形矩形边框(
边界半径:新边界半径。圆形(15)),
子:列(
mainAxisSize:mainAxisSize.min,
儿童:[
容器(
填充:边缘设置。全部(12),
对齐:对齐.center,
装饰:盒子装饰(
颜色:颜色。灰色[300],
borderRadius:仅限新的borderRadius(