京东万象--全国天气软件实现

2021-01-31  本文已影响0人  motosheep

使用京东万象接口,实现中国天气app。

先上截图:

软件主要实现当日天气查询,天气地区查询,未来天气查询:

软件架构,使用databinding+livedata+rxjava+mvp实现。

难点:

关于接口请求,那就没啥好说的了。

(1)天气动画的绘制

(2)天气折线图自定义view绘制

啥也不说,上图,下图为各种天气动画的情况(动画效果是为了演示效果手动调整代码,请忽略信息不对的问题):

天气的不同动画

对于天气,目前有以下几种情况:晴天,雪,大雾,大风,多云,下雨

动画实现,surfaceview实现,surfaceview可以在子thread里面进行绘制,对于动画,建议使用该view实现。

(1)晴天:

原理:三个正方形加一个圆形,正方形按照角度旋转,可以绘制出上图中的效果。代码片段如下,主要注意旋转角度即可。

太阳动画

(2)多云:

原理,使用五个圆形,加上画布剪裁,即可实现。核心代码如下,注意剪裁的范围即可。

多云动画

(3)下雨:

雨滴,可以看做是多个高度不断变动的小矩形,即可。是不是很简单,核心代码如下:

下雨动画

(4)下雪,大风,大雾

这里直接采用drawbitmap方法进行绘制。核心代码如下。

绘制bitmap动画

简单明了,废话不多说。以上就是动画的绘制逻辑。

注意,如果使用了surfaceview不断绘制动画,在activity进行跳转的时候,记得把动画暂停,不然会导致卡顿现象的发生。暂停动画方法千百种,这里就不做过多描述。

对于天气折线图,实现也不难,主要绘制原理:

绘制温度的点,再通过点与点之间的位置进行连线,即可实现。

记得:

先有点,再有线。

先有点,再有线。

先有点,再有线。

效果如下:

其他,就没什么难点了。至此,全部实现完毕。

that's all--------------------------------------------------------------------------------------------------------------------------

上一篇下一篇

猜你喜欢

热点阅读