IOS drop refresh animation – colorful bubbles

The first complete renderings, Gif will look at the bad effects of:

IOS drop refresh animation - colorful bubbles

Is the use of CAShapeLayer and UIBezierPath, CAEmitterLayer, is the key to do is
animation in order to save time, pull down to refresh the borrowed MJRefresh
custom logic a class to inherit MJRefreshHeader support and modify the color of idle animation. The
default to a, we can imagine.

@interface ZTHeaderRefresh: MJRefreshHeader, @property (nonatomic, strong), UIBezierPath, *path; @property (nonatomic, strong), UIColor, *tintColor; @end

The method is the same as MJRefresh

__weak typeof (self) weakSelf = self; ZTHeaderRefresh = *header [ZTHeaderRefresh headerWithRefreshingBlock:^{[weakSelf requsetData]}]; header.tintColor = [UIColor; *path = orangeColor]; / / UIBezierPath [UIBezierPath bezierPathWithRoundedRect: CGRectMake (0, 0, 50, 40 cornerRadius:10]); / / header.path = path; self.tableView.mj_header = header; - requsetData (void) {dispatch_after (dispatch_time (DISPATCH_TIME_NOW, (int64_t) (2) (* NSEC_PER_SEC), dispatch_get_main_queue), ^{[self.tableView.mj_header endRefreshing];}});

Talk about the effect of the realization of the bubble, it is also very simple, using the CAEmitterLayer transmitter to achieve

- (CAEmitterLayer * refreshingLayer) {if (! _refreshingLayer) {_refreshingLayer layer] = [CAEmitterLayer; _refreshingLayer.renderMode = kCAEmitterLayerAdditive; _refreshingLayer.emitterShape = kCAEmitterLayerRectangle; _refreshingLayer.emitterCells = @[[self getEmitterCell]] return _refreshingLayer;};} //cell (CAEmitterCell * getEmitterCell) {CAEmitterCell *cell = [[CAEmitterCell alloc] init]; CGFloat colorChangeValue = 1; cell.blueRange = colorChangeValue; cell.redRange = colorChangeValue; cell.greenRange = colorChangeValue; cell.birthRate = 5; cell.speed = 5.f; cell.velocity = -20.f; cell.velocityRange = -40.f; cell.yAcce Leration = 20.f; cell.emissionRange = M_PI; cell.contents = (__bridge (ID) [UIImage imageNamed:@ "bubble].CGImage"); cell.lifetime = 15; cell.lifetimeRange = 20; cell.scale = 0.1; cell.scaleRange = 0.3; return cell;}

Lazy load a CAEmitterLayer, configure cell, bubble is a bubble picture, add to the parent View. Attribute a little more specific meaning reference here

IOS drop refresh animation - colorful bubbles
bubble launcher

Support custom animation

IOS drop refresh animation - colorful bubbles
custom path

Demo code has been uploaded to the GitHub portal

Simple double layer wave animation effect,
line of code to achieve the third party login, share, payment function