效果图
思诗
实现思路
多云(cloud)的动画可以拆分成两个部分：
-
飞鸟动画
- 飞鸟动画，飞翔的动画是一组帧动画。共8张图组成。
- 在帧动画的基础上，增加了横向移动的动画（跟云飘动是一个原理）
- 倒影的动画跟上面的一样，只是把透明度调成了0.4
云飘动
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.translation.x"];
animation.toValue = toValue;
animation.duration = duration;
animation.autoreverses = autoreverses;
animation.removedOnCompletion = NO;
animation.repeatCount = MAXFLOAT;
animation.fillMode = kCAFillModeForwards;
Usage
1. import header
#import "WHWeatherView.h"
2. initialization
WHWeatherView *weatherView = [[WHWeatherView alloc] init];
self.weatherView.frame = self.view.bounds;
[self.view addSubview:self.weatherView];
3. show animation
typedef NS_ENUM(NSInteger, WHWeatherType){
WHWeatherTypeSun = 0,
WHWeatherTypeClound = 1,
WHWeatherTypeRain = 2,
WHWeatherTypeRainLighting = 3,
WHWeatherTypeSnow = 4,
WHWeatherTypeOther = 5
};
- (void)showWeatherAnimationWithType:(WHWeatherType)weatherType;
More
WHWeatherAnimation 目前有5种天气 —— 晴天、阴天、雨天、雷阵雨、下雪。均已完工，接下来的一段时间，会陆续更新后面的实现方式。着急的小伙伴可以先去 Github。
动画已经运用在这个APP里，思诗 —— 思念诗歌，每日一诗。每天看天气的同时，读上一首好诗，岂不美哉！
若是感兴趣，赶快去下载体验吧，点击上面链接或者App Store搜索“思诗”。
Github链接:
思诗
