如何在颤振列表视图中增加每个卡片的索引?

Question

我开始与扑动，我对它与firestore数据库的工作，我有一个列表视图，其中显示一张卡我的集合的文件，但我被粘在删除按钮为他们。我想把它放在同一个卡片上，并使用一个索引，在索引上添加+1来删除文档，但我不能这样做。

我不知道我是否使用了好的方法，我链接到这篇文章的部分代码关于卡片和屏幕截图。

屏幕截图

class _ArticleDataState extends State<ArticleData> {
final index = 0;
final Stream<QuerySnapshot> _usersStream = FirebaseFirestore.instance.collection('Article').snapshots();
@override
Widget build(BuildContext context) {
return StreamBuilder<QuerySnapshot>(
stream: _usersStream,
builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
if (snapshot.hasError) {
return const Text('Something went wrong');
}
if (snapshot.connectionState == ConnectionState.waiting) {
return const Text("Loading");
}
return ListView(
children: snapshot.data!.docs.map((DocumentSnapshot document) {
Map<String, dynamic> data = document.data()! as Map<String, dynamic>;
return Card(
final index = index + 1,
elevation: 3.0,
margin: const EdgeInsets.symmetric(horizontal: 10.0, vertical: 6.0),
child: Container(
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.surface),
child: ListTile(
contentPadding: const EdgeInsets.symmetric(
horizontal: 20.0, vertical: 10.0),
title: Text(
data['name'],
style: TextStyle(
color: Theme.of(context).colorScheme.primary,
fontWeight: FontWeight.bold),
),
subtitle: Wrap(
children: <Widget>[
Text(data["text"],
overflow: TextOverflow.ellipsis,
style: TextStyle(
color: Theme.of(context).colorScheme.secondary))
],
),
trailing: IconButton(
icon: const Icon(FontAwesomeIcons.solidTrashCan,
color: Colors.blue, size: 25.0), onPressed: () {
FirebaseFirestore.instance.collection("Article").doc(snapshot.data!.docs[index].reference.id.toString()).delete().then(
(doc) => showDialog(
context: context,
builder: (BuildContext context) => _buildPopupDialog(context),
)
);
},
),
),
));
},
).toList(),
);
},
);
}
}

Answer 1

不要使用ListView，而是使用ListView。处理索引的生成器。

标准的ListView构造函数适用于小列表。工作对于包含大量项目的列表，最好使用列表视图。建筑构造函数。

与默认的ListView构造函数相反，它需要ListView.builder()构造函数一次创建所有项项目滚动到屏幕上。参考

所以把返回listView的地方改成这样:

return ListView.builder(
itemCount: snapshot.data!.docs.length,
itemBuilder: (BuildContext context, int index) {
return Card(
elevation: 3.0,
margin: const EdgeInsets.symmetric(horizontal: 10.0, vertical: 6.0),
child: Container(
decoration:
BoxDecoration(color: Theme.of(context).colorScheme.surface),
child: ListTile(
contentPadding:
const EdgeInsets.symmetric(horizontal: 20.0, vertical: 10.0),
title: Text(
data['name'],
style: TextStyle(
color: Theme.of(context).colorScheme.primary,
fontWeight: FontWeight.bold),
),
subtitle: Wrap(
children: <Widget>[
Text(data["text"],
overflow: TextOverflow.ellipsis,
style: TextStyle(
color: Theme.of(context).colorScheme.secondary))
],
),
trailing: IconButton(
icon: const Icon(FontAwesomeIcons.solidTrashCan,
color: Colors.blue, size: 25.0),
onPressed: () {
FirebaseFirestore.instance
.collection("Article")
.doc(snapshot.data!.docs[index].reference.id.toString())
.delete()
.then((doc) => showDialog(
context: context,
builder: (BuildContext context) =>
_buildPopupDialog(context),
));
},
),
),
),
);
},
);