为什么我的扑翼应用程序的listview滚动不如扑动画廊应用程序光滑？

Question

我使用Flutter创建了我的滚动演示应用程序的发布版本。我不知道为什么我的应用程序的ListView滚动不如颤动画廊应用程序光滑。我使用LG G5进行这项测试。

这里的a link to my app's demo

编辑： 这里是代码。

class ListViewSample extends StatelessWidget { 
@override 
Widget build(BuildContext buidContext) { 
return new Container(
    child: new Center(
    child: new ListView(
     children: createListTiles(), 
    ), 
    ) 
); 
} 

List<Widget> createListTiles() { 
List<Widget> tiles = <Widget>[]; 
    for(int i = 0; i < 40; i++) { 
    int count = i + 1; 
    tiles.add(
    new ListTile(
     leading: new CircleAvatar(
     child: new Text("$count"), 
     backgroundColor: Colors.lightGreen[700], 
    ), 
     title: new Text("Title number $count"), 
     subtitle: new Text("This is the subtitle number $count"), 
    ) 
); 
} 
return tiles; 
} 

有人也有同样的感受吗？

谢谢！

Answer 1

您的代码存在的问题是您使用的是常规的ListView，这不适用于包含大量项目的列表。所有这40个小部件都保存在内存中，这会导致您所遭受的极度滚动的滚动体验。

如果您有大量或无限量的项目，则应该使用ListView.builder代替。它仅按需构建可见列表项，这使得更大的列表可以顺利滚动。

这里有一个完整的示例中，您将如何迁移列表中的助洗剂的方法：

import 'package:flutter/material.dart'; 

class ListViewSample extends StatelessWidget { 
    @override 
    Widget build(BuildContext context) { 
    return new Scaffold(
     body: new Center(
     child: new ListView.builder(
      itemCount: 200, 
      itemBuilder: (context, index) { 
      final count = index + 1; 

      return new ListTile(
       leading: new CircleAvatar(
       child: new Text("$count"), 
       backgroundColor: Colors.lightGreen[700], 
      ), 
       title: new Text("Title number $count"), 
       subtitle: new Text("This is the subtitle number $count"), 
      ); 
      }, 
     ), 
    ), 
    ); 
    } 
} 

注意，有很多的项目，在这种情况下200，但滚动仍然是黄油顺利。