ListView Flutter内的ListViews

问题描述 投票:0回答:1

试图复制google MyTasks应用,但无法提出任务列表的解决方案。

基本上是尝试进行以下布局:ListsView

如果我理解正确,那么这是两个listView:一个待处理任务,其他已完成任务。已完成的任务在ExpansionTile中。待处理任务按日期分隔。

当前,我有此listView构建器:

显示项目的主要清单:



  Widget build(BuildContext context) {
    final dao = Provider.of<TodoDao>(context);

    return ListView(
      shrinkWrap: true,
      children: <Widget>[
        _buildTaskList(context),
        ExpansionTile(
          title: Text('Completed tasks'),
          children: <Widget>[_buildCompletedTodoList(context)],
        )
      ],
    );
  }

建筑物待定清单



  StreamBuilder<List<Task>> _buildTaskList(BuildContext context) {
    final dao = Provider.of<TodoDao>(context);

    return StreamBuilder(
      stream: dao.watchAllTasks(),
      builder: (context, AsyncSnapshot<List<Task>> snapshot) {
        final tasks = snapshot.data ?? List();

        return ListView.builder(
          itemCount: tasks.length,
          itemBuilder: (_, index) {
            final itemTask = tasks[index];

            return _buildListItem(itemTask, dao);
          },
        );
      },
    );
  }


  Widget _buildListItem(Task itemTask, TodoDao dao) {
    return Dismissible(
      direction: DismissDirection.horizontal,
      key: Key(itemTask.id.toString()),
      onDismissed: (direction) {
        dao.deleteTask(itemTask);
      },
      background: Container(
        color: Colors.blue,
        child: Align(
          alignment: Alignment.centerLeft,
          child: Padding(
            padding: const EdgeInsets.only(left: 16.0),
            child: Icon(
              Icons.check,
              color: Colors.white,
              size: 32.0,
            ),
          ),
        ),
      ),
      secondaryBackground: Container(
        color: Colors.red,
        child: Align(
          alignment: Alignment.centerRight,
          child: Icon(
            Icons.delete,
            color: Colors.white,
            size: 32.0,
          ),
        ),
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[
          _buildCheckboxListTile(itemTask, dao),
          Divider(
            height: 8.0,
            color: Color.fromRGBO(150, 150, 150, 0.8),
          ),
        ],
      ),
    );

  }

对于完成的列表,几乎相同的代码,只是不同的流和listItem UI。

使用此代码,我在一个列表中同时获取了待处理的listView和ExpansionTile,但它们类似于separate blocks中的>

此外,如果我在待处理列表中添加了很多项目,则无法向下滚动,因为我使用srinkWrap,否则,会出现很多错误。

是的,我不知道它的表达方式是否正确,是否有人理解我在说什么,但我只需要知道如何创建类似于MyTasks应用程序的任务列表的想法。

[试图复制google MyTasks应用,但无法提出任务列表的解决方案。基本上尝试进行这种布局:ListsView如果我理解正确,那么这是两个listViews:...

android listview flutter dart stream
1个回答
0
投票

您需要的是带有ExpansionTile

© www.soinside.com 2019 - 2024. All rights reserved.