ALI Flutter进阶笔记

将build方法添加到RandomWordState中，如下面高亮代码所示

classRandomWordsStateextendsState{

@override

Widget build(BuildContext context){

final wordPair =new WordPair.random();

returnnew Text(wordPair.asPascalCase);

}}

4.通过下面高亮显示的代码，将生成单词对代的码从MyApp移动到RandomWordsState中

classMyAppextendsStatelessWidget{

@override

Widget build(BuildContext context){

final wordPair =new WordPair.random();// 删除此行

returnnewMaterialApp(

title:‘Welcome to Flutter’,

home:newScaffold(

appBar:newAppBar(

title:newText(‘Welcome to Flutter’),

),

body:newCenter(

//child: new Text(wordPair.asPascalCase),

child:newRandomWords(),

),

),

);

}}

重新启动应用程序。如果您尝试热重载，则可能会看到一条警告：

Reloading…

Not all changed program elements ran during view reassembly; consider

restarting.

这可能是误报，但考虑到重新启动可以确保您的更改在应用界面中生效。

应用程序应该像之前一样运行，每次热重载或保存应用程序时都会显示一个单词对。

遇到问题?

如果您的应用程序运行不正常，可以使用下面链接中的代码来对比更正。

· lib/main.dart

第4步: 创建一个无限滚动ListView

在这一步中，您将扩展（继承）RandomWordsState类，以生成并显示单词对列表。 当用户滚动时，ListView中显示的列表将无限增长。 ListView的builder工厂构造函数允许您按需建立一个懒加载的列表视图。

1.向RandomWordsState类中添加一个_suggestions列表以保存建议的单词对。 该变量以下划线（_）开头，在Dart语言中使用下划线前缀标识符，会强制其变成私有的。

另外，添加一个biggerFont变量来增大字体大小

classRandomWordsStateextendsState{

final _suggestions =[];

final _biggerFont =constTextStyle(fontSize:18.0);

…}

2.向RandomWordsState类添加一个 _buildSuggestions() 函数. 此方法构建显示建议单词对的ListView。

ListView类提供了一个builder属性，itemBuilder 值是一个匿名回调函数， 接受两个参数- BuildContext和行迭代器i。迭代器从0开始， 每调用一次该函数，i就会自增1，对于每个建议的单词对都会执行一次。该模型允许建议的单词对列表在用户滚动时无限增长。

添加如下高亮的行:

classRandomWordsStateextendsState{

…

Widget _buildSuggestions(){

returnnew ListView.builder(

padding:const EdgeInsets.all(16.0),

// 对于每个建议的单词对都会调用一