1.實(shí)現(xiàn)效果圖

2.畫(huà)板主要功能:
1.畫(huà)線
2.撤銷(xiāo)上一步操作
3.清空當(dāng)前畫(huà)板
4.橡皮擦
5.保存所畫(huà)內(nèi)容
3.兩種畫(huà)板制作思路:
3.1 drawRect + Touch操作(TouchesBegan、TouchesMoved以及TouchesEnd)
我們需要保存所有的線,假如用戶已經(jīng)畫(huà)了4條線,在畫(huà)第五條線的時(shí)候(第5條線TouchMoved的過(guò)程中),第5條線每畫(huà)一個(gè)點(diǎn),就要將前面4條線在drawRect方法里重繪一下,否則,前面的畫(huà)的線就會(huì)丟失。
可能存在的問(wèn)題:因?yàn)檫@些drawrect都是保存在內(nèi)存中的,每次都疊加前面的繪圖操作,很容易引起內(nèi)存的爆炸。所以使用時(shí)得格外注意。
如何解決這個(gè)問(wèn)題呢?我們可以看看CAShapeLayer方法
3.2 CAShapeLayer + UIBeizerPath +Touch操作(TouchesBegan、TouchesMoved以及TouchesEnd)
使用CAShapeLayer+ UIBeizerPath 來(lái)繪圖,不需要用到drawRect,使用CAShapeLayer方法的本質(zhì)上就是創(chuàng)建了很多
子CAShapeLayer,每個(gè)子CAShapeLayer對(duì)象都單獨(dú)保存了一個(gè)path,所以最后在屏幕顯示時(shí),系統(tǒng)會(huì)將當(dāng)前view的layer以及它的所有子layer都渲染出來(lái)。無(wú)形之中,其實(shí)我們創(chuàng)建了很多子CAShapeLayer對(duì)象,而這些CAShapeLayer據(jù)說(shuō)時(shí)GPU管理的的(不懂??),對(duì)內(nèi)存優(yōu)化確實(shí)挺大。(大家可以測(cè)試了看看)
4.橡皮擦功能
設(shè)計(jì)思路:
1.在ViewController模塊,準(zhǔn)備一個(gè)ImageView,并設(shè)置相應(yīng)的圖片,imageView添加到self.view當(dāng)中。
2.在imageView添加一個(gè)子view(SCDrawingView),我們將要在這個(gè)子view上做一些touchesBegan、TouchesMoved以及TouchedEnd操作。
3.創(chuàng)建SCStrokeLine對(duì)象,我們將要用這個(gè)對(duì)象存儲(chǔ)每次畫(huà)的path,以及每條path的一些屬性(線寬、線條顏色、blendMode)
悲傷的是,如果要用到橡皮擦功能,我們就不能用CAShapeLayer去畫(huà)線條了,至少暫時(shí)我沒(méi)找到解決方法。
5.保存所畫(huà)內(nèi)容
按照步驟4可知,我們準(zhǔn)備了一個(gè)imageView,以及在imageView添加了子view(SCDrawingView),最后我們要將所畫(huà)的內(nèi)容保存成一張圖片。
這時(shí)候,我們需要用到一個(gè)方法:
- (void)renderInContext:(CGContextRef)ctx;
注意,我們應(yīng)該在imageView上去開(kāi)一個(gè)圖形上下文,將imageView的layer渲染到當(dāng)前的上下文中,因?yàn)槲覀冊(cè)趇mageView中添加了子view(SCDrawingView),換句話說(shuō)imageView的layer也包含了SCDrawingView對(duì)象的layer,因此我們需要將imageview的layer渲染到畫(huà)板上,這樣才能得到SCDrawingView所畫(huà)的帶背景的線條。