OC - 8.Quartz2D核心要点

简介


  • 作用
    • 绘制
    • 绘制图形 : 线条\三角形\矩形\圆\弧等
    • 绘制文字
    • 绘制\生成图片(图像)
    • 读取\生成PDF
    • 截图\裁剪图片
    • 自定义UI控件(通常为内部结构较复杂的控件)
    • UIKit中的绝大部分控件都是由系统绘制的
    • 矩阵操作(使绘制到图形啥下文中的所有路径都发生变化)
    • 缩放
    • 旋转
    • 平移
  • 简介
    • Quartz2D隶属于Core Graphic框架,是一个二维的绘图引擎,直接操于Layer(图层),通常在-drawRect:方法中获取上下文,将需要绘制的内容绘制到图形上下文中,然后将图层渲染到控件,最后关闭图形上下文。
    • - (void)drawRect:(CGRect)rect,该方法只会界面即将显示的时候调用一次,若要在此调用需要调用重绘方法- (void)setNeedsDisplay

常用的绘制操作


  • 绘制直线(三种方法)

    • 通过添加路径的方式绘制直线,最后把路径渲染的上下文
    • 开启上下文
      • CGContextRef context = UIGraphicsGetCurrentContext()
    • 描述所要绘制的路径
      • 创建路径
        CGMutablePathRef CGPathCreateMutable(void)
      • 设置起点
        void CGPathMoveToPoint(CGMutablePathRef path, const CGAffineTransform *m, CGFloat x, CGFloat y)
      • 连线
        void CGPathAddLineToPoint(CGMutablePathRef path, const CGAffineTransform *m, CGFloat x, CGFloat y)
    • 将路径添加到上下文
      • void CGContextAddPath(CGContextRef context, CGPathRef path)
    • 渲染上下文
      • void CGContextStrokePath(CGContextRef c)
    • 直接在上下文中绘制直线
    • 开启上下文
      • CGContextRef context = UIGraphicsGetCurrentContext()
    • 描述所要绘制的路径
      • 设置起点
        void CGContextMoveToPoint(CGContextRef c, CGFloat x, CGFloat y)
      • 连线
        void CGContextAddLineToPoint(CGContextRef c, CGFloat x, CGFloat y)
    • 渲染上下文
      • void CGContextStrokePath(CGContextRef c)
    • 通过贝瑟尔绘制直线
    • 常见贝瑟尔路径(最普通的路径)
      • (UIBezierPath *)bezierPath
    • 设置起点
      • (void)moveToPoint:(CGPoint)point
    • 连线
      • (void)addLineToPoint:(CGPoint)point
    • 渲染
      • (void)stroke
  • 绘制曲线
    • 获取上下文
    • CGContextRef UIGraphicsGetCurrentContext(void)
    • 绘制路径
    • 设置起点
      void CGContextMoveToPoint(CGContextRef c, CGFloat x, CGFloat y)
    • 连线
      void CGContextAddQuadCurveToPoint(CGContextRef c, CGFloat cpx, CGFloat cpy, CGFloat x, CGFloat y)
    • 渲染上下文
      void CGContextStrokePath(CGContextRef c)
  • 绘制圆弧(通过贝瑟尔路径)
    • 创建贝瑟尔路径
    • + (UIBezierPath *)bezierPathWithArcCenter:(CGPoint)center radius:(CGFloat)radius startAngle:(CGFloat)startAngle endAngle:(CGFloat)endAngle clockwise:(BOOL)clockwise
    • - (void)stroke
  • 绘制饼状图
    • 思路:
      1) 饼状图其实是在圆弧的基础上增加了两条线而完成
    • 实现步骤
    • 通过贝瑟尔路径绘制圆弧
      • + (UIBezierPath *)bezierPathWithArcCenter:(CGPoint)center radius:(CGFloat)radius startAngle:(CGFloat)startAngle endAngle:(CGFloat)endAngle clockwise:(BOOL)clockwise
    • 添加直线使路径封闭
      • 从路径终点到圆弧圆心添加直线
      • - (void)addLineToPoint:(CGPoint)point
      • 路径起点到圆弧圆心的直线会被自动添加
        调用- (void)fill方法是自动添加
    • 设置填充颜色
      • - (void)set,此方法是UIColor对象的方法,用于设置上下文填充或渲染的颜色
    • 填充并封闭路径并渲染
      • - (void)fill,通过贝瑟尔路径调用该方法
  • 绘制柱状图
    • 思路
      1) 通过贝瑟尔路径可以直接绘制柱状图
    • 实现步骤
    • 创建贝瑟尔路径
      • + (UIBezierPath *)bezierPathWithRect:(CGRect)rect
    • 设置填充颜色
      • - (void)set,此方法是UIColor对象的方法,用于设置上下文中填充或渲染的颜色
    • 填充并封闭路径并渲染
      • - (void)fill
  • 绘制文字
    • 思路
    • NSString的分类NSStringDrawing实现了将NSString对象的绘制方法
      • - (void)drawAtPoint:(CGPoint)point withAttributes:(NSDictionary *)attrs,从某个点开始绘制文字
      • - (void)drawInRect:(CGRect)rect withAttributes:(NSDictionary *)attrs,在rect区域内绘制文字
    • 在绘制文字是,还可以通过attrs参数设置其属性
    • 实现步骤
    • 创建NSString对象
    • 设置文本属性(其属性不存在一个字典中,通过指定的key去设置相应的属性)
      • 设置文本颜色
        NSForegroundColorAttributeName
      • 设置字体
        NSFontAttributeName
      • 设置渲染时的宽度
        NSStrokeWidthAttributeName
      • 设置渲染时的颜色
        NSStrokeColorAttributeName
      • 设置背景属性
        NSShadowAttributeName
        设置背景颜色:shadowColor(UIColor)
        模糊属性:shadowBlurRadius(CGFloat)
        偏移量:shadowOffset
    • 绘制文字
      • - (void)drawInRect:(CGRect)rect withAttributes:(NSDictionary *)attrs
      • - (void)drawAtPoint:(CGPoint)point withAttributes:(NSDictionary *)attrs,若使用该方法,则文字会单行显示
  • 绘制图片
    • 思路
      直接调用UIImage的用于绘制的对象方法即可绘制
    • 实现步骤
    • 创建UIImage对象
    • 创建绘制区域
    • 设置超出绘制区域的内容被剪掉
      UIRectClip(CGRect rect)
    • 绘制图片
      • - (void)drawAsPatternInRect:(CGRect)rect,平铺的方式显示图片,铺满整个绘制区域(rect)
      • - (void)drawAtPoint:(CGPoint)point,显示一张与原来图片大小一样的图片
      • - (void)drawInRect:(CGRect)rect,图片被拉伸,大小等于rect
      • - (void)drawAtPoint:(CGPoint)point blendMode:(CGBlendMode)blendMode alpha:(CGFloat)alpha

