位圖上下文

位圖上下文

  • 怎么讓方形圖片變成圓形圖片？
  • 位圖上下文
    • 生成了一張新的圖片
    • 應(yīng)用：水印、圓形圖片裁剪
    • 手動(dòng)開(kāi)啟上下文，指定上下文的大小
    • 創(chuàng)建時(shí)上下文的大小，決定著生成圖片的大小

水印

  • 位圖上下文的大小 = 圖片的大小

  • 加水?。荷梢粡埿碌膱D片

  • 注意：生成圖片不是在view上畫(huà)東西了，不用自定義view,不用寫drawRect方法；生成圖片可以在任何地方生成。

  • 生成一張新的圖片

  • 加載圖片

  • 要繪制的文字

  • 開(kāi)啟位圖上下文

    • 開(kāi)啟上下文UIGraphicsBeginImageContext
    • 創(chuàng)建時(shí)上下文的大小決定著生成圖片的大小

  • 把圖片會(huì)知道上下文當(dāng)中

    • drawAtPoint/drawInRect

  • 畫(huà)文字

    • drawAtPoint:withAttribute:

  • 從上下文當(dāng)中生成一張新的圖片

    • UIGraphicsGetImageFromCurrentImageContext()
    • 把上下文當(dāng)中所有繪制的內(nèi)容合成到一起，生成一張新的圖片

  • 手動(dòng)關(guān)閉上下文

    • UIGraphicsEndImageContext()

  • 拖線，賦值

    • self.imageV.image = newImage;

頭像(生成圓形圖片)

  • 加載圖片
  • 開(kāi)啟位圖上下文
    • UIGraphicsBeginImageContext
    • 位圖上下文大小 = 圖片大小
  • 裁剪(繪制之前做裁剪)
    • UIBezierPath OvalInRect
    • UIRectClip
  • 把路徑設(shè)置為裁剪區(qū)域(超出裁剪區(qū)域以外的內(nèi)容會(huì)自動(dòng)裁剪掉)
    • [path addClip]
    • 對(duì)之前已經(jīng)畫(huà)上去的東西，沒(méi)有作用
  • 把圖片繪制到上下文當(dāng)中
    • drawAtPoint
  • 從位圖上下文當(dāng)中生成一張圖片
    • UIGraphicsGetImageFromCurrentImageContext()
  • 關(guān)閉位圖上下文
    • UIGraphicsEndImageContext()
  • 拖線，展示
    • self.imageV.image = newImage;

帶有邊框的圓形圖片裁剪(抽一個(gè)分類方便復(fù)用)

  • 加載圖片

  • 設(shè)置邊框?qū)挾?/p>

  • 開(kāi)啟位圖上下文

    • 大小 = 圖片的寬高 + 2倍圖片邊框的寬高
    • UIGraphicsBeginImageContext()

  • 繪制一個(gè)大圓

    • UIBezierPath OvalInRect

  • 把大圓畫(huà)上去 path fill

  • 設(shè)置裁剪區(qū)域

    • UIBezierPath
      • x,y:邊框?qū)挾?/li>
      • 寬度高度 = 圖片的寬高

  • 把路徑設(shè)置為裁剪區(qū)域

    • addClip

  • 把圖片繪制到上下文

  • 從位圖上下文當(dāng)中生成一張圖片

    • UIGraphicsGetImageFromCurrentImageContext()

  • 關(guān)閉上下文

    • UIGraphicsEndImageContext()

  • 拖線，展示

    • self.imageV.image = newImage;

  • 抽一個(gè)分類，方便復(fù)用

    • 圖片，邊框大小，大圓的顏色是變化的
    • ObjectC-file
    • UIImage()
    • 把出現(xiàn)中文的，放到后面

