位图上下文

位图上下文

  • 怎么让方形图片变成圆形图片?
  • 位图上下文
    • 生成了一张新的图片
    • 应用:水印、圆形图片裁剪
    • 手动开启上下文,指定上下文的大小
    • 创建时上下文的大小,决定着生成图片的大小

水印

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

  • 加水印:生成一张新的图片

  • 注意:生成图片不是在view上画东西了,不用自定义view,不用写drawRect方法;生成图片可以在任何地方生成。

  • 生成一张新的图片

  • 加载图片

  • 要绘制的文字

  • 开启位图上下文

    • 开启上下文UIGraphicsBeginImageContext
    • 创建时上下文的大小决定着生成图片的大小
  • 把图片会知道上下文当中

    • drawAtPoint/drawInRect
  • 画文字

    • drawAtPoint:withAttribute:
  • 从上下文当中生成一张新的图片

    • UIGraphicsGetImageFromCurrentImageContext()
    • 把上下文当中所有绘制的内容合成到一起,生成一张新的图片
  • 手动关闭上下文

    • UIGraphicsEndImageContext()
  • 拖线,赋值

    • self.imageV.image = newImage;

头像(生成圆形图片)

  • 加载图片
  • 开启位图上下文
    • UIGraphicsBeginImageContext
    • 位图上下文大小 = 图片大小
  • 裁剪(绘制之前做裁剪)
    • UIBezierPath OvalInRect
    • UIRectClip
  • 把路径设置为裁剪区域(超出裁剪区域以外的内容会自动裁剪掉)
    • [path addClip]
    • 对之前已经画上去的东西,没有作用
  • 把图片绘制到上下文当中
    • drawAtPoint
  • 从位图上下文当中生成一张图片
    • UIGraphicsGetImageFromCurrentImageContext()
  • 关闭位图上下文
    • UIGraphicsEndImageContext()
  • 拖线,展示
    • self.imageV.image = newImage;

带有边框的圆形图片裁剪(抽一个分类方便复用)

  • 加载图片

  • 设置边框宽度

  • 开启位图上下文

    • 大小 = 图片的宽高 + 2倍图片边框的宽高
    • UIGraphicsBeginImageContext()
  • 绘制一个大圆

    • UIBezierPath OvalInRect
  • 把大圆画上去 path fill

  • 设置裁剪区域

    • UIBezierPath
      • x,y:边框宽度
      • 宽度高度 = 图片的宽高
  • 把路径设置为裁剪区域

    • addClip
  • 把图片绘制到上下文

  • 从位图上下文当中生成一张图片

    • UIGraphicsGetImageFromCurrentImageContext()
  • 关闭上下文

    • UIGraphicsEndImageContext()
  • 拖线,展示

    • self.imageV.image = newImage;
  • 抽一个分类,方便复用

    • 图片,边框大小,大圆的颜色是变化的
    • ObjectC-file
    • UIImage()
    • 把出现中文的,放到后面

截屏(新的知识点:二进制流)

  • 生成一张新的图片
  • 创建一个位图上下文
    • 大小等于屏幕大小
  • 获取当前上下文
    • CGContextRef UIGraphicsGetCurrentContext
  • 把控制器的view内容画到上下文当中
    • view之所以能显示是因为内部有layer
    • self.view.layer renderInContext:
  • 从上下文当中生成一张新的图片
    • Get
  • 关闭上下文
    • End
  • 把手机生成的图片,生成到电脑的桌面上
    • 怎么把图片上传到服务器的?
    • 把图片转成二进制流
    • 如何把图片转成二进制流?
      • UIImage
      • 转成jpe还是png
      • UIImageJPERepresentation(newImage,压缩质量:范围0~1)
      • 返回值NSData
      • data writeToFile:atomically:
      • UIImagePNGRepresentation(本身就是最高质量的图片)

截屏扩展

  • [UIScreen mainScreen].scale 不是固定的值,根据手机型号的不同值不同
    • 点坐标*比例 ——> 转成像素坐标
    • 在OC当中会自动把点坐标转成像素
    • 在C语言当中,它不会自动转成像素
  • 开启上下文
    • UIGraphicsBeginImageContextWithOptions(上下文大小,是否为不透明度opaque NO,scale缩放比例点坐标与像素的比例)
    • scale 1.0
    • scale 2.0 打印的size 和生成图片的size尺寸不一样
    • scale 0.0 设备的[UIScreen mainScreen].scale
    • scale 缩放因子 bitmap

截图

  • 遮盖
  • 截图
  • 蒙版遮盖
    • 开始拖动的点
    • 当前手指的点
    • 宽高--x,y的偏移量
  • 添加手势Pan Gesture Recognizer
  • 监听拖动时会调用哪个方法,拖线,判断手势状态
    • state:Begin
      • 获取手指当前点:locationInView
      • 定义一个成员属性,方便下面拿到当前点
    • state:Change
      • locationInView
      • 宽度:x方向偏移量
      • 高度:y方向的偏移量
      • frame
        • startP.X
        • startP.y
        • w
        • h
    • 创建遮盖的view
      • 懒加载
      • 懒加载的好处:
        • 1.什么时候使用什么时候才去创建,节省内存
        • 2.保证对象只有一个
        • 3.保证该对象在使用时一直存在
    • state:End手指松开
      • 移除遮盖
  • 把超过遮盖以外的内容裁减掉
    • 生成一张和imageView一样大的图片
    • 开启上下文UIGraphicsBeginImageContext:默认是透明的
    • 裁剪:UIRectClip(遮盖的frame)
    • CGContextRef
    • renderInContext
    • 生成图片
    • 关闭上下文
    • self.imageV.image = newImage

扩展

  • 手指松开,生成图片不是imageView大小
  • 把生成遮盖大小的图片,显示到桌面上面
  • 画图片,开启上下文,遮盖大小
  • 拿到图片,往上面画

图片擦除(橡皮擦功能)

  • uerInteraction
  • 添加手势
    • Pan
  • 擦除区域
    • 获取当前手指的点locationInView
    • rectWH = 30
    • X:当前点x- 宽度的一半
    • Y:当前点y- 高度一半
  • 开启上下文Begin
  • 把图片内容画到画板上renderInContext
  • 擦除
    • CGContextClearRect(context,rect)
  • 生成一张图片Get
  • 关闭上下文End
  • 替换imageView
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 151,511评论 1 330
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 64,495评论 1 273
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 101,595评论 0 225
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 42,558评论 0 190
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 50,715评论 3 270
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 39,672评论 1 192
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,112评论 2 291
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 29,837评论 0 181
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 33,417评论 0 228
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 29,928评论 2 232
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,316评论 1 242
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 27,773评论 2 234
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,253评论 3 220
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 25,827评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,440评论 0 180
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 34,523评论 2 249
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 34,583评论 2 249

推荐阅读更多精彩内容