先上 GitHub地址
GLWaveView 介紹
一個自帶波形動畫的View, 可以添加多層波浪且方便自定義, 三行代碼實現(xiàn)波形效果.
FitLineTest2.gif
使用方法
- 創(chuàng)建并添加 GLWaveView 到視圖當(dāng)中
- 給 GLWaveView 對象添加 GLWave
- 調(diào)用 startWaveAnimate
完整代碼如下:
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
GLWaveView *view = [[GLWaveView alloc] initWithFrame:self.view.bounds];
GLWave *waveA = [GLWave defaultWave];
waveA.offsetX = 100;
waveA.offsetY = 300;
waveA.height = 20;
waveA.width = 550;
waveA.speedX = 6;
waveA.fillColor = [UIColor colorWithRed:0.000 green:0.502 blue:1.000 alpha:0.450].CGColor;
GLWave *waveB = [GLWave defaultWave];
waveB.offsetX = 300;
waveB.offsetY = 305;
waveB.height = 15;
waveB.width = 750;
waveB.speedX = 9;
waveB.fillColor = [UIColor colorWithRed:0.000 green:0.502 blue:1.000 alpha:0.250].CGColor;
[view addWave:waveB];
[view addWave:waveA];
[self.view addSubview:view];
[view startWaveAnimate];
}
GLWave
為了方便理解和配置動畫參數(shù) GLWave 的所有單位均以屏幕像素為單位.
GLWave 有如下 public property:
@property (nonatomic, assign) CGFloat offsetX;///< x 位置的偏移量, default is 3
@property (nonatomic, assign) CGFloat offsetY;///< y 位置的偏移量, default is 0
@property (nonatomic, assign) CGFloat height;///< 波浪高度 單位:pixel, default is 50
@property (nonatomic, assign) CGFloat width;///< 波浪寬度 單位:pixel, default is 470
@property (nonatomic, assign) CGFloat speedX;///<系統(tǒng)默認(rèn)幀率60fps, 每幀會進(jìn)行一次 offsetX+=speedX操作
@property (nonatomic, assign) CGFloat speedY;///<系統(tǒng)默認(rèn)幀率60fps, 每幀會進(jìn)行一次 offsetY+=speedY操作
如下圖所示, width 就是波形一個周期的寬度, height 就是波形的振幅, speedX 就是每1/60秒波形x軸方向上位移的距離
WaveViewDemo1.png
