IOS 自訂控制項之UIActivityIndicatorView，iosuiactivity

IOS 自訂控制項之UIActivityIndicatorView，iosuiactivity

原創blog，轉載請註明出處
blog.csdn.net/hello_hwc

前言
這個系列的本身不是為了寫一些東西讓讀者拿過去就直接可以用的。過段時間我會在github上傳一些拿去就可以用的。這個系列的本身是希望拋磚引玉，提供一些自訂控制項的思路。
本文的內容

• 闡述了實現自訂UIActivityIndicator的過程

希望通過本文，讀者能夠學會

• CAShapeLayer的簡單使用
• CAGradientLayer的簡單使用

• 自訂控制項的一些思路

  一 demo效果
  

二 實現的過程

_shapeLayer = [CAShapeLayer layer];        _shapeLayer.bounds = CGRectMake(0, 0, 100,100);        _shapeLayer.position = CGPointMake(50,50);        _shapeLayer.strokeColor = [UIColor blueColor].CGColor;        _shapeLayer.fillColor = [UIColor clearColor].CGColor;        CGMutablePathRef path = CGPathCreateMutable();        _shapeLayer.lineWidth = 5.0;//        _shapeLayer.backgroundColor = [UIColor purpleColor].CGColor;        CGPathAddArc(path, nil,50, 50,45,0,2*M_PI,YES);        _shapeLayer.path = path;

2 用CAGradientLayer定義漸層，用上文的環形路徑去截取。

 _indicatorLayer = [[CAGradientLayer alloc] init];        _indicatorLayer.bounds = CGRectMake(0, 0, 100,100);        _indicatorLayer.position = CGPointMake(50,50);        _indicatorLayer.colors = @[(id)[UIColor blueColor].CGColor,                                   (id)[UIColor greenColor].CGColor,                                   (id)[UIColor blueColor].CGColor];        _indicatorLayer.locations  = @[@(0.25), @(0.5), @(0.75)];        _indicatorLayer.startPoint = CGPointMake(0.0, 0.0);        _indicatorLayer.endPoint = CGPointMake(1.0,1.0);        _indicatorLayer.masksToBounds = YES;        [_indicatorLayer setMask:self.shapeLayer];//截取

3 在Start函數中開始動畫，stop結束動畫

-(void)start{    self.hidden = NO;    [UIView animateWithDuration:1.0                          delay:0.0                        options:UIViewAnimationOptionRepeat | UIViewAnimationOptionCurveLinear                        animations:^{                            self.transform = CGAffineTransformMakeRotation(M_PI);                        } completion:^(BOOL finished) {                        }];}-(void)stop{    [self.indicatorLayer removeAllAnimations];    self.hidden = YES;}

4 使用

- (IBAction)start:(id)sender {    [self.spinner start];}- (IBAction)stop:(id)sender {    [self.spinner stop];}- (void)viewDidLoad {    [super viewDidLoad];        self.spinner = [[WCActivityIndicicator alloc] init];    self.spinner.bounds = CGRectMake(0, 0, 100,100);    self.spinner.center = self.view.center;    [self.view addSubview:self.spinner];    // Do any additional setup after loading the view, typically from a nib.}

最後，附上完整的demo代碼，不要直接拿去用，很多地方我沒有完善的，僅供學習使用。
WCActivityIndicicator.h

////  WCActivityIndicicator.h//  WCActivityindicator////  Created by huangwenchen on 15/2/17.//  Copyright (c) 2015年 huangwenchen. All rights reserved.//#import <UIKit/UIKit.h>#import <QuartzCore/QuartzCore.h>@interface WCActivityIndicicator : UIView@property (strong,nonatomic) UIColor * color;-(instancetype)init;-(void)start;-(void)stop;@end

WCActivityIndicicator.m

////  WCActivityIndicicator.m//  WCActivityindicator////  Created by huangwenchen on 15/2/17.//  Copyright (c) 2015年 huangwenchen. All rights reserved.//#import "WCActivityIndicicator.h"@interface WCActivityIndicicator()@property (strong,nonatomic) CAGradientLayer * indicatorLayer;@property (strong,nonatomic) CAShapeLayer * shapeLayer;@end@implementation WCActivityIndicicator-(CAShapeLayer *)shapeLayer{    if (!_shapeLayer) {        _shapeLayer = [CAShapeLayer layer];        _shapeLayer.bounds = CGRectMake(0, 0, 100,100);        _shapeLayer.position = CGPointMake(50,50);        _shapeLayer.strokeColor = [UIColor blueColor].CGColor;        _shapeLayer.fillColor = [UIColor clearColor].CGColor;        CGMutablePathRef path = CGPathCreateMutable();        _shapeLayer.lineWidth = 5.0;//        _shapeLayer.backgroundColor = [UIColor purpleColor].CGColor;        CGPathAddArc(path, nil,50, 50,45,0,2*M_PI,YES);        _shapeLayer.path = path;        //        roundShape.path    }    return _shapeLayer;}-(CAGradientLayer *)indicatorLayer{    if (!_indicatorLayer){        _indicatorLayer = [[CAGradientLayer alloc] init];        _indicatorLayer.bounds = CGRectMake(0, 0, 100,100);        _indicatorLayer.position = CGPointMake(50,50);        _indicatorLayer.colors = @[(id)[UIColor blueColor].CGColor,                                   (id)[UIColor greenColor].CGColor,                                   (id)[UIColor blueColor].CGColor];        // 顏色分割線        _indicatorLayer.locations  = @[@(0.25), @(0.5), @(0.75)];        _indicatorLayer.startPoint = CGPointMake(0.0, 0.0);        _indicatorLayer.endPoint = CGPointMake(1.0,1.0);        _indicatorLayer.masksToBounds = YES;        [_indicatorLayer setMask:self.shapeLayer];    }    return _indicatorLayer;}/*// Only override drawRect: if you perform custom drawing.// An empty implementation adversely affects performance during animation.- (void)drawRect:(CGRect)rect {    // Drawing code}*/-(void)start{    self.hidden = NO;    [UIView animateWithDuration:1.0                          delay:0.0                        options:UIViewAnimationOptionRepeat | UIViewAnimationOptionCurveLinear                        animations:^{                            self.transform = CGAffineTransformMakeRotation(M_PI);                        } completion:^(BOOL finished) {                        }];}-(void)stop{    [self.indicatorLayer removeAllAnimations];    self.hidden = YES;}-(void)setUp{    self.bounds = CGRectMake(0, 0,100,100);    [self.layer addSublayer:self.indicatorLayer];    self.hidden = YES;}-(instancetype)init{    if (self = [super init]) {        [self setUp];    }    return self;}@end

使用的viewcontroller

////  ViewController.m//  WCActivityindicator////  Created by huangwenchen on 15/2/17.//  Copyright (c) 2015年 huangwenchen. All rights reserved.//#import "ViewController.h"#import "WCActivityIndicicator.h"@interface ViewController ()@property (strong,nonatomic)WCActivityIndicicator * spinner;@end@implementation ViewController- (IBAction)start:(id)sender {    [self.spinner start];}- (IBAction)stop:(id)sender {    [self.spinner stop];}- (void)viewDidLoad {    [super viewDidLoad];        self.spinner = [[WCActivityIndicicator alloc] init];    self.spinner.bounds = CGRectMake(0, 0, 100,100);    self.spinner.center = self.view.center;    [self.view addSubview:self.spinner];    // Do any additional setup after loading the view, typically from a nib.}@end