【问题标题】:Make a dynamic Listview inside a ListView =在 ListView = 中创建动态 Listview
【发布时间】:2022-12-04 19:58:47
【问题描述】:

从下面的图片开始,我想制作列表视图,可以在每个列表视图卡下添加更多行(红色)。 我已经实现了整体列表视图(绿色),带有应该在列表中添加列表的按钮。代码在底部

图片取自Strong app

我现在的设计如下:

Expanded(
          // ignore: unnecessary_new
          child: new ListView.builder(
              itemCount: litems.length,
              itemBuilder: (BuildContext ctxt, int Index) {
                return Card(
                    child: Padding(
                        padding: EdgeInsets.all(10),
                        child: ExpansionTile(
                          initiallyExpanded: true,
                          title: Text(
                            litems[Index],
                            style: const TextStyle(
                              fontSize: 20,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                          children: <Widget>[
                            ElevatedButton(
                                onPressed: () {
                                  litems.add('hei');
                                  setState(() {});
                                },
                                child: const Text('Add Set')),
                            SizedBox(height: 5),
                          ],
                          leading: IconButton(
                            icon: const Icon(
                              Icons.close,
                              color: Colors.red,
                            ),
                            onPressed: () {
                              litems.removeAt(Index);
                              setState(() {});
                            },
                          ),
                        )));
              })),
      ElevatedButton(
          onPressed: () {
            litems.add('hei');
            setState(() {});
          },
          child: const Text('Add Exercises')),

【问题讨论】:

  • 您可以使用动态列表变量在现有列表中嵌入另一个列表,该列表变量将在任何事件发生时更新
  • @HaseebSajjad 我试过类似的东西,但运气不好。我必须在里面制作一个新的 listView.builder 吗?
  • 是的,您必须这样做,因为您要维护两个不同的项目计数

标签: flutter listview dynamic card


【解决方案1】:

试试我的代码:

List<List<String>> parent = [];//init Parent

//Parent(Exercises) layout
    Column(
            children: [
              ListView.builder(
                  itemCount: parent.length,
                  shrinkWrap: true,
                  itemBuilder: (context, index) {
                    return _buildList(parent[index]);
                  }),
              TextButton(
                  onPressed: () {
                    parent.add([]);
                    setState(() {});
                  },
                  child: Text("Add Parent"))
            ],
          )

//build children
_buildList(List<String> list) {
    return Column(
      children: [
        ListView.builder(
          itemCount: list.length,
          shrinkWrap: true,
          padding: EdgeInsets.all(0),
          physics: const NeverScrollableScrollPhysics(),
          itemExtent: 50,
          itemBuilder: (context, index) {
            return Container(
              color: Colors.red.withOpacity((index * 5) / 100),
              margin: EdgeInsets.symmetric(vertical: 0),
              child: Text('Item'),
            );
          },
        ),
        TextButton(
            onPressed: () {
              list.add("value");
              setState(() {});
            },
            child: Text("Add Item"))
      ],
    );
  }

【讨论】:

  • 谢谢,这是我一直在寻找的!
【解决方案2】:

使用函数添加小部件。

【讨论】:

    猜你喜欢
    • 2013-02-03
    • 1970-01-01
    • 2017-11-14
    • 1970-01-01
    • 2019-11-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-01-14
    相关资源
    最近更新 更多