Flutter：ListView里面的CheckboxListTile跳转到顶部

Question

所以我知道有一些关于此问题的类似问题，但其中 none 对我有用。我有一个带有不同 CheckboxListTiles 的 ListView，当我向下滚动并选择一个项目时，ListView 会自动跳到顶部。有没有办法防止这种情况发生？非常感谢你！我添加了屏幕截图，以便您更好地理解。这是我的代码：

class CheckboxWidget extends StatefulWidget {
  const CheckboxWidget({
    Key key,
    this.item,
    this.type,
    this.state,
  }) : super(key: key);

  final Map<String, bool> item;
  final String type;
  final Map<String, dynamic> state;

  @override
  State<CheckboxWidget> createState() => _CheckboxWidgetState();
}

class _CheckboxWidgetState extends State<CheckboxWidget> {
  @override
  void initState() {
    super.initState();
    if (widget.state[widget.type].isEmpty) {
      widget.item.updateAll((key, value) => value = false);
    }
  }

  bool isChecked = false;

  @override
  Widget build(BuildContext context) {
    final FilterProvider filterProvider = Provider.of<FilterProvider>(context);

    return Expanded(
      child: ListView(
        key: UniqueKey(),
        children: widget.item.keys.map(
          (key) {
            return CheckboxListTile(
              contentPadding: EdgeInsets.only(left: 2, right: 2),
              title: Text(
                key,
                style: TextStyle(fontSize: 19, fontWeight: FontWeight.w400),
              ),

              value: widget.item[key],
              activeColor: Color(0xffF6BE03),
              checkColor: Color(0xff232323),
              shape: CircleBorder(),
              //contentPadding: EdgeInsets.all(0),
              onChanged: (value) {
                value
                    ? filterProvider.multifiltervalue = [widget.type, key]
                    : filterProvider.multifiltervalue = [
                        widget.type,
                        key,
                        false
                      ];
                setState(
                  () {
                    widget.item[key] = value;
                  },
                );
              },
            );
          },
        ).toList(),
      ),
    );
  }
}

Answer 1

CheckboxListTile 是一个无状态的 Widget...setState 正在重绘整个列表。

您可以将 CheckboxListTile 包装到 Statefull Widget 或 StatefulBuilder 中...如果您在 StatefulBuilder 中调用 setState ，则仅应重绘这一部分..

另一种方法可能是保存滚动位置...但我认为只重绘屏幕上您已更改的部分更聪明:-)

Answer 2

可能是因为这一行 key: UniqueKey(), 当您调用 setState 构建函数时会再次构建其小部件，并且 ListView 将有一个新的 UniqueKey 因此它将重建该列表因为它认为它是一个不同的小部件

删除这一行 key: UniqueKey(), 它应该可以正常工作

Flutter：ListView里面的CheckboxListTile跳转到顶部

Flutter: CheckboxListTile inside ListView jumps to top

checkbox

listview

setstate

dart

flutter