本文是iOS开发者学习Flutter系列的第六篇，主要介绍了如何准备网络数据，包括使用Mock.js模拟数据，以及在Flutter中请求网络数据。接着讲解了聊天页面导航条的实现，包括导航条的准备工作、添加加号按钮。此外，文章还讨论了如何处理网络数据，使用FutureBuilder和不使用FutureBuilder的方式，并实现了超时取消刷新功能和Widget状态的保持。
准备网络数据
这一步不是很重要，提供一些假数据而已，不是重点嫌麻烦的可以跳过。
先介绍一个网址：点击
这个网址用来搭建我们需要的网络数据，注册账号非常简单，这里就不多说了。
注册完成之后，新建一个仓库，简简单单取个名字就够了：
之后点击进入仓库，可以看到下图：
会默认生成以一个示例接口，可以看一看示例接口的生成规则。看不懂也没关系，我们直接直接上手自己新建一个接口，如图所示：
点击右上角的编辑按钮进入编辑模式，新建一个响应chatlist，类型为Array。然后生成chatlist的数据，imageUrl表示每条聊天数据的用户头像。其中用户头像的初始值里面有一段@natural(20,99)，这个是Mock.js代码。这里是相关介绍mockjs.com/
每条聊天数据，除了imageUrl还需要有用户名name和消息的内容message。@cname用来生成随机的中文名，@cparagraph用来生成随机的中文段落来表示聊天内容。我们这里只是简单的构造一下这个聊天列表所需要的数据，真正的聊天列表的数据肯定是不会这么简单的。。。
编辑的差不多的时候，记得点击保存,保存之后点击红圈中的图标就可以获取到数据
聊天页面导航条
准备工作
默认展示页面改为_currentIndex改为0,新建chat目录，将相关文件放在这里。
添加加号按钮
加号按钮这个东西，我们之前已经添加过类似的了，appBar的
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
