iOS 14:Quartz2D 的深入應(yīng)用:圖片操作、畫板

項目:圖片水印

  • 獲取上下文,之前的上下文都是在view的drawRect 方法中獲?。ǜ鷙iew的layer相關(guān)聯(lián)的上下文)
  • 怎么獲取位圖上下文,注意位圖上下文的獲取方式跟layer上下文不一樣,需要我們手動創(chuàng)建。
  • 步驟:
    • 1.開啟一個位圖上下文
    • 2.繪制原生的圖片
    • 3.給原生的圖片添加文字
    • 4.生成一張圖片給我們,從上下文中獲取圖片
    • 5.關(guān)閉上下文
    // 開啟一個位圖上下文,注意位圖上下文跟view無關(guān)聯(lián),所以不需要在drawRect.
    // size:位圖上下文的尺寸(新圖片的尺寸)
    // opaque: 不透明度 YES:不透明 NO:透明,通常我們一般都弄透明的上下文
    // scale:通常不需要縮放上下文,取值為0,表示不縮放
    UIGraphicsBeginImageContextWithOptions(image.size, NO, 0);

圖片裁剪

把正方性圖片重新生產(chǎn)一張圓形的圖片
  • 初始的畫板上面沒有任何東西,是創(chuàng)建一個又一個路徑并往上面添加
  • 步驟:
    • 1.加載圖片
    • 2.開啟位圖上下文,跟圖片尺寸一樣大
    • 3.設(shè)置原型裁剪區(qū)域,正切于圖片。創(chuàng)建原型的路徑,并把路徑設(shè)置為裁剪區(qū)域。
    • 4.繪制圖片
    • 5.從上下文中獲取圖片
    • 6.關(guān)閉上下文
  • 注意:在裁剪區(qū)域之前設(shè)置圓環(huán)。
  • 使用分類,抽取代碼方法:返回裁剪的圖片。可為UIImage 類增加額外的方法,將代碼封裝起來,復(fù)用。

屏幕截圖

用于分享圖片內(nèi)容,炫耀裝B
  • 步驟
    • 1.開啟位圖上下文
    • 2.獲取上下文
    • 3.將控件上的圖層渲染到上下文,layer只能渲染,不能繪制。但是字符串以及圖片均可以繪制。
    • 4.生成一張圖片
    • 5.關(guān)閉上下文
  • 將圖片保存到本地文件,并沒有直接的對象方法可以調(diào)用,需要將其轉(zhuǎn)化為NSData,再寫入文件,代碼如下
    // image轉(zhuǎn)data
    // compressionQuality: 圖片質(zhì)量 1:最高質(zhì)量
    // PNG的圖片質(zhì)量較為清晰,JPEG次之。
    NSData *data = UIImageJPEGRepresentation(image,1);
    [data writeToFile:@"/Users/xiaomage/Desktop/view.png" atomically:YES];
  • 抽取代碼:返回屏幕截圖后的圖片,為UIImage 類增加額外的功能。

圖片截取、圖片擦除

  • 圖片截取步驟:
    • 給控制器的view 添加一個 pan 手勢
    • pan 行為發(fā)生的時候進(jìn)入處理函數(shù)
    • 一開始拖動的時候
      • 獲取一開始觸摸點
    • 一直拖動的時候
      • 獲取結(jié)束點
      • 獲取截取范圍
      • 生成截屏的view,并將其添加至view中
    • 拖動結(jié)束的時候
      • 開啟上下文
      • 設(shè)置裁剪區(qū)域
      • 獲取上下文
      • 把控件上的內(nèi)容渲染到上下文
      • 生成一張新的圖片
      • 關(guān)閉上下文
      • 移除截屏的view
  • 圖片擦除代碼如下:
- (void)pan:(UIPanGestureRecognizer *)pan
{
    // 獲取當(dāng)前點
    CGPoint curP = [pan locationInView:self.view];
    // 獲取擦除的矩形范圍
    CGFloat wh = 100;
    CGFloat x = curP.x - wh * 0.5;
    CGFloat y = curP.y - wh * 0.5;
    CGRect rect = CGRectMake(x, y, wh, wh);
   // 開啟上下文
    UIGraphicsBeginImageContextWithOptions(self.view.bounds.size, NO, 0);
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    // 控件的layer渲染上去
    [_imageView.layer renderInContext:ctx];
    // 擦除圖片
    CGContextClearRect(ctx, rect);
    // 生成一張圖片
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    _imageView.image = image;
    
    // 關(guān)閉上下文
    UIGraphicsEndImageContext(); 
}

手勢解鎖

  • 按鈕的選中狀態(tài)與高亮狀態(tài)是不一樣的。分別為:UIControlStateSelected\UIControlStateHighlighted。高亮狀態(tài)是按鈕點擊時候發(fā)生的,選擇狀態(tài)可以代碼設(shè)置。
  • 為什么要在- (void)layoutSubviews布局子控件,因為只要一調(diào)用這個方法,就表示父控件的尺寸確定。
  • 從storyboard上也可以創(chuàng)建手勢,總共有7個。

項目:畫板

  • 搭建界面
    • 使用toolBar 控件,添加UIBarButtonItem 模型。可以方便的對其內(nèi)容進(jìn)行布局管理。
    • 使用Flexible Bar Button Item 放在 UIBarButtonItem 之前,在toolBar控件frame改變的時候,起到一個彈簧的作用。
  • 在 awakeFromNib:以及initWithFrame:都要進(jìn)行初始化設(shè)置,具有更好的擴(kuò)展性。
  • 在使用drawRect:方法重新繪制屏幕時,可以將貝瑟爾路徑定義在外面,然后在drawRect:中執(zhí)行:[path stroke]方法也可。
  • 只要調(diào)用drawRect:方法,就會把之前的內(nèi)容全部清空
  • UIImagePickerController 系統(tǒng)相冊控制器
    • 通過設(shè)置控制器的來源:可以有相冊集\照片庫\相機(jī)
    • 監(jiān)聽用戶在系統(tǒng)相冊控制器的行為,需要設(shè)置delegate
  • 使用位圖上下文來進(jìn)行畫圖截屏
  • UIImageWriteToSavedPhotosAlbum:方法,可以將圖片寫入至相冊,并可以監(jiān)聽到是否保存完成,保存完成的方法不能夠隨便亂寫,具體見官方說明。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Quartz2D 簡介 Quartz2D是二維(平面)的繪圖引擎(經(jīng)包裝的函數(shù)庫,方便開發(fā)者使用。也就是說蘋果幫我...
    iOS_Cqlee閱讀 671評論 0 2
  • Quartz2D以及drawRect的重繪機(jī)制字?jǐn)?shù)1487 閱讀21 評論1 喜歡1一、什么是Quartz2D Q...
    PurpleWind閱讀 906評論 0 3
  • --繪圖與濾鏡全面解析 概述 在iOS中可以很容易的開發(fā)出絢麗的界面效果,一方面得益于成功系統(tǒng)的設(shè)計,另一方面得益...
    韓七夏閱讀 2,969評論 2 10
  • 假若人生注定要定于蒼白, 那么愛我所愛, 便好。 假若宿命中的斷翼 再也不能飛翔, 那么掙扎著愛我所愛, 便好。 ...
    冰依潔穎閱讀 269評論 0 0
  • 【導(dǎo)讀】我們做一件事時,比如每天見客戶,每天寫文案等。每天做這件事時,都追求一個很棒的結(jié)果,每天都有單出,每個文案...
    君子小石閱讀 655評論 0 0

友情鏈接更多精彩內(nèi)容