---恢复内容结束---

简介


  • 作用

    • 绘制
    • 绘制图形 : 线条\三角形\矩形\圆\弧等
    • 绘制文字
    • 绘制\生成图片(图像)
    • 读取\生成PDF
    • 截图\裁剪图片
    • 自定义UI控件(通常为内部结构较复杂的控件)
    • UIKit中的绝大部分控件都是由系统绘制的
    • 矩阵操作(使绘制到图形啥下文中的所有路径都发生变化)
    • 缩放
    • 旋转
    • 平移
  • 简介
    • Quartz2D隶属于Core Graphic框架,是一个二维的绘图引擎,直接操于Layer(图层),通常在-drawRect:方法中获取上下文,将需要绘制的内容绘制到图形上下文中,然后将图层渲染到控件,最后关闭图形上下文。
    • - (void)drawRect:(CGRect)rect,该方法只会界面即将显示的时候调用一次,若要在此调用需要调用重绘方法- (void)setNeedsDisplay

常用的绘制操作


  • 绘制直线(三种方法)

    • 通过添加路径的方式绘制直线,最后把路径渲染的上下文
    • 开启上下文
      • CGContextRef context = UIGraphicsGetCurrentContext()
    • 描述所要绘制的路径
      • 创建路径
        CGMutablePathRef CGPathCreateMutable(void)
      • 设置起点
        void CGPathMoveToPoint(CGMutablePathRef path, const CGAffineTransform *m, CGFloat x, CGFloat y)
      • 连线
        void CGPathAddLineToPoint(CGMutablePathRef path, const CGAffineTransform *m, CGFloat x, CGFloat y)
    • 将路径添加到上下文
      • void CGContextAddPath(CGContextRef context, CGPathRef path)
    • 渲染上下文
      • void CGContextStrokePath(CGContextRef c)
    • 直接在上下文中绘制直线
    • 开启上下文
      • CGContextRef context = UIGraphicsGetCurrentContext()
    • 描述所要绘制的路径
      • 设置起点
        void CGContextMoveToPoint(CGContextRef c, CGFloat x, CGFloat y)
      • 连线
        void CGContextAddLineToPoint(CGContextRef c, CGFloat x, CGFloat y)
    • 渲染上下文
      • void CGContextStrokePath(CGContextRef c)
    • 通过贝瑟尔绘制直线
    • 常见贝瑟尔路径(最普通的路径)
      • (UIBezierPath *)bezierPath
    • 设置起点
      • (void)moveToPoint:(CGPoint)point
    • 连线
      • (void)addLineToPoint:(CGPoint)point
    • 渲染
      • (void)stroke
  • 绘制曲线
    • 获取上下文
    • CGContextRef UIGraphicsGetCurrentContext(void)
    • 绘制路径
    • 设置起点
      void CGContextMoveToPoint(CGContextRef c, CGFloat x, CGFloat y)
    • 连线
      void CGContextAddQuadCurveToPoint(CGContextRef c, CGFloat cpx, CGFloat cpy, CGFloat x, CGFloat y)
    • 渲染上下文
      void CGContextStrokePath(CGContextRef c)
  • 绘制圆弧(通过贝瑟尔路径)
    • 创建贝瑟尔路径
    • + (UIBezierPath *)bezierPathWithArcCenter:(CGPoint)center radius:(CGFloat)radius startAngle:(CGFloat)startAngle endAngle:(CGFloat)endAngle clockwise:(BOOL)clockwise
    • - (void)stroke
  • 绘制饼状图
    • 思路:
      1) 饼状图其实是在圆弧的基础上增加了两条线而完成
    • 实现步骤
    • 通过贝瑟尔路径绘制圆弧
      • + (UIBezierPath *)bezierPathWithArcCenter:(CGPoint)center radius:(CGFloat)radius startAngle:(CGFloat)startAngle endAngle:(CGFloat)endAngle clockwise:(BOOL)clockwise
    • 添加直线使路径封闭
      • 从路径终点到圆弧圆心添加直线
      • - (void)addLineToPoint:(CGPoint)point
      • 路径起点到圆弧圆心的直线会被自动添加
        调用- (void)fill方法是自动添加
    • 设置填充颜色
      • - (void)set,此方法是UIColor对象的方法,用于设置上下文填充或渲染的颜色
    • 填充并封闭路径并渲染
      • - (void)fill,通过贝瑟尔路径调用该方法
  • 绘制柱状图
    • 思路
      1) 通过贝瑟尔路径可以直接绘制柱状图
    • 实现步骤
    • 创建贝瑟尔路径
      • + (UIBezierPath *)bezierPathWithRect:(CGRect)rect
    • 设置填充颜色
      • - (void)set,此方法是UIColor对象的方法,用于设置上下文中填充或渲染的颜色
    • 填充并封闭路径并渲染
      • - (void)fill
  • 绘制文字
    • 思路
    • NSString的分类NSStringDrawing实现了将NSString对象的绘制方法
      • - (void)drawAtPoint:(CGPoint)point withAttributes:(NSDictionary *)attrs,从某个点开始绘制文字
      • - (void)drawInRect:(CGRect)rect withAttributes:(NSDictionary *)attrs,在rect区域内绘制文字
    • 在绘制文字是,还可以通过attrs参数设置其属性
    • 实现步骤
    • 创建NSString对象
    • 设置文本属性(其属性不存在一个字典中,通过指定的key去设置相应的属性)
      • 设置文本颜色
        NSForegroundColorAttributeName
      • 设置字体
        NSFontAttributeName
      • 设置渲染时的宽度
        NSStrokeWidthAttributeName
      • 设置渲染时的颜色
        NSStrokeColorAttributeName
      • 设置背景属性
        NSShadowAttributeName
        设置背景颜色:shadowColor(UIColor)
        模糊属性:shadowBlurRadius(CGFloat)
        偏移量:shadowOffset
    • 绘制文字
      • - (void)drawInRect:(CGRect)rect withAttributes:(NSDictionary *)attrs
      • - (void)drawAtPoint:(CGPoint)point withAttributes:(NSDictionary *)attrs,若使用该方法,则文字会单行显示
  • 绘制图片
    • 思路
      直接调用UIImage的用于绘制的对象方法即可绘制
    • 实现步骤
    • 创建UIImage对象
    • 创建绘制区域
    • 设置超出绘制区域的内容被剪掉
      UIRectClip(CGRect rect)
    • 绘制图片
      • - (void)drawAsPatternInRect:(CGRect)rect,平铺的方式显示图片,铺满整个绘制区域(rect)
      • - (void)drawAtPoint:(CGPoint)point,显示一张与原来图片大小一样的图片
      • - (void)drawInRect:(CGRect)rect,图片被拉伸,大小等于rect
      • - (void)drawAtPoint:(CGPoint)point blendMode:(CGBlendMode)blendMode alpha:(CGFloat)alpha