截屏(新的知識(shí)點(diǎn)：二進(jìn)制流)

  • 生成一張新的圖片
  • 創(chuàng)建一個(gè)位圖上下文
    • 大小等于屏幕大小
  • 獲取當(dāng)前上下文
    • CGContextRef UIGraphicsGetCurrentContext
  • 把控制器的view內(nèi)容畫(huà)到上下文當(dāng)中
    • view之所以能顯示是因?yàn)閮?nèi)部有l(wèi)ayer
    • self.view.layer renderInContext:
  • 從上下文當(dāng)中生成一張新的圖片
    • Get
  • 關(guān)閉上下文
    • End
  • 把手機(jī)生成的圖片，生成到電腦的桌面上
    • 怎么把圖片上傳到服務(wù)器的？
    • 把圖片轉(zhuǎn)成二進(jìn)制流
    • 如何把圖片轉(zhuǎn)成二進(jìn)制流?
      • UIImage
      • 轉(zhuǎn)成jpe還是png
      • UIImageJPERepresentation(newImage,壓縮質(zhì)量:范圍0~1)
      • 返回值NSData
      • data writeToFile:atomically:
      • UIImagePNGRepresentation(本身就是最高質(zhì)量的圖片)

截屏擴(kuò)展

  • [UIScreen mainScreen].scale 不是固定的值，根據(jù)手機(jī)型號(hào)的不同值不同
    • 點(diǎn)坐標(biāo)*比例 ——> 轉(zhuǎn)成像素坐標(biāo)
    • 在OC當(dāng)中會(huì)自動(dòng)把點(diǎn)坐標(biāo)轉(zhuǎn)成像素
    • 在C語(yǔ)言當(dāng)中，它不會(huì)自動(dòng)轉(zhuǎn)成像素
  • 開(kāi)啟上下文
    • UIGraphicsBeginImageContextWithOptions(上下文大小,是否為不透明度opaque NO,scale縮放比例點(diǎn)坐標(biāo)與像素的比例)
    • scale 1.0
    • scale 2.0 打印的size 和生成圖片的size尺寸不一樣
    • scale 0.0 設(shè)備的[UIScreen mainScreen].scale
    • scale 縮放因子 bitmap

截圖

  • 遮蓋
  • 截圖
  • 蒙版遮蓋
    • 開(kāi)始拖動(dòng)的點(diǎn)
    • 當(dāng)前手指的點(diǎn)
    • 寬高--x,y的偏移量
  • 添加手勢(shì)Pan Gesture Recognizer
  • 監(jiān)聽(tīng)拖動(dòng)時(shí)會(huì)調(diào)用哪個(gè)方法，拖線，判斷手勢(shì)狀態(tài)
    • state:Begin
      • 獲取手指當(dāng)前點(diǎn)：locationInView
      • 定義一個(gè)成員屬性，方便下面拿到當(dāng)前點(diǎn)
    • state:Change
      • locationInView
      • 寬度：x方向偏移量
      • 高度：y方向的偏移量
      • frame
        • startP.X
        • startP.y
        • w
        • h
    • 創(chuàng)建遮蓋的view
      • 懶加載
      • 懶加載的好處：
        • 1.什么時(shí)候使用什么時(shí)候才去創(chuàng)建，節(jié)省內(nèi)存
        • 2.保證對(duì)象只有一個(gè)
        • 3.保證該對(duì)象在使用時(shí)一直存在
    • state:End手指松開(kāi)
      • 移除遮蓋
  • 把超過(guò)遮蓋以外的內(nèi)容裁減掉
    • 生成一張和imageView一樣大的圖片
    • 開(kāi)啟上下文UIGraphicsBeginImageContext:默認(rèn)是透明的
    • 裁剪：UIRectClip(遮蓋的frame)
    • CGContextRef
    • renderInContext
    • 生成圖片
    • 關(guān)閉上下文
    • self.imageV.image = newImage

擴(kuò)展

  • 手指松開(kāi)，生成圖片不是imageView大小
  • 把生成遮蓋大小的圖片，顯示到桌面上面
  • 畫(huà)圖片，開(kāi)啟上下文，遮蓋大小
  • 拿到圖片，往上面畫(huà)

圖片擦除(橡皮擦功能)

  • uerInteraction
  • 添加手勢(shì)
    • Pan
  • 擦除區(qū)域
    • 獲取當(dāng)前手指的點(diǎn)locationInView
    • rectWH = 30
    • X:當(dāng)前點(diǎn)x- 寬度的一半
    • Y：當(dāng)前點(diǎn)y- 高度一半
  • 開(kāi)啟上下文Begin
  • 把圖片內(nèi)容畫(huà)到畫(huà)板上renderInContext
  • 擦除
    • CGContextClearRect(context,rect)
  • 生成一張圖片Get
  • 關(guān)閉上下文End
  • 替換imageView
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

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

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