7 繪圖和手勢: Core Graphics(核心繪圖)/UIGestureRecognizer(手勢) - 斯坦福 iOS

一些結(jié)構(gòu)體

 //CGFloat:
 //CGPoint: 有 CGFloat x 和 CGFloat y 兩個元素
 //CGSize: 有 CGFloat width 和 CGFloat height 兩個屬性
 //CGRect: 有 CGPoint origin 和 CGSize size 兩個屬性

View 的創(chuàng)建方法

 //view 的創(chuàng)建方法
 - (void)awakeFromNib;
 - (void)init;
 - (void)initWithFrame:(CGRect)aRect;

 //view 的添加和移除方法
 - (void)addSubview:(UIView *)aView;
 - (void)removeFromSuperView;

 //@property(nonatomic) CGRect bounds;  //它描述了在它自己的坐標(biāo)系中的位置和大小
 //@property(nonatomic) CGPoint center; //描述了父視圖的中心位置
 //@property(nonatomic) CGRect frame;   //它描述了在它在父視圖坐標(biāo)系統(tǒng)視圖的位置和大小

Custom Views

 - (void)drawRect:(CGRect)aRect;    //實現(xiàn)這個方法就可以繪制內(nèi)容, 這個方法是系統(tǒng)自動調(diào)用的, 不用手動調(diào)用(每次調(diào)用這個方法會刷新上下文)
 - (void)setNeedsDisplay;   //重新繪制視圖(它會調(diào)用 drawRect 方法)
 - (void)setNeedsDisplayInRect:(CGRect)aRect;  //傳進來的矩形會被重繪 

 //如何實現(xiàn) drawRect:? 
    方法是使用 Quartz 庫,叫做 Core Graphics(核心繪圖) \
    Core Graphics 有很多 C 函數(shù),函數(shù)名以 CG 開頭, 幾乎都以 context上下文 作為第一個參數(shù) \
    還可以使用 UIBezierPath 類, UIBezierPath類可以把各種復(fù)雜的形狀, 組成一個大的路徑 \
    然后你可以在屏幕止對其進行描邊或填充 \

 //Core Graphics(核心繪圖) 的基本流程 \
    1.你需要有一個繪制的Context(上下文) \
    2.你需要創(chuàng)建路徑 \
    3.然后設(shè)置顏色,線寬,描邊,填充等屬性 \
    4.對路徑進行描邊和填充 \

 //UIBezierPath 封裝了上面4步的全部操作(其實也是操作上下文)
 //1.如何獲得上下文? \
    一般 UIKit 會在調(diào)用 drawRect: 前設(shè)置好上下文, 所以當(dāng)執(zhí)行到 drawRect: 時上下文就可以使用了 \
    //CGContextRef context = UIGraphicsGetCurrentContext(); //如果在 drawRect: 中調(diào)用這個方法就可以獲取上下文 \

 //2.如何定義路徑? \
    UIBezierPath *path = [[UIBezierPath alloc] init]; //創(chuàng)建一個路徑(畫三角形) \

    [path moveToPoint:CGPointMake(75,10)];      //移動到點 \
    [path addLineToPoint:CGPointMake(160,150)]; //連線到點 \
    [path addLineToPoint:CGPointMake(10.150)];  //連線到點 \

    [path closePath];   //封閉路徑 \

 //3.如何設(shè)設(shè)置顏色,線寬,描邊,填充等屬性?(除了描邊和填充其它的都用 UIBezierPath類 進行設(shè)置) \

    //[[UIColor greenColor] set];   //調(diào)用 set 方法會把描邊和填充設(shè)置為一個顏色
    [[UIColor greenColor] setFill]; //設(shè)置填充的顏色
    [[UIColor redColor] setStroke]; //設(shè)置描邊的顏色
    path.lineWidth = 2.0;   //設(shè)置線寬為2

 //4.如何進行描邊和填充? \

    [path fill];
    [path stroke];

UIBezierPath 的一些其它方法

    //1.bezierPathWithRoundedRect: cornerRadius: 方法返回一個圓角矩形 \
    UIBezierPath *roundedRect = [UIBezierPath bezierPathWithRoundedRect:(CGRect)bounds cornerRadius:(CGFloat)radius]; \

    //2.使用 UIBezierPath 來裁剪繪圖 \
    如果你想繪制某種圖案, 但是想讓它出現(xiàn)在一個圓角矩形內(nèi) \
    你只要生成一個圓角矩形, 然后調(diào)用 addClip 方法 \
    從這之后,你的所有繪圖都會被裁剪, 出現(xiàn)在那個圓角矩形路徑內(nèi), 并且還可以添加更多的裁剪區(qū)域 \
    [roundedRect addClip]; \

 //3.上下文的存檔與恢復(fù) \
    CGContextSaveGState ( CGContextRef c );    //上下文的存檔 \
    CGContextRestoreGState ( CGContextRef c ); //恢復(fù)到最近的存檔 \


 //4.在上下文中繪制文本(屬性字符串), 調(diào)用 NSAttributedString 的 drawAtPoint方法 \

     //創(chuàng)建屬性化字符串, 添加所需要的屬性
    NSAttributedString *text = [[NSAttributedString alloc] initWithString:@"colinwang" attributes:@{}];

    //調(diào)用 drawAtPoint: 方法,確定屬性化字符串的位置
    [text drawAtPoint:(CGPoint)point];

    //獲取文本所占空間的大小
    CGSize textSize = [text size];

 //5.繪制圖片是用到 UIImage 中的繪制方法

