繁体   English   中英

ListView没有更新

[英]ListView is not getting updated

我在ListView和Column中遇到了小部件树的问题。 有人可以解释一下(包装在singleChildScrollView中)的列的小部件树与listview有何不同。

这是代码:

main.dart

class Screen1 extends StatefulWidget {
  const Screen1({key}) : super(key: key);
  @override
  _Screen1State createState() => _Screen1State();
}

class _Screen1State extends State<Screen1> {
  List<Widget> list = [
    Artist(
      key: UniqueKey(),
      value: 1,
    ),
    Artist(
      key: UniqueKey(),
      value: 2,
    ),
    Artist(
      key: UniqueKey(),
      value: 3,
    ),
    Artist(
      key: UniqueKey(),
      value: 4,
    ),
    Artist(
      key: UniqueKey(),
      value: 5,
    ),
  ];
  @override
  Widget build(BuildContext context) {
    print(DataTable);
    print("list =>${list.length} ");

    return Scaffold(
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            list.insert(
                2,
                Artist(
                  value: 5,
                  key: UniqueKey(),
                ));
          });
        },
      ),
      body: ListView(children: list),
    );
  }
}


custom.dart

class Artist extends StatefulWidget {
  final int value;

  Artist({Key key, this.value}) : super(key: key);
  _ArtistState createState() {
    return _ArtistState();
  }
}

class _ArtistState extends State<Artist> with SingleTickerProviderStateMixin {
  Animation<double> anim;
  AnimationController controller;
  @override
  void initState() {
    controller = new AnimationController(
      duration: const Duration(milliseconds: 1000),
      vsync: this,
    );
    anim = Tween<double>(begin: 0, end: 60).animate(controller);
    controller.addListener(() {
      setState(() {});
    });
    print(widget.value);
    // if (!widget.firstBuild) {
    controller.forward();
    //  }
    super.initState();
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Container(
          height: 50,
          width: (anim.value > 0) ? anim.value : 60,
          color: Colors.red,
          child: Text(widget.value.toString()),
        ),
      ),
    );
  }
}

问题:轻击浮动按钮时,ListView不会更新,但是列表正在更新。 但是,当我用列替换listview时,它按预期开始工作。

这是因为对ListView进行了Flutter优化,请尝试使用简单对象/值List (无窗口小部件),然后将其映射到窗口小部件中,如下所示:

  List<int> list = [1, 2, 3, 4, 5];
  @override
  Widget build(BuildContext context) {
    print(DataTable);
    print("list =>${list.length} ");

    return Scaffold(
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            list.insert(2, 5);
          });
        },
      ),
      body: ListView(
          children: list
              .map(
                (val) => Artist(
                  key: UniqueKey(),
                  value: val,
                ),
              )
              .toList()),
    );
  }

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM