201905 - 育灵童技术部博客空间

从零开始画图标系列：启动图标设计指南

2019-5-10 zhenggaoyun 视觉设计

想要在启动图标设计上入门，就要先从规范开始学习，然后了解不同的风格以及对应风格的设计过程。

阅读全文>>

评论(0) 浏览(973)

PHP 7.4 新语法：箭头函数

2019-5-10 dingshangchao php开发

短闭包，也叫做箭头函数，是一种用 php 编写的短函数。

阅读全文>>

评论(0) 浏览(879)

简单的网络加载图的实现

2019-5-10 王建伟 iOS开发

在编写项目的时候我们需要进行网络的加载，那么网络加载需要时间和重新加载的选项，所以我们可以需要一个加载界面，在网络加载的过程中，重新加载的时候呈现

编辑一个简单的网络加载界面，我们需要一个加载动画，以及加载成功或者失败的处理方法

1.建立一个UIView的子类，LoadingView

2.我们需要的属性：
a:CAShapeLayer*_loadingShapeLayer(制作简单动画);
b:UILabel*promptLabel(提示文字);
c:UIButton*reloadButton(重新加载按键) ;
d:LoadingFailBlock failBlock(加载失败的事件处理块)

3.初始化界面

+(LoadingView*)ShowLoadingViewFrame:(CGRect)frame withSuperView:(UIView *)view{
     LoadingView*loadingview=[[LoadingView alloc]initWithFrame:frame];
     [view addSubview:loadingview];
     [loadingview loadingShapeLayerAnimation];
     return loadingview;
}

-(instancetype)initWithFrame:(CGRect)frame{
    if(self=[super initWithFrame:frame]){
        self.backgroundColor=[UIColor whiteColor];
        _loadingShapeLayer=[[CAShapeLayer alloc]init];
        _loadingShapeLayer.frame=SPFrame(frame.size.width/2-40, frame.size.height/2-100, 80,80 );
        _loadingShapeLayer.path=[UIBezierPath bezierPathWithOvalInRect:SPFrame(0, 0, 80,80 )].CGPath;
        _loadingShapeLayer.fillColor=nil;
        _loadingShapeLayer.strokeColor=[UIColor lightGrayColor].CGColor;
        _loadingShapeLayer.lineWidth=2;
        _loadingShapeLayer.lineJoin=kCALineCapRound;
        _loadingShapeLayer.lineDashPattern=@[@15,@8];
        [self.layer addSublayer:_loadingShapeLayer];
        
        promptLabel=[[UILabel alloc]initWithFrame:SPFrame(frame.size.width/2-40, frame.size.height/2-100, 80,80 )];
        promptLabel.backgroundColor=[UIColor clearColor];
        promptLabel.text=@"正在加载";
        promptLabel.textColor=[UIColor lightGrayColor];
        promptLabel.font=SPFont(15);
        promptLabel.textAlignment=NSTextAlignmentCenter;
        [self addSubview:promptLabel];
      
    }
    
    return self;
}

4.实现方法：加载成功

-(void)LoadingSuccessComplation:(void (^)(void))complation{
    SPSelf;
    [UIView animateWithDuration:2 delay:0 usingSpringWithDamping:1 initialSpringVelocity:0.0f options:UIViewAnimationOptionLayoutSubviews animations:^{
        weakSelf.transform=CGAffineTransformMakeScale(0.001, 0.001);
    } completion:^(BOOL finished) {
        [weakSelf removeFromSuperview];
        
    }];
    
    if(complation){
       complation();
    }

    
}

5.实现方法：加载失败

- (void)LoadingFailComplation:(void (^)(void))complation{
    [self stopLoadingShapeLayerAnimation];
    promptLabel.text=@"加载失败";
    [self createReloadingButton];
    SPSelf;
    if(complation){
        weakSelf.failBlock = complation;
    }
    
}
-(void)createReloadingButton{
    reloadButton=[[UIButton alloc]initWithFrame:SPFrame(0, 0, 100, 30)];
    reloadButton.center=SPPoint(self.frame.size.width/2, self.frame.size.height/2+50);
    [reloadButton setTitle:@"重新加载" forState:UIControlStateNormal];
    [reloadButton setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
    reloadButton.backgroundColor=[UIColor whiteColor];
    reloadButton.layer.cornerRadius=14;
    reloadButton.layer.masksToBounds=YES;
    reloadButton.layer.borderWidth=1;
    reloadButton.layer.borderColor=[UIColor orangeColor].CGColor;
    reloadButton.titleLabel.font=SPFont(14);
    [reloadButton addTarget:self action:@selector(reloadEvent) forControlEvents:UIControlEventTouchUpInside];
    [self addSubview:reloadButton];
    
}
/*
 ＊重新加载按键点击事件＊
 */
-(void)reloadEvent{
    [reloadButton removeFromSuperview];
    [self loadingShapeLayerAnimation];
    self.failBlock();
    
}

6.动画实现

/*
 ＊load圈转动＊
 */
-(void)loadingShapeLayerAnimation{
    CABasicAnimation*rotate=[CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    rotate.fromValue=0;
    rotate.toValue=@(M_PI*2);
    rotate.duration=3;
    rotate.timingFunction=[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    rotate.repeatCount=HUGE;
    rotate.fillMode=kCAFillModeForwards;
    rotate.removedOnCompletion=NO;
    [_loadingShapeLayer addAnimation:rotate forKey:rotate.keyPath];
    
}

评论(0) 浏览(1073)