时间: 2024-08-22 01:41:58

OC - 8.Quartz2D核心要点的相关文章

OC - 21.CALayer核心要点及实例解析

CALayer基础 CALayer是每一个UI控件的核心,一个UI控件之所以能显示可以说是CALayer的功劳 每一个UI控件默认都为自己创建一个CALayer对象,通过drawRect方法将内容绘制在图层上,然后再显示出来 CALayer可以完成很多任务 调整UI控件的外观 执行动画 CALayer与UIView 二者可以达到相同的显示效果 UIView比CALayer多了用户交互功能 CALayer更加轻量级,性能更好 CALayer在系统架构中的位置 CALayer位于QuartzCore

如何编写更棒的代码:11个核心要点

作为一个合格的程序员,有太多的理由促使你去编写干净利落且可读性强的代码.最重要的是因为你编写的代码,将来会有很多人一次次地阅读.当你有一天回过头来看自己的代码时,你就会明白编写优雅的代码是多么的重要.另外,如果别人来阅读你编写的代码,你是否想知道别人看到那些烂代码无比抓狂的感受.因此,花多一点的时间去编写优雅的代码,将来说不定会给你节省更多的时间. 那么,如何编写更棒的代码,下面是11条基本规则: 1.保持方法简短扼要 2.永远永远不要将同一个变量用于不同的目的 3.尽可能让变量和方法的名称能够

