【问题标题】:Flutter - List Tiles or Card SeparatorsFlutter - 列出瓷砖或卡片分隔符
【发布时间】:2019-05-04 16:23:22
【问题描述】:

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

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

这是我目前的代码

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),),
                    ],
                  )
                ],
              ),
            );
          }
        ),
      );

  }
}

想要的

当前

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

【问题讨论】:

    标签: dart flutter flutter-layout


    【解决方案1】:

    使用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(),
    )
    

    【讨论】:

    • 如何将 ListTile.divideTiles 与 ListView.builder 一起使用?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2011-05-25
    • 2018-05-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多