# 二、工作原理

A :振幅,曲线最高位和最低位的距离

ω :角速度,用于控制周期大小，单位x中起伏的个数

K :偏距,曲线上下偏移量

φ :初相,曲线左右偏移量

# 三、代码

#define BackGroundColor [UIColor colorWithRed:96/255.0f green:159/255.0f blue:150/255.0f alpha:1]
#define WaveColor1 [UIColor colorWithRed:136/255.0f green:199/255.0f blue:190/255.0f alpha:1]
#define WaveColor2 [UIColor colorWithRed:28/255.0 green:203/255.0 blue:174/255.0 alpha:1]

#import "XLWave.h"

@interface XLWave ()
{
//前面的波浪
CAShapeLayer *_waveLayer1;
CAShapeLayer *_waveLayer2;

/**
曲线的振幅
*/
CGFloat _waveAmplitude;
/**
曲线角速度
*/
CGFloat _wavePalstance;
/**
曲线初相
*/
CGFloat _waveX;
/**
曲线偏距
*/
CGFloat _waveY;

/**
曲线移动速度
*/
CGFloat _waveMoveSpeed;
}
@end

@implementation XLWave

-(instancetype)initWithFrame:(CGRect)frame
{
if (self = [super initWithFrame:frame]) {
[self buildUI];
[self buildData];
}
return self;
}

//初始化UI
-(void)buildUI
{
//初始化波浪
//底层
_waveLayer1 = [CAShapeLayer layer];
_waveLayer1.fillColor = WaveColor1.CGColor;
_waveLayer1.strokeColor = WaveColor1.CGColor;

//上层
_waveLayer2 = [CAShapeLayer layer];
_waveLayer2.fillColor = WaveColor2.CGColor;
_waveLayer2.strokeColor = WaveColor2.CGColor;

//画了个圆
self.backgroundColor = BackGroundColor;
}

//初始化数据
-(void)buildData
{
//振幅
_waveAmplitude = 10;
//角速度
_wavePalstance = M_PI/self.bounds.size.width;
//偏距
_waveY = 0;
//初相
_waveX = 0;
//x轴移动速度
_waveMoveSpeed = _wavePalstance * 10;
//以屏幕刷新速度为周期刷新曲线的位置
}
/**
保持和屏幕的刷新速度相同，iphone的刷新速度是60Hz,即每秒60次的刷新
*/
{
//更新X
_waveX += _waveMoveSpeed;
[self updateWaveY];
[self updateWave1];
[self updateWave2];
}

//更新偏距的大小 直到达到目标偏距 让wave有一个匀速增长的效果
-(void)updateWaveY
{
CGFloat targetY = self.bounds.size.height - _progress * self.bounds.size.height;
if (_waveY < targetY) {
_waveY += 2;
}
if (_waveY > targetY ) {
_waveY -= 2;
}
}

//更新第一层曲线
-(void)updateWave1
{
//波浪宽度
CGFloat waterWaveWidth = self.bounds.size.width;
//初始化运动路径
CGMutablePathRef path = CGPathCreateMutable();
//设置起始位置
CGPathMoveToPoint(path, nil, 0, _waveY);
//初始化波浪其实Y为偏距
CGFloat y = _waveY;
//正弦曲线公式为： y=Asin(ωx+φ)+k;
for (float x = 0.0f; x <= waterWaveWidth ; x++) {
y = _waveAmplitude * cos(_wavePalstance * x + _waveX) + _waveY;
}
//填充底部颜色
CGPathCloseSubpath(path);
_waveLayer1.path = path;
CGPathRelease(path);
}

//更新第二层曲线
-(void)updateWave2
{
//波浪宽度
CGFloat waterWaveWidth = self.bounds.size.width;
//初始化运动路径
CGMutablePathRef path = CGPathCreateMutable();
//设置起始位置
CGPathMoveToPoint(path, nil, 0, _waveY);
//初始化波浪其实Y为偏距
CGFloat y = _waveY;
//正弦曲线公式为： y=Asin(ωx+φ)+k;
for (float x = 0.0f; x <= waterWaveWidth ; x++) {
y = _waveAmplitude * sin(_wavePalstance * x + _waveX) + _waveY;
}
//添加终点路径、填充底部颜色
CGPathCloseSubpath(path);
_waveLayer2.path = path;
CGPathRelease(path);

}

//设置需要显示的进度，y轴的更新会在[updateWaveY]方法中实现
-(void)setProgress:(CGFloat)progress
{
_progress = progress;
}

//停止动画
-(void)stop
{
}
}
//回收内存
-(void)dealloc
{
[self stop];
if (_waveLayer1) {
[_waveLayer1 removeFromSuperlayer];
_waveLayer1 = nil;
}
if (_waveLayer2) {
[_waveLayer2 removeFromSuperlayer];
_waveLayer2 = nil;
}
}

03-22

01-02

10-27 467

08-30

11-08 2130

03-22 812

07-21

09-23 237

06-09 1万+

11-11 882

11-23 1075

08-20 788

06-05

01-10 1844

06-03

11-09 2103

07-29 994

03-30 1933

04-23

09-25 1506

12-21 1735

06-25 4363

12-10 2万+

09-09

06-07 1200

04-25 33

02-10 975

09-17 4806

04-23 4842

04-29 239

09-19 1558

07-09 220

08-13 4万+

09-06

07-22 5701

05-19 8385

04-14 58万+

03-13 14万+

03-04 13万+

03-05 5961

03-08 4万+

03-08 7万+

03-10 12万+

03-12 11万+

03-13 11万+

03-14 1万+

03-18 5561

03-18 9026

03-19 3万+

03-19 8万+

03-20 7846

03-24 3万+

03-25 3万+

05-08 5万+

03-25 9万+

03-29 21万+

03-29 1万+

03-29 10万+

03-30 16万+

05-28 5355

05-28 1万+

04-02 4万+

04-03 3208

04-06 7万+

04-07 5万+

04-09 8万+

04-09 2万+

05-17 7701

04-10 2600

04-11 3万+

04-15 5万+

04-18 4万+

04-20 4万+

#### 太狠了，疫情期间面试，一个问题砍了我5000！

©️2019 CSDN 皮肤主题: 编程工作室 设计师: CSDN官方博客