高效CSS开发核心要点摘录

做网站的,我们都知道尽量减少请求数,压缩CSS代码量,使用高效CSS选择符等方式可以来提高网站的载入速度和访问速度,也就是优化网站的性能. 下面分析了一些CSS的书写方式,很多都是我们知道并且正在使用的,这里记录一下,提醒自己以后写CSS的时候尽量从这些方面出发来使用,对于CSS的性能提升有很大的帮助,对于你自己写出来的代码也更加的靠谱了. 本文摘录之“高效CSS开发核心”,一些我认为是已经不需要用规则来约束的就不再啰嗦了,感兴趣的读者可以去看全文. 1.把CSS文件放在<head>中,避免使

dubbo核心要点及下载(dubbo二)

一.dubbo核心要点 1):服务是围绕服务提供方和服务消费方的,服务提供方实现服务,服务消费方调用服务. 2):服务注册 对于服务提供方它需要发布服务,而由于应用系统的复杂性,服务的数量.类型不断的膨胀. 对于服务消费方,它最关心如何获取它所需要的服务.而面对复杂的应用系统,需要管理大量的服务调用. 而且对于服务提供方和服务消费方来说,它们还有可能同时兼具这两种角色,即需要提供服务,又需要消费服务. 通过服务统一管理起来,可以有效的优化内部应用.对服务发布/使用的流程管理.服务注册中心可以通过

