『Flutter』一款风格简约功能丰富的天气

最近利用两周的周末和下班时间入坑了 Flutter，简单的学了一下基础的 widget 后，就准备拿一个项目练练手。什么项目既实用，有不乏技术，当时是写一个天气 app 了，所以 简悦天气 所以诞生。java

简约不简单，丰富不复杂git

一款简约风格的 flutter 天气项目，提供实时、多日、24 小时、台风路径以及生活指数等服务，支持定位、删除、搜索等操做。github

做为 flutter 实战项目，包含状态管理、网络请求、数据缓存、自定义 view、自定义动画，三方统计，事件管理等技术点，实用且丰富。canvas

体验

点击下载连接下载缓存

或者直接扫描二维码抢先体验markdown

功能介绍

目前已支持的功能以下网络

接下来多图警告 app

一键换天

天气背景效果分为三层：框架

背景颜色层。从上到下的渐变效果
云层。只有一种图片，对其位移、数量、染色作不一样变化达到不一样效果
雨雪层。为雨雪天气单独作了动画，很炫酷。

目前支持多达 12 种不一样的天气类型，其中包括：晴、多云、阴天、小中大雨、小中大雪、雾、霾、浮尘，为了更好，在关于页面有上角添加切换天气类型的入口，实时查看不一样气象下不一样的背景效果。下面用一种 GIF 图展现效果，鉴于 GIF 自己的局限，可能会模糊低帧，请下载 apk 自行体验。工具

技术介绍

虽然这个项目简单，可是涵盖的 flutter 技术点却很多，能够知足平常开发小项目的需求。

其实从入门 flutter 到完成这个项目，也只是花了两个周末，加上平时下班的时间，代码写的略微有点仓促，不少能够封装，和一些绘制的逻辑还有很大的优化空间，后面抽时间进行优化一波。

大体整理一下其技术点：

网络请求&数据缓存
高德 SDK 以及自动定位
自定义 View，动画以及 widget
三方统计接入，插件接入
状态管理，数据同页面以及跨页面传输
屏幕适配，公共组件封装

这里特意把自自定义 View &动画拉出来讲说，从项目能够看到不少的图表，包括空气质量&湿度比例圆弧图，日出日落弧线图，以及24小时&多日折线图。其实绘制原理跟 Android 的绘制很像，包括接口的设计也殊途同归。一样有 canvas 画布和 paint 画笔，这样写起来就方便不少。

有了 Android 绘制基础，写起来就很是快了，这几个图加在一块儿一共不到一天的时间就能够完成。无非是先装载好数据，根据获取到的数据进行绘制。后面有时间会单独介绍一下这这块的绘制逻辑。

三方库依赖

Fluter 为何目前这么火热，以及开发的效率如此之高，除了由于 Google 这个大佬做为靠山，更多的仍是活跃的开源社区，pub.dev 上提供了不少稳定而又多样的插件，省去没必要要的开发时间，根据本身的实际状况进行选择，结合 Mac 上 Alfred 工具，搜索起来驾轻就熟。

一样，简悦天气项目中也引用很多依赖插件，特此进行说明和感谢。

插件名称	插件说明
flutter_bloc	很少说，很强大，做为新手不再用担忧数据共享与更新
shared_preferences	很经常使用，持久化保存数据
dio	网络请求固然离不开一个好的网络框架，项目只是用到了基础的 GET 请求
amap_location_fluttify	高德定位插件，虽然有坑，可是知足基础需求
location_permissions	定位权限判断已经申请插件
event_bus	事件更新
flutter_slidable	强大的侧滑插件
umeng_analytics_plugin	友盟统计插件
flutter_screenutil	屏幕适配工具插件
modal_bottom_sheet	底部弹窗
path_drawing	绘制虚线 path 用到
url_launcher	通用跳转工具
package_info	获取包相关信息

总结

对 Flutter 两周的学习和开发下来后的感觉，代码写起来是真快，在 Android 若是想实现，点击按钮并更新 TextView 的逻辑，首先建立 xml 布局，其次 java 代码中初始化 View 并给 button 添加点击事件，而后，还须要有单独的变量保存状态的更新，最后在变量发生变化时更新 TextView 的值。

而 Flutter 的核心就是 widget，不少功能都封装在 widget 中，在 Flutter 中若是想实现该功能，只需建立两个 widget，在相应 click 事件时只需关系变量值改变，调用 setState，后续的 View 更新能够彻底不用管，有点相似 Android 的 databinding。

不过，因为所有都是 widget，你会发现若是把全部页面写在一个文件，那么嵌套的画面绝对会让你崩溃。这就须要，对功能进行拆解，尽可能作到逻辑最小化，代码阅读性和维护性也会很高。还有就是插件，虽然社区的插件已经至关丰富，但仍是有些需求没有找到合适的插件，这就须要广大开发者，积极燃烧开源热血，为社区贡献本身的成果。

总的来讲，开发效率上确实提升很多，由于入坑时间短，原理和性能上没有细致研究，因此可能致使见解有点片面，不事后面会努力补上知识点。

感谢

天气数据来源于彩云科技

定位功能来自高德地图

统计来自友盟统计

天气 icon 来自阿里icon