listview - 将卡片设置为 Listview

Question

我是新来的颤振。请帮我用卡片列出视图。我从 SQLite 获取数据并将其直接设置为 listview。请让我知道如何在我的代码中添加卡。这是我的代码。

 body: FutureBuilder<List<UserModel>>(
    future: db.getUserModelData(),
    builder: (context, snapshot) {
      if (!snapshot.hasData)
        return Center(child: CircularProgressIndicator());

      return ListView(
        children: snapshot.data
            .map((user) => ListTile(
                  title: Text(user.name),
                  subtitle: Text(user.bDate),
                  leading: CircleAvatar(
                    backgroundColor: Color(
                            (math.Random().nextDouble() * 0xFFFFFF)
                                    .toInt() <<
                                0)
                        .withOpacity(1.0),
                    child: Text(user.name[0],
                        style: TextStyle(
                          fontSize: 18.0,
                          color: Colors.white,
                        )),
                  ),
                ))
            .toList(),
      );
    },
  ),

标签： listviewflutterdart

Answer 1

我已经用 Column() 解决了我的问题 这是代码

return Column(
            children: List.generate(snapshot.data.length, (itemIndex) {
              ProfileModel product = snapshot.data[itemIndex];
              return Card(
                  child: ListTile(
                leading: SizedBox(
                    height: 50.0,
                    width: 50.0,
                    child: CircleAvatar(
                      backgroundColor: Color(
                              (math.Random().nextDouble() * 0xFFFFFF)
                                      .toInt() <<
                                  0)
                          .withOpacity(1.0),
                      child: Text(product.name[0],
                          style: TextStyle(
                            fontSize: 18.0,
                            color: Colors.white,
                          )),
                    )),
                title: Text(product.name),
                subtitle: Text(product.bDate + ', ' + product.mobile),
              ));
            }),
          );