iOS 进度条加载安装动画.docx

1、iOS 进度条加载安装动画iOS 进度条、加载、安装动画下面贴上代码：控制器ViewController：#import interface ViewController : UIViewControllerend/* -分割线- */#import ViewController.h#import HWWaveView.h#import HWCircleView.h#import HWProgressView.h#import HWInstallView.hinterface ViewController ()property (nonatomic, strong) NSTimer *time

2、r;property (nonatomic, weak) HWWaveView *waveView;property (nonatomic, weak) HWCircleView *circleView;property (nonatomic, weak) HWProgressView *progressView;property (nonatomic, weak) HWInstallView *installView;endimplementation ViewController- (void)viewDidLoad super viewDidLoad; /创建控件 self creatC

3、ontrol; /添加定时器 self addTimer;- (void)creatControl /波浪 HWWaveView *waveView = HWWaveView alloc initWithFrame:CGRectMake(30, 100, 150, 150); self.view addSubview:waveView; self.waveView = waveView; /圆圈 HWCircleView *circleView = HWCircleView alloc initWithFrame:CGRectMake(220, 100, 150, 150); self.vie

4、w addSubview:circleView; self.circleView = circleView; /进度条 HWProgressView *progressView = HWProgressView alloc initWithFrame:CGRectMake(30, 365, 150, 20); self.view addSubview:progressView; self.progressView = progressView; /加载安装效果 HWInstallView *installView = HWInstallView alloc initWithFrame:CGRe

5、ctMake(220, 300, 150, 150); self.view addSubview:installView; self.installView = installView;- (void)addTimer _timer = NSTimer scheduledTimerWithTimeInterval:0.2f target:self selector:selector(timerAction) userInfo:nil repeats:YES; NSRunLoop mainRunLoop addTimer:_timer forMode:NSRunLoopCommonModes;-

6、 (void)timerAction _waveView.progress += 0.01; _circleView.progress += 0.01; _progressView.progress += 0.01; _installView.progress += 0.01; if (_waveView.progress = 1) self removeTimer; NSLog(完成); - (void)removeTimer _timer invalidate; _timer = nil;end波浪HWWaveView：#import interface HWWaveView : UIVi

7、ewproperty (nonatomic, assign) CGFloat progress;end/* -分割线- */#import HWWaveView.h#define KHWWaveFillColor UIColor groupTableViewBackgroundColor /填充颜色#define KHWWaveTopColor UIColor colorWithRed:0/255.0 green:191/255.0 blue:255/255.0 alpha:1.0f /前面波浪颜色#define KHWWaveBottomColor UIColor colorWithRed:

8、0/255.0 green:191/255.0 blue:255/255.0 alpha:0.4f /后面波浪颜色interface HWWaveView ()property (nonatomic, strong) CADisplayLink *displayLink;property (nonatomic, assign) CGFloat wave_amplitude;/振幅a（y = asin(wx+) + k）property (nonatomic, assign) CGFloat wave_cycle;/周期wproperty (nonatomic, assign) CGFloat

9、wave_h_distance;/两个波水平之间偏移property (nonatomic, assign) CGFloat wave_v_distance;/两个波竖直之间偏移property (nonatomic, assign) CGFloat wave_scale;/水波速率property (nonatomic, assign) CGFloat wave_offsety;/波峰所在位置的y坐标property (nonatomic, assign) CGFloat wave_move_width;/移动的距离，配合速率设置_property (nonatomic, assign) C

10、GFloat wave_offsetx;/偏移property (nonatomic, assign) CGFloat offsety_scale;/上升的速度endimplementation HWWaveView- (instancetype)initWithFrame:(CGRect)frame if (self = super initWithFrame:frame) self.backgroundColor = UIColor clearColor; /初始化信息 self initInfo; return self;- (void)initInfo /进度 _progress =

11、0; /振幅 _wave_amplitude = self.frame.size.height / 25; /周期 _wave_cycle = 2 * M_PI / (self.frame.size.width * 0.9); /两个波水平之间偏移 _wave_h_distance = 2 * M_PI / _wave_cycle * 0.6; /两个波竖直之间偏移 _wave_v_distance = _wave_amplitude * 0.4; /移动的距离，配合速率设置 _wave_move_width = 0.5; /水波速率 _wave_scale = 0.4; /上升的速度 _of

12、fsety_scale = 0.1; /波峰所在位置的y坐标，刚开始的时候_wave_offsety是最大值 _wave_offsety = (1 - _progress) * (self.frame.size.height + 2 * _wave_amplitude); self addDisplayLinkAction;- (void)addDisplayLinkAction _displayLink=CADisplayLinkdisplayLinkWithTarget:self selector:selector(displayLinkAction); _displayLinkaddTo

13、RunLoop:NSRunLoopmainRunLoop forMode:NSRunLoopCommonModes;- (void)displayLinkAction _wave_offsetx += _wave_move_width * _wave_scale; /完成 if (_wave_offsety = 0.01) self removeDisplayLinkAction; self setNeedsDisplay;- (void)removeDisplayLinkAction _displayLink invalidate; _displayLink = nil;- (void)dr

14、awRect:(CGRect)rect UIBezierPath *path = UIBezierPath bezierPathWithOvalInRect:rect; KHWWaveFillColor setFill; path fill; path addClip; /绘制两个波形图 self drawWaveColor:KHWWaveTopColor offsetx:0 offsety:0; selfdrawWaveColor:KHWWaveBottomColoroffsetx:_wave_h_distance offsety:_wave_v_distance;- (void)drawW

