說(shuō)個(gè)故事：
UI設(shè)計(jì)對(duì)大家說(shuō):“我們拒絕炒現(xiàn)飯!"雹拄。
然后就加了一波特效收奔。
程序員猝。
效果分析：
1.水波動(dòng)畫(huà)滓玖。
2.背景顏色漸變坪哄。
實(shí)現(xiàn)思路：
1.水波動(dòng)畫(huà)，用CGMutablePathRef和三角函數(shù)畫(huà)出波浪線势篡，讓后利用CADisplayLink將內(nèi)容實(shí)時(shí)更新到屏幕上翩肌。
2.背景顏色漸變，利用漸變層CAGradientLayer將背景顏色由到深漸變禁悠，然后在利用定時(shí)器加三角函數(shù)實(shí)時(shí)變動(dòng)起點(diǎn)和終點(diǎn)的顏色念祭。
代碼邏輯：
代碼直接看demo吧DCGradientView
背景顏色漸變的核心代碼如下：
關(guān)于顏色漸變嘗試過(guò)的代碼：
if (self.gradLayer == nil) {
self.gradLayer = [CAGradientLayer layer];
self.gradLayer.frame = self.bounds;
}
self.gradLayer.startPoint = CGPointMake(0, 0.8);
self.gradLayer.endPoint = CGPointMake(1, 0.2);
//create colors, important section
NSMutableArray *colors = [NSMutableArray array];
for (NSInteger deg = 0; deg <= 360; deg += 1) {
UIColor *color;
color = [UIColor colorWithHue:1.0 * deg / 360.0
saturation:1.0
brightness:1.0
alpha:1.0];
[colors addObject:(id)[color CGColor]];
}
[self.gradLayer setColors:[NSArray arrayWithArray:colors]];
效果如下：
可以通過(guò)改變for循環(huán)里面的區(qū)間值，從而達(dá)到某一顏色漸變的效果碍侦。但是選取的顏色始終達(dá)不到設(shè)計(jì)的要求粱坤，所以放棄。
還嘗試?yán)霉接?jì)算RGB瓷产。
Gradient = A + (B-A) / Step * N每個(gè)RGB都要利用這個(gè)公式計(jì)算站玄，A是開(kāi)始值，B是結(jié)束值濒旦，Step分成的總份數(shù)株旷，N是當(dāng)前的份數(shù)。
NSMutableArray *colors = [NSMutableArray array];
for (int i = 1; i<17; i ++) {
float r = 37 + (13-37)/16*i;
float g = 191 + (150-191)/16*i;
float b = 191 + (173-191)/16*i;
UIColor *color = [UIColor colorWithRed:r/255.0 green:g/255.0 blue:b/255.0 alpha:1];
[colors addObject:(id)[color CGColor]];
}
for (int i = 1; i<17; i ++) {
float r2 = 13 + (37-13)/16*i;
float g2 = 150 + (191-150)/16*i;
float b2 = 173 + (191-173)/16*i;
UIColor *color2 = [UIColor colorWithRed:r2/255.0 green:g2/255.0 blue:b2/255.0 alpha:1];
[colors addObject:(id)[color2 CGColor]];
}
顏色由淺到深尔邓，再由深到淺逐漸變化晾剖，所以對(duì)稱著添加了一遍。這實(shí)現(xiàn)的效果跟最終效果很接近铃拇，但是仔細(xì)看會(huì)發(fā)現(xiàn)钞瀑，顏色會(huì)有一條條的感覺(jué)，顏色分布不是很細(xì)膩慷荔。所以也放棄雕什。
DCGradientView#
怎么覺(jué)得代碼清楚得連注釋都不用寫(xiě)-_-``
轉(zhuǎn)載請(qǐng)注明出處
