列表视图:ListView.builder

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

在这个 main.dart 文件里,再添加一个 Widget ...

新建一个 class ... 名字叫 Home ... 让它继承一下 StatelessWidget ... 里面添加一个 build 方法 ... 然后把 App 里的 MaterialApp 的 home 属性的值 ... 就是这个 Scaffold 小部件 .. 放到 Home 这个小部件里面 ... 这里换成 Home ...

再把剪切的东西粘贴到新创建的 Home 小部件的 builder 方法里面 ... 让它作为方法返回的 Widget ..

我们可以在页面主体区域这里用一个列表视图 .. 找到 body 属性 ... 修改一下 ... 这里要用的小部件叫 ListView ... 用一下 builder 方法创建一个列表视图 ..

里面先添加一个 itemCount 设置一下列表项目的数量 ... 这里就是上面导入进来的 posts 的 length 属性的值 ..

再添加一个 itemBuilder ... 我们可以使用一个方法去构建列表视图里的项目 ... 方法的名字叫 _listItemBuilder ...

在这个 Home 里面再去添加一个这样的方法 .. 它返回的是 Widget .. 名字叫 _listItemBuilder .. 接收一个 context 参数 ... 还有一个整数类型的 index ... 是列表项目的索引值 ..

让方法 return 一个 widget ... 用一下 Text ... 文字是 posts ... 索引值 .. 然后访问一下 title 属性 ...

在界面上,你会看到一个内容列表 ... 列表里的每个项目现在只有一个内容的标题 ...

列表视图:ListView.builder《 Flutter 移动应用:快速起步 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点