这是一个使用flutter写的天气预报APP,主要使用了以下几个插件,入门级练练手。 dio :网络请求插件,用于获取天气信息 fluttertoast :弹出toast提示信息 shared_preferences :简单的数据存储,用于保存设置过的天气预报信息 intl :日期格式化 项目GitHub地址: d9l_weather
界面
首先搜集一些天气预报APP的设计稿,确定一下自己的界面。看到有很多好看的,但是并不想做的太复杂。于是选择了一些简洁的,背景图也都去掉了。然后在PS里大概出一个界面,如下:
然后分析一下这个页面,大主体就是一个Column布局排列下来,中间穿插Row布局。详细的布局这里就不写,可以查看源码
home_page.dart
界面堆好之后,再做一个搜索城市的页面,一个搜索框加列表就可以了,怎么简单怎么来。页面通过右上角的设置按钮进入。
接口
页面都写好之后就需要把数据替换成真实数据了,这里使用了和风天气的API获取天气数据,注册之后就能使用。但是普通用户有些接口是不能用的,但是对这个APP来说,能够查到天气信息以及足够了。 新建一个 dio_client.dart 文件,里面放所有API请求方法,这里写成单例模式,如下。
class DioClient {
factory DioClient() => _getInstance();
static DioClient get instance => _getInstance();
stat