CALayer和核心動畫
CALayer和UIView(CA框架)
- CALayer是View內(nèi)的圖層,現(xiàn)實圖案等內(nèi)容其實在這里面.(效率更快,不耗CUP)
- UIView只負責監(jiān)聽和點擊事件
CALayer的基本屬性
首先CA開頭的類,是屬于CG框架,UI屬性都要進行類型轉(zhuǎn)換.
- position和bounds(圖層建議使用bounds,不使用frame)位置和大小
- contents內(nèi)容(可顯示圖片,注意類型轉(zhuǎn)換為.CGImage.
redView.layer.contents = (__bridge id _Nullable)([UIImage imageNamed:@"CALayer2"].CGImage);
- backgroundColor背景色
- border邊框(邊框顏色borderColor,邊框?qū)挾萣orderWidth)
- shadow陰影,四個屬(shadowColor陰影顏色,shadowOffset陰影偏移量,shadowRadius高斯半徑)一起出現(xiàn)才能顯示,且陰影不透明度(shadowOpacity)要為1(默認為0).
- ** cornerRadius (邊角弧度), maskToBounds 是否裁剪成對存在**
- ** opacity ** 不透明度
- ** transform **仿射變換
只有l(wèi)ayer下核心動畫是假象,位置不發(fā)生改變.layer的transform位置也是發(fā)生改變的.
單獨創(chuàng)建Layer顯示
Layer特點:自帶隱式動畫,跟Layer除外,但可以手動關閉:
- 開始事物
- 設置行為不實現(xiàn)
- 寫你要實現(xiàn)的動畫
- 提交事務
//開啟事物
// [CATransaction begin];
//設置事物為不實現(xiàn)行為
// [CATransaction setDisableActions:YES];
self.layer.position = CGPointMake(100, 400);
//提交事物
// [CATransaction commit];```
1. 創(chuàng)建CALayer對象.
2. 設置Layer對象的屬性(使我們能看見)
3. 添加到父Layer中
``` [self.view.layer addSublayer:layer]; ```
#### transform屬性(仿射變換)
//旋轉(zhuǎn)(3D),理解3d旋轉(zhuǎn) ,在Z軸上旋轉(zhuǎn)常見,常用)
self.layer.transform = CATransform3DRotate(self.layer.transform, M_PI_2, 0, 0, 1);
//縮放(只能在x,y軸縮放,因為Z軸平移縮放視覺無法發(fā)現(xiàn))
self.layer.transform = CATransform3DScale(self.layer.transform, 0.8, 0.8, 1);
//平移(只能在x,y軸縮放,因為Z軸平移縮放視覺無法發(fā)現(xiàn))
self.layer.transform = CATransform3DTranslate(self.layer.transform, 10, 10, 0);
#### Layer時鐘動畫
知識點1:anchorPoint錨點和position位置,之間的關系
anchorPoint錨點(定點),范圍(0~1)決定Layer以錨點比例存在的位置,0,0在左下,默認在中心,0.5,0.5.
知識點2:CADisplayLink刷幀定時器,每秒刷新頻率60次.
CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"position"];
KeyPath參數(shù)transform.rotation 就是旋轉(zhuǎn)關鍵字
CADisplayLink *link = [CADisplayLink displayLinkWithTarget:self selector:@selector(move)];
[link addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
知識點3:根據(jù)日歷顯示當前時間
1. 獲取時間對象(NSDate)
2. 獲取當前日歷對象( NSCalendar )
3. 根據(jù)日歷獲取當前秒數(shù)
> NSInteger second = [calender component:NSCalendarUnitSecond fromDate:date];
1. 通過圖層顯示時針
2. 裁剪
3. 制作秒針(修改錨點位置)
4. 設置刷幀定時器(調(diào)用方法)
5. 方法內(nèi)實現(xiàn)秒針,旋轉(zhuǎn).
Layer的核心動畫(真實位置不發(fā)生改變).
動畫設置代理(隱式代理,不用遵守代理協(xié)議,這個協(xié)議作為代理的分類了)
> CABasicAnimation 基本動畫,可以實現(xiàn)平移翻轉(zhuǎn),縮放的動畫
> CAKeyframeAnimation 關鍵幀動畫,通過幀的形式播放動畫,可以有多個點 values屬性
> CAAnimationGroup 組動畫,內(nèi)部可以有多個動畫為一組播放.animations 屬性
> CATransition 轉(zhuǎn)場動畫
動畫的不返回屬性
basic.removedOnCompletion = NO;
basic.fillMode =
1. 轉(zhuǎn)場動畫需要手勢storyBoard拖入輕掃手勢.(需要幾個拖幾個手勢對象),加入到View的手勢中
2. 判斷手勢方向,顯示圖片內(nèi)容
3. 創(chuàng)建轉(zhuǎn)場動畫
> //設置屬性
transition.type = kCATransitionFade;//轉(zhuǎn)場方式
transition.subtype = kCATransitionFromRight;那個方向顯示轉(zhuǎn)場方式.
4. 加入到圖層Layer中
#### 小畫板案例
1. 搭建界面
2. 先畫單線
1. touchBegin取出起始點,繪制路徑,保存路徑(屬性接收touchMove中要用)
2. touchMove中添加線條.重繪
3. drawRect系統(tǒng)方法中渲染.
3. 畫多線:思路,多線就需要保存多組路徑,且首尾不想連.所以需要路徑數(shù)組
1. 創(chuàng)建路徑可變數(shù)組(記住實例化,可懶加載,也可awakeNIb中寫.
2. 將起始點路徑加入到這個數(shù)組中(touchBegin),根絕這個路徑添加線
3. 改變單條路徑渲染為遍歷數(shù)組渲染.
3. 改變線的顏色,粗細
1. 同過slider的的值傳遞到View中(屬性),更改線粗為屬性值
2. 傳遞點擊按鈕的背景顏色到內(nèi)部.內(nèi)部定以UIColor屬性,但是UIBezier內(nèi)沒有線的顏色屬性(怎么給這個路徑對象這個屬性呢??直接創(chuàng)建一個類繼承UIBezier,我們在內(nèi)部給他定義這個UIColor屬性,更改路徑為你自定義的這個類,給他UIColor屬性設置為外界傳進來的顏色),給你的每個路徑設置顏色.
4. 實現(xiàn)各個按鈕的點擊事件(記住原則控制器不關心內(nèi)部實現(xiàn),自己的事情自己做,他只負責調(diào)用方法.
1. 清除按鈕清除集合中的路徑
2. 返回:清除上一個元素
3. 擦除:用畫板的背景色在繪制這個顏色覆蓋原來的顏色
4. 保存圖片
- 開啟圖片上下文 UIGraphicsBeginImageContextWithOptions(self.myPaintView.bounds.size, NO, 0);
- 獲取當前上下文,因為截屏需要獲取上下文(整個就不用了) CGContextRef ctx = UIGraphicsGetCurrentContext();
- 截圖 [self.myPaintView.layer renderInContext:ctx];
- 獲取截圖 UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
- 關閉上下文 UIGraphicsEndImageContext();
- 保存到相冊 UIImageWriteToSavedPhotosAlbum(newImage, nil, nil, nil);
