1.實(shí)現(xiàn)效果圖
2.畫板主要功能:
1.畫線
2.撤銷上一步操作
3.清空當(dāng)前畫板
4.橡皮擦
5.保存所畫內(nèi)容
3.兩種畫板制作思路:
3.1 drawRect + Touch操作(TouchesBegan形耗、TouchesMoved以及TouchesEnd)
我們需要保存所有的線,假如用戶已經(jīng)畫了4條線,在畫第五條線的時(shí)候(第5條線TouchMoved的過程中)誊役,第5條線每畫一個(gè)點(diǎn)般堆,就要將前面4條線在drawRect方法里重繪一下剔猿,否則硕糊,前面的畫的線就會(huì)丟失峦嗤。
可能存在的問題:因?yàn)檫@些drawrect都是保存在內(nèi)存中的蕊唐,每次都疊加前面的繪圖操作,很容易引起內(nèi)存的爆炸烁设。所以使用時(shí)得格外注意替梨。
如何解決這個(gè)問題呢?我們可以看看CAShapeLayer方法
3.2 CAShapeLayer + UIBeizerPath +Touch操作(TouchesBegan装黑、TouchesMoved以及TouchesEnd)
使用CAShapeLayer+ UIBeizerPath 來繪圖副瀑,不需要用到drawRect,使用CAShapeLayer方法的本質(zhì)上就是創(chuàng)建了很多
子CAShapeLayer恋谭,每個(gè)子CAShapeLayer對象都單獨(dú)保存了一個(gè)path糠睡,所以最后在屏幕顯示時(shí),系統(tǒng)會(huì)將當(dāng)前view的layer以及它的所有子layer都渲染出來箕别。無形之中铜幽,其實(shí)我們創(chuàng)建了很多子CAShapeLayer對象滞谢,而這些CAShapeLayer據(jù)說時(shí)GPU管理的的(不懂串稀??)狮杨,對內(nèi)存優(yōu)化確實(shí)挺大母截。(大家可以測試了看看)
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對象,我們將要用這個(gè)對象存儲每次畫的path盔夜,以及每條path的一些屬性(線寬负饲、線條顏色、blendMode)
悲傷的是喂链,如果要用到橡皮擦功能返十,我們就不能用CAShapeLayer去畫線條了,至少暫時(shí)我沒找到解決方法椭微。
5.保存所畫內(nèi)容
按照步驟4可知洞坑,我們準(zhǔn)備了一個(gè)imageView,以及在imageView添加了子view(SCDrawingView)蝇率,最后我們要將所畫的內(nèi)容保存成一張圖片迟杂。
這時(shí)候,我們需要用到一個(gè)方法:
- (void)renderInContext:(CGContextRef)ctx;
注意本慕,我們應(yīng)該在imageView上去開一個(gè)圖形上下文逢慌,將imageView的layer渲染到當(dāng)前的上下文中,因?yàn)槲覀冊趇mageView中添加了子view(SCDrawingView)间狂,換句話說imageView的layer也包含了SCDrawingView對象的layer攻泼,因此我們需要將imageview的layer渲染到畫板上,這樣才能得到SCDrawingView所畫的帶背景的線條鉴象。