Flutter Web: Prerender ListView

Question

我正在使用Flutter Web，我想预先呈现一个ListView，而不是在用户滚动时构建widgets，你可以在我的测试站点上看到这种行为：https://auties00.github.io这会导致性能问题，特别是在移动设备上，请忽略该列表，因为我正在测试几种滚动到ListView索引的方法。源代码：

class _HomePageState extends State<HomePage> {
  final ScrollController _controller = ScrollController();
  final List<GlobalKey> _keys = [];

  @override
  Widget build(BuildContext context) {
    reset();
    _keys.clear();
    var size = MediaQuery.of(context).size;
    ScreenUtil.init(context, width: size.width, height: size.height);

    return Scaffold(
      body: Container(
          child: NotificationListener<OverscrollIndicatorNotification>(
              onNotification: (e) {
                e.disallowGlow();
                return false;
              },

              child: _buildBody()
          )
      ),
    );
  }

  Widget _buildBody(){
    return LayoutBuilder(
      builder: (context, constraints) {
        _initWebListeners(constraints);
        return ListView.builder(
          controller: _controller,
          physics: const AlwaysScrollableScrollPhysics(),
          itemBuilder: (var context, var index) {
            switch (index) {
              case 0: return WebNavigationBar(
                  key: GlobalKey()..addKeyToList(_keys),
                  keys: _keys
              );

              case 1:return WebAnnouncement(
                key: GlobalKey()..addKeyToList(_keys),
              );

              case 2: return WebPlayer(
                  key: GlobalKey()..addKeyToList(_keys),
                  link: 'https://i.imgur.com/VPTYKX2.mp4'
              );

              case 4: return WebIntroduction(
                key: GlobalKey()..addKeyToList(_keys),
              );

              case 6: return WebFeatures(
                key: GlobalKey()..addKeyToList(_keys),
              );

              case 8: return WebPricing(
                key: GlobalKey()..addKeyToList(_keys),
              );

              case 9: return WebFooter(
                key: GlobalKey()..addKeyToList(_keys),
              );
            }

            return WebDivider();
          },
          itemCount: 10
        );
      },
    );
  }
}

Answer 1

尝试将所有小部件放在一列中。然后将该列作为一个子级放置在列表视图中。它略微提高了性能。