15、aveColor:(UIColor *)color offsetx:(CGFloat)offsetx offsety:(CGFloat)offsety /波浪动画，进度的实际操作范围是，多加上两个振幅的高度，到达设置进度的位置y CGFloat end_offY = (1 - _progress) * (self.frame.size.height + 2 * _wave_amplitude); if (_wave_offsety != end_offY) if (end_offY _wave_offsety) _wave_offsety=MAX(_wave_offsety -= (_wave

16、_offsety - end_offY) * _offsety_scale, end_offY); lse _wave_offsety=MIN(_wave_offsety+=(end_offY- _wave_offsety) * _offsety_scale, end_offY); UIBezierPath *wavePath = UIBezierPath bezierPath; for (float next_x = 0.f; next_x = self.frame.size.width; next_x +) /正弦函数，绘制波形 CGFloat next_y = _wave_amplitu

17、de * sin(_wave_cycle * next_x + _wave_offsetx + offsetx / self.bounds.size.width * 2 * M_PI) + _wave_offsety + offsety; if (next_x = 0) wavePath moveToPoint:CGPointMake(next_x, next_y - _wave_amplitude); else wavePath addLineToPoint:CGPointMake(next_x, next_y - _wave_amplitude); wavePath addLineToPo

18、int:CGPointMake(self.frame.size.width, self.frame.size.height); wavePath addLineToPoint:CGPointMake(0, self.bounds.size.height); color set; wavePath fill;end圆圈HWCircleView：#import interface HWCircleView : UIViewproperty (nonatomic, assign) CGFloat progress;end/* -分割线- */#import HWCircleView.h#define

19、 KHWCircleLineWidth 10.0f#define KHWCircleFont UIFont boldSystemFontOfSize:26.0f#define KHWCircleColor UIColor colorWithRed:0/255.0 green:191/255.0 blue:255/255.0 alpha:1interface HWCircleView ()property (nonatomic, weak) UILabel *cLabel;endimplementation HWCircleView- (instancetype)initWithFrame:(C

20、GRect)frame if (self = super initWithFrame:frame) self.backgroundColor = UIColor clearColor; /百分比标签 UILabel *cLabel = UILabel alloc initWithFrame:self.bounds; cLabel.font = KHWCircleFont; cLabel.textColor = KHWCircleColor; cLabel.textAlignment = NSTextAlignmentCenter; self addSubview:cLabel; self.cL

21、abel = cLabel; return self;- (void)setProgress:(CGFloat)progress _progress = progress; _cLabel.text = NSString stringWithFormat:%d%, (int)floor(progress * 100); self setNeedsDisplay;- (void)drawRect:(CGRect)rect /路径 UIBezierPath *path = UIBezierPath alloc init; /线宽 path.lineWidth = KHWCircleLineWidt

22、h; /颜色 KHWCircleColor set; /拐角 path.lineCapStyle = kCGLineCapRound; path.lineJoinStyle = kCGLineJoinRound; /半径 CGFloat radius = (MIN(rect.size.width, rect.size.height) - KHWCircleLineWidth) * 0.5; /画弧（参数：中心、半径、起始角度(3点钟方向为0)、结束角度、是否顺时针） thaddArcWithCenter:(CGPoint)rect.size.width * 0.5, rect.size.hei

23、ght * 0.5 radius:radius startAngle:M_PI * 1.5 endAngle:M_PI * 1.5 + M_PI * 2 * _progress clockwise:YES; /连线 path stroke;end进度条HWProgressView：#import interface HWProgressView : UIViewproperty (nonatomic, assign) CGFloat progress;end/* -分割线- */#import HWProgressView.h#define KProgressBorderWidth 2.0f#

24、define KProgressPadding 1.0f#define KProgressColor UIColor colorWithRed:0/255.0 green:191/255.0 blue:255/255.0 alpha:1interface HWProgressView ()property (nonatomic, weak) UIView *tView;endimplementation HWProgressView- (instancetype)initWithFrame:(CGRect)frame if (self = super initWithFrame:frame)

25、/边框 UIView *borderView = UIView alloc initWithFrame:self.bounds; borderView.layer.cornerRadius = self.bounds.size.height * 0.5; borderView.layer.masksToBounds = YES; borderView.backgroundColor = UIColor whiteColor; borderView.layer.borderColor = KProgressColor CGColor; borderView.layer.borderWidth =

26、 KProgressBorderWidth; self addSubview:borderView; /进度 UIView *tView = UIView alloc init; tView.backgroundColor = KProgressColor; tView.layer.cornerRadius = (self.bounds.size.height - (KProgressBorderWidth + KProgressPadding) * 2) * 0.5; tView.layer.masksToBounds = YES; self addSubview:tView; self.t

27、View = tView; return self;- (void)setProgress:(CGFloat)progress _progress = progress; CGFloat margin = KProgressBorderWidth + KProgressPadding; CGFloat maxWidth = self.bounds.size.width - margin * 2; CGFloat heigth = self.bounds.size.height - margin * 2; _tView.frame = CGRectMake(margin, margin, max

28、Width * progress, heigth);end加载安装效果HWInstallView：#import interface HWInstallView : UIViewproperty (nonatomic, assign) CGFloat progress;end/* -分割线- */#import HWInstallView.h#define KHWInstallViewMargin 10#define KHWInstallColor UIColor colorWithRed:0/255.0 green:191/255.0 blue:255/255.0 alpha:1implem

29、entation HWInstallView- (instancetype)initWithFrame:(CGRect)frame if (self = super initWithFrame:frame) self.backgroundColor = UIColor clearColor; return self;- (void)setProgress:(CGFloat)progress _progress = progress; self setNeedsDisplay;- (void)drawRect:(CGRect)rect CGContextRef context = UIGraphicsGetCurrentContex