使用 setState 更新列表子颜色在颤振中不起作用

时间:2021-01-28 14:20:05

标签: list flutter listview setstate

您好,我正在尝试使用列表中现有的子项本身向列表添加一个新子项。 我试图通过在现有子项中使用 setState 函数来实现这一点,但它不起作用。 我不知道为什么它不起作用。 我的假设是,如果我更改 task.completed 并调用 setState 函数,它会理解 task.complete 是脏的并刷新与之相关的对象。 这是我的代码

Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: <Widget>[
          SizedBox(
            height: 400,
            child: AnimatedList(
              key: _listKey,
              initialItemCount: _data.length,
              itemBuilder: (context, index, animation) {
                return _buildItem(_data[index], animation);
              },
            ),
          )
        ],
      ),
    );
  }

我调用 _buildItem 构建 AnimatedList

 Widget _buildItem(Widget item, Animation animation) {
    return SizeTransition(sizeFactor: animation, child: item);
  }

在 buildItem 中,它为项目提供动画

void initState() {
    super.initState();
    _data.add(GestureDetector(
      child: Text(
        "Add",
        style: TextStyle(color: Colors.grey, fontSize: 20.0),
      ),
      onTap: () {
        setState(() {
          _onButtonPress();
        });
      },
    ));
  }

在 initState 函数中,我在列表中添加了一个项目,该项目将是“现有项目”。

void _onButtonPress() {
    // replace this with method choice below
    _insertSingleItem();
  }
void _insertSingleItem() {
    int insertIndex = _data.length - 1;
    Widget widget = Form(
      child: TextField(
        controller: textEditingController,
        autofocus: true,
        decoration: InputDecoration(
          isDense: true,
          contentPadding: EdgeInsets.all(0.0),
          border: InputBorder.none,
        ),
        onEditingComplete: () {
          Task task = Task(name: textEditingController.text, completed: false);
          print(identityHashCode(task));
          tasks.add(task);
          print(identityHashCode(tasks.last));
          Widget taskWidget = GestureDetector(
            child: Text(
              task.name,
              style: TextStyle(
                  color: task.completed ? Colors.grey : Colors.black87,
                  fontSize: 20.0),
            ),
            onTap: () {
              setState(() {
                print(identityHashCode(task));
                task.completed = !task.completed;
                bool temp = task.completed;
                print('$temp');
              }
              );
            },
          );
          setState(() {
            _data.removeAt(insertIndex);
            _data.insert(insertIndex, taskWidget);
            textEditingController.clear();
          });
        },
        showCursor: false,
      ),
    );
    _data.insert(insertIndex, widget);
    _listKey.currentState
        .insertItem(insertIndex, duration: Duration(seconds: 1));
  }

问题出现在这里。在 Gesturedetector 中,我想通过点击它来改变颜色本身。我使用打印检查了值颜色的变化,当我点击孩子时它从真变为假。 我不明白为什么 setState 不能更改脏孩子,它知道 task.completed 已更改,因此它很脏。 请有人帮助我。我已经在这个问题上苦苦挣扎了 3 天......

-----------------已编辑----------------- 我通过像这样分离小部件解决了这个问题。

class Test extends StatefulWidget {
  Test({this.task});
  Task task;
  @override
  _TestState createState() => _TestState(task: task);
}

class _TestState extends State<Test> {
  Task task;

  _TestState({this.task});
  @override
  Widget build(BuildContext context) {
    print('build');
    return GestureDetector(
        onTap: () {
          setState(() {
            task.completed = !task.completed;
          });
        },
        child: Text(
          task.name,
          style: TextStyle(
              color: task.completed ? Colors.grey[400] : Colors.black87,
              fontSize: 20.0),
        )
    );
  }
}

但我仍然不明白它为什么有效。

0 个答案:

没有答案