微服务架构的核心要点和实现原理

微服务架构中职能团队的划分 传统单体架构将系统分成具有不同职责的层次,对应的项目管理也倾向于将大的团队分成不同的职能团队,主要包括:用户交互UI团队.后台业务逻辑处理团队与数据存取ORM团队.DBA团队等.每个团队只对自己分层的职责负责,并对使用方提供组件服务质量保证.如果其中一个模块化组件需要升级.更新,那么这个变更会涉及不同的分层团队,即使升级和变更的改变很小,也需要进行跨团队沟通:需求阶段需要跨团队沟通产品功能,设计阶段需要跨团队沟通设计方案,开发阶段需要跨团队沟通具体的接口定义,测试阶段

一,Devops核心要点及kubernetes的架构概述

目录 1,devops的简述及要点 2,kubernetes的简单介绍与组成 1,devops的简述及要点 DevOps,分层架构 ---> 微服务 把一个程序,拆分成几个成百个微服务,使其相互独立运行 当下把微服务和容器融合起来,使其能够快速的落地. DevOps 在交互和部署环节的易购程度,在部署环节异常困难,而容器的出现,完全弥补了. CI: 持续集成 Continues Integration 作为运维的角度,得到一个应程序,需要发布到生产,蓝绿部署,金丝雀,灰度发布 CD: 持续交付

Devoos核心要点及kubernetes架构概述

Ansible就是一个编排工具.docker :我们应用程序被容器化了,面向容器化的应用程序. docker compose 是一个docker编排工具,面向单台主机编排, docker swarm 是面向集群化的编排工具, docker machine mesos,marathon(容器遍排框架) AWS的. kubernetes DevOps(应用模式的开发),MicroServices,Blockchain CI: 持续集成 CD: 持续交付 Dlivery CD: 持续部署 Deploy

Page Object页面设计模式核心要点

  Page Object,页面对象.一种设计模式,实施selenium的最佳实践,体现了web应用与页面显示之间的关系.为什么需要Page Object?测试代码维护的需要:减少代码的编码量,减少代码的维护量,清晰而明确的业务测试流程. Page Obje实现了测试代码的分层:页面元素.元素操作 和 页面业务的分离. 1.基础类 全局公共配置方法2.页面类 页面业务+元素集合3.用例层 关注数据和业务流程4.增加测试用例1(增加商品). 测试用例2(删除商品) 5.代码解耦 用例1和用例2公共

OC+RAC(六) 核心方法bind

-(void)_test6{ RACSignal *signal = [RACSignal createSignal:^RACDisposable *(id<RACSubscriber> subscriber) { [subscriber sendNext:@"first value"]; [subscriber sendNext:@"second value"]; [subscriber sendNext:@"third value"