flutter - 如何在 Flutter 中使卡片可拖动

标签 flutter dart draggable

我有一个存储在“待办事项”类型列表中的任务列表。我想迭代列表并为每个项目创建一张卡片,并且我希望能够在长按时拖动和重新排序这些卡片。

以下是我获取今天任务的方式:

List<Todo> todayTasks = [];
      for (var i = 0; i < _todos.length; i++) {
        if (_todos[i].deadline != null) {
          if (_todos[i].deadline.substring(0, 11) ==
              todayDate.toString().substring(0, 11)) {
            todayTasks.add(_todos[i]);
          }
        }
      }

这是我创建卡片的方法:

for (var todo in todayTasks)
              new Card(
                shadowColor: Colors.black,
                child: ListTile(
                  onTap: () => model.updateTodo(
                      todo.copy(isCompleted: todo.isCompleted == 1 ? 0 : 1)),
                  contentPadding:
                      EdgeInsets.symmetric(horizontal: 0, vertical: 8.0),
                  leading: CircularCheckBox(
                    onChanged: (value) =>
                        model.updateTodo(todo.copy(isCompleted: value ? 1 : 0)),
                    value: todo.isCompleted == 1 ? true : false,
                    materialTapTargetSize: MaterialTapTargetSize.padded,
                  ),
                  trailing: IconButton(
                    icon: Icon(Icons.delete_outline),
                    onPressed: () => model.removeTodo(todo),
                  ),
                  title: Text(
                    todo.name,
                    style: TextStyle(
                      fontSize: 18.0,
                      fontFamily: 'Roboto',
                      fontWeight: FontWeight.w600,
                      color: todo.isCompleted == 1
                          ? Colors.grey[500]
                          : Colors.black,
                      decoration: todo.isCompleted == 1
                          ? TextDecoration.lineThrough
                          : TextDecoration.none,
                    ),
                  ),
                ),
              ),

最佳答案

我有两件事给你,你可以用它们得到你想要的结果:

  • 您能做的最好的事情就是使用 ReorderableListView class ,它是可生长的。因此,您可以将项目添加到您的列表中。
  • 您可以选择的另一种明智方法是使用软件包,这会让您的工作变得更轻松。有一个适合您的软件包,名为 reorderables 0.3.2

请使用这些指针,您就可以开始了:)

关于flutter - 如何在 Flutter 中使卡片可拖动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63614710/

相关文章:

flutter - 如何仅在调用 onPressed 时更改 CupertinoButton 背景颜色

用于 Flutter 原生广告的 Objective-C 的 Swift 等价物

flutter - Visual Studio Code 在 Flutter 中添加 'prefix0'

dart - Flutter:测试期间的计时器问题

jquery 旋转、拖动和调整大小

websocket - 错误 : Error when readinrror: Error when reading 'bin/main.dart' : The system cannot find the path specified

date - 更改 Dart 上的日期格式

flutter - 如何在任何 Flutter/Dart http 客户端重定向时删除 Authorization header

jQuery UI 对话框 : Turn off 'Draggable' for Dialog content

jQuery-UI 日期选择器 : Draggable?