UIViewContentMode(view的一個屬性,它代表 bounds 變化時會發(fā)生什么)

文檔說明:當(dāng) view 大小改變時, 通過選項來校準(zhǔn)它的內(nèi)容

typedef enum {
    UIViewContentModeScaleToFill,(默認,當(dāng) view.bounds 時通過拉伸像素來改變內(nèi)容)
    UIViewContentModeScaleAspectFit,
    UIViewContentModeScaleAspectFill,
    UIViewContentModeRedraw,
    UIViewContentModeCenter,
    UIViewContentModeTop,
    UIViewContentModeBottom,
    UIViewContentModeLeft,
    UIViewContentModeRight,
    UIViewContentModeTopLeft,
    UIViewContentModeTopRight,
    UIViewContentModeBottomLeft,
    UIViewContentModeBottomRight,
} UIViewContentMode;

UIGestureRecognizer(手勢)

 //UIGestureRecognizer 是一個抽象類, 不能對它進行實例化
 //手勢識別器的使用步驟 \
    1.創(chuàng)建手勢識別器,并添加到視圖中 \
    2.提供一個處理器,當(dāng)手勢發(fā)生時要調(diào)用的方法

 //在輸出口添加手勢識別
 - (void)setPannableView:(UIView *)pannableView{

    _pannableView = pannableView;

    //1創(chuàng)建拖動手勢
    UIPanGestureRecognizer *pangr = 
        [[UIPanGestureRecognizer alloc] initWithTarget:pannableView action:@selector(pan:)];

    //把手勢加入到目標(biāo)視圖中
    [pannableView addGestureRecognizer:pangr];

 }

 - (void)pan:(UIPanGestureRecognizer *)recognizer{

    if((recognizer.state == UIPanGestureRecognizerStateChanged) || (recognizer.state == UIPanGestureRecognizerStateEnded)){

        //獲得拖動后的位置
        CGPoint translation = [recognizer translationInView:self];
        self.origin = CGPointMake(self.origin.x + translation.x, self.origin.y + translation.y);
    
        //重置
        [recognizer setTranslation:CGPointZero inView:self];
    }
 }

手勢動作

 UIPanGestureRecognizer      拖動手勢
 UIPinchGestureRecognizer    捏合手勢
 UIRotationGestureRecognizer 旋轉(zhuǎn)手勢
 UILongPressGestureRecognizer  長按手勢
 UISwipeGestureRecognizer    滑動手勢(不連續(xù)手勢)
 UITapGestureRecognizer    點擊手勢(不連續(xù)手勢)
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末昭雌,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子诵姜,更是在濱河造成了極大的恐慌,老刑警劉巖赶盔,帶你破解...
    沈念sama閱讀 218,451評論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件霎终,死亡現(xiàn)場離奇詭異软棺,居然都是意外死亡,警方通過查閱死者的電腦和手機潦刃,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,172評論 3 394
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來懈叹,“玉大人乖杠,你說我怎么就攤上這事〕纬桑” “怎么了胧洒?”我有些...
    開封第一講書人閱讀 164,782評論 0 354
  • 文/不壞的土叔 我叫張陵笆包,是天一觀的道長。 經(jīng)常有香客問我略荡,道長庵佣,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,709評論 1 294
  • 正文 為了忘掉前任汛兜,我火速辦了婚禮巴粪,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘粥谬。我一直安慰自己肛根,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,733評論 6 392
  • 文/花漫 我一把揭開白布漏策。 她就那樣靜靜地躺著派哲,像睡著了一般。 火紅的嫁衣襯著肌膚如雪掺喻。 梳的紋絲不亂的頭發(fā)上芭届,一...
    開封第一講書人閱讀 51,578評論 1 305
  • 那天,我揣著相機與錄音感耙,去河邊找鬼褂乍。 笑死,一個胖子當(dāng)著我的面吹牛即硼,可吹牛的內(nèi)容都是我干的逃片。 我是一名探鬼主播,決...
    沈念sama閱讀 40,320評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼只酥,長吁一口氣:“原來是場噩夢啊……” “哼褥实!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起裂允,我...
    開封第一講書人閱讀 39,241評論 0 276
  • 序言:老撾萬榮一對情侶失蹤损离,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后叫胖,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體草冈,經(jīng)...
    沈念sama閱讀 45,686評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,878評論 3 336
  • 正文 我和宋清朗相戀三年瓮增,在試婚紗的時候發(fā)現(xiàn)自己被綠了怎棱。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,992評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡绷跑,死狀恐怖拳恋,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情砸捏,我是刑警寧澤谬运,帶...
    沈念sama閱讀 35,715評論 5 346
  • 正文 年R本政府宣布隙赁,位于F島的核電站,受9級特大地震影響梆暖,放射性物質(zhì)發(fā)生泄漏伞访。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,336評論 3 330
  • 文/蒙蒙 一轰驳、第九天 我趴在偏房一處隱蔽的房頂上張望厚掷。 院中可真熱鬧,春花似錦级解、人聲如沸冒黑。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,912評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽抡爹。三九已至,卻和暖如春芒划,著一層夾襖步出監(jiān)牢的瞬間冬竟,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,040評論 1 270
  • 我被黑心中介騙來泰國打工腊状, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留诱咏,地道東北人。 一個月前我還...
    沈念sama閱讀 48,173評論 3 370
  • 正文 我出身青樓缴挖,卻偏偏與公主長得像,于是被迫代替她去往敵國和親焚辅。 傳聞我的和親對象是個殘疾皇子映屋,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,947評論 2 355

推薦閱讀更多精彩內(nèi)容