gpt4 book ai didi

dart - Flutter - 列出图 block 或卡片分隔符

转载 作者:IT王子 更新时间:2023-10-29 07:20:27 27 4
gpt4 key购买 nike

我正在从 Firestore 数据库构建 ListView 。我最初想用 ListTiles 分隔我的项目,因为我知道它们可以做分隔符,但我没有从图 block 中获得我想要的高度,所以我转向透明卡片。

问题是我不知道如何在每张卡片后添加分隔符。

到目前为止,这是我的代码

Widget build(BuildContext context) {
if (snapshot == null) return CircularProgressIndicator();
return Scaffold(
body: ListView.builder(
itemCount: snapshot.length,
itemBuilder: (context, index){
return Card(
elevation: 0,
color: Colors.transparent,
child: Row(
children: <Widget>[
Padding(padding: EdgeInsets.all(10.0),),
Column(
children: <Widget>[
Padding(padding: EdgeInsets.all(10.0),),
Text(snapshot[index].data["month"], style:
TextStyle(fontSize: 30, fontWeight:
FontWeight.w300),),
Text(snapshot[index].data["day"], style:
TextStyle(fontSize: 20),),
],
)
],
),
);
}
),
);

}
}

想要的 enter image description here

当前

enter image description here

我认为列表图 block 会更好,但我尝试了我知道如何构建自定义列表图 block ,但我无法复制结果。

最佳答案

使用ListView.separated

ListView.separated(
separatorBuilder: (context, index) => Divider(
color: Colors.black,
),
itemCount: 20,
itemBuilder: (context, index) => Padding(
padding: EdgeInsets.all(8.0),
child: Center(child: Text("Index $index")),
),
)

或 divideTiles()

ListView(
children: ListTile.divideTiles(
context: context,
tiles: [
// your widgets here
]
).toList(),
)

关于dart - Flutter - 列出图 block 或卡片分隔符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55984530/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com