IOS等待时动画效果的实现

查询时间或长或短，为了提升用户体验，目前用的比较多的手段之一就是查询等待时添加一个动态等待效果。当我们在请求网络时加载页面时有个动作效果，效果图如下：

源代码可以网上找开源项目coding.net，上面的效果原理为两张图片组合，外面那个则为动画转动，里面的图标则是透明度的变化；主要代码如下：

1：把它封装在easeloadingview里面

@interface easeloadingview : uiview
@property (strong, nonatomic) uiimageview *loopview, *monkeyview;
@property (assign, nonatomic, readonly) bool isloading;
- (void)startanimating;
- (void)stopanimating;
@end
@interface easeloadingview ()
@property (nonatomic, assign) cgfloat loopangle, monkeyalpha, anglestep, alphastep;
@end

@implementation easeloadingview
- (instancetype)initwithframe:(cgrect)frame{
 self = [super initwithframe:frame];
 if (self) {
  self.backgroundcolor = [uicolor clearcolor];
  _loopview = [[uiimageview alloc] initwithimage:[uiimage imagenamed:@"loading_loop"]];
  _monkeyview = [[uiimageview alloc] initwithimage:[uiimage imagenamed:@"loading_monkey"]];
  [_loopview setcenter:self.center];
  [_monkeyview setcenter:self.center];
  [self addsubview:_loopview];
  [self addsubview:_monkeyview];
  [_loopview mas_makeconstraints:^(masconstraintmaker *make) {
   make.center.equalto(self);
  }];
  [_monkeyview mas_makeconstraints:^(masconstraintmaker *make) {
   make.center.equalto(self);
  }];
  _loopangle = 0.0;
  _monkeyalpha = 1.0;
  _anglestep = 360/3;
  _alphastep = 1.0/3.0;
 }
 return self;
}
- (void)startanimating{
 self.hidden = no;
 if (_isloading) {
  return;
 }
 _isloading = yes;
 [self loadinganimation];
}
- (void)stopanimating{
 self.hidden = yes;
 _isloading = no;
}
- (void)loadinganimation{
 static cgfloat duration = 0.25f;
 _loopangle += _anglestep;
 if (_monkeyalpha >= 1.0 || _monkeyalpha <= 0.0) {
  _alphastep = -_alphastep;
 }
 _monkeyalpha += _alphastep;
 [uiview animatewithduration:duration delay:0.0 options:uiviewanimationoptioncurvelinear animations:^{
  cgaffinetransform loopangletransform = cgaffinetransformmakerotation(_loopangle * (m_pi / 180.0f));
  _loopview.transform = loopangletransform;
  _monkeyview.alpha = _monkeyalpha;
 } completion:^(bool finished) {
  if (_isloading && [self superview] != nil) {
   [self loadinganimation];
  }else{
   [self removefromsuperview];
   _loopangle = 0.0;
   _monkeyalpha = 1,0;
   _alphastep = abs(_alphastep);
   cgaffinetransform loopangletransform = cgaffinetransformmakerotation(_loopangle * (m_pi / 180.0f));
   _loopview.transform = loopangletransform;
   _monkeyview.alpha = _monkeyalpha;
  }
 }];
}
@end

注意loadinganimation这里面有动作的处理及透明度的处理，当停止加载后把它自个从当前的视图去除；

2：uiview (common)在uiview扩展类里

#pragma mark loadingview
@property (strong, nonatomic) easeloadingview *loadingview;
- (void)beginloading;
- (void)endloading;
@end
- (void)setloadingview:(easeloadingview *)loadingview{
 [self willchangevalueforkey:@"loadingviewkey"];
 objc_setassociatedobject(self, &loadingviewkey,
        loadingview,
        objc_association_retain_nonatomic);
 [self didchangevalueforkey:@"loadingviewkey"];
}
- (easeloadingview *)loadingview{
 return objc_getassociatedobject(self, &loadingviewkey);
}
- (void)beginloading{
 for (uiview *aview in [self.blankpagecontainer subviews]) {
  if ([aview iskindofclass:[easeblankpageview class]] && !aview.hidden) {
   return;
  }
 }
 if (!self.loadingview) { //初始化loadingview
  self.loadingview = [[easeloadingview alloc] initwithframe:self.bounds];
 }
 [self addsubview:self.loadingview];
 [self.loadingview mas_makeconstraints:^(masconstraintmaker *make) {
  make.self.edges.equalto(self);
 }];
 [self.loadingview startanimating];
}
- (void)endloading{
 if (self.loadingview) {
  [self.loadingview stopanimating];
 }
}

注意：cocoa的kvo模型中，有两种通知观察者的方式，自动通知和手动通知。顾名思义，自动通知由cocoa在属性值变化时自动通知观察者，而手动通知需要在值变化时调用 willchangevalueforkey:和didchangevalueforkey: 方法通知调用者。

3：使用页面调用

- (void)sendrequest{
 [self.view beginloading];
 __weak typeof(self) weakself = self;
 [[coding_netapimanager sharedmanager] request_codefile:_mycodefile withpro:_myproject andblock:^(id data, nserror *error) {
  [weakself.view endloading];
  if (data) {
   weakself.mycodefile = data;
   [weakself refreshcodeviewdata];
  }
  [weakself.view configblankpage:easeblankpagetypeview hasdata:(data != nil) haserror:(error != nil) reloadbuttonblock:^(id sender) {
   [weakself sendrequest];
  }];
 }];
}

其中[self.view beginloading]跟[weakself.view endloading]就可以调用动画效果；

补充：另一种是有很多不同的图片组成的动画效果，可以用每一张图片然后for遍历组成出动作效果；

//设置普通状态的动画图片
 nsmutablearray *idleimages = [nsmutablearray array];
 for (nsuinteger i = 1; i<=60; ++i) {
    uiimage *image = [uiimage imagenamed:[nsstring stringwithformat:@"dropdown_anim__000%zd",i]];
    [idleimages addobject:image];
  [idleimages addobject:image];
 }

以上内容是本文通过ios等待时动画效果的实现，希望对大家有所帮助。