在view上绘制一个图形的方式有很多种,表现形式可能不一样,但其实质步骤都是一样的:

1)获取上下文

2)绘制路径

3)添加路径到上下文

4)修改图形状态参数

5)渲染上下文

下面我们以画一个圆形来演示其实现步骤:

1)使用CGContextRef创建路径

1
2
3
4
5
6
7
8
9
 //获取上下文
 CGContextRef ctx = UIGraphicsGetCurrentContext();
 //绘制路径: 圆形(中心坐标200、200、半径100、起点弧度0、终点弧度2PI、画的方向0逆1正)
 CGContextAddArc(ctx, 200, 200, 100, 0, M_PI * 2, 0);
 //修改图形状态参数
 CGContextSetRGBStrokeColor(ctx, 0.5, 0.5, 0.9, 1.0);//笔颜色
 CGContextSetLineWidth(ctx, 10);//线条宽度
 //渲染上下文
 CGContextStrokePath(ctx);

2)使用CGPathRef创建路径

1
2
3
4
5
6
7
8
9
10
11
12
13
 //获取上下文
 CGContextRef ctx = UIGraphicsGetCurrentContext();
 //创建可变路径
 CGMutablePathRef path = CGPathCreateMutable();
 //添加圆形到路径中(所在路径、不进行变换操作、中心坐标200、200、起点弧度0、终点弧度2PI、画的方向0逆1正)
 CGPathAddArc(path, NULL, 200, 200, 100, 0, M_PI * 2, 1);
 //将路径添加到上下文
 CGContextAddPath(ctx, path);
 //修改图形状态参数
 CGContextSetRGBStrokeColor(ctx, 0.5, 0.5, 0.9, 1.0);//笔颜色
 CGContextSetLineWidth(ctx, 10);//线条宽度
 //渲染上下文
 CGContextStrokePath(ctx);

3)使用UIBezierPath创建路径

1
2
3
4
5
6
7
 //创建路径
 UIBezierPath * path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(100, 100, 200, 200)];
 //修改图形状态参数
 [[UIColor colorWithRed:0.5 green:0.5 blue:0.9 alpha:1.0] setStroke];//笔颜色
 [path setLineWidth:10];//线条宽度
 //渲染
 [path stroke];

以上三种方式都可以实现绘制,通过比较我们可以发现使用UIBezierPath创建路径的形式是最简洁且最直观的,推荐使用UIBezierPath,在以后的动画中我们也将更多地应用UIBezierPath到动画的实现中。

IOS绘图的核心步骤的更多相关文章

  1. iOS基础 - Quartz 2D绘图的基本步骤

    一.使用Quartz 2D绘图的基本步骤 1) 获取上下文context(绘制图形的地方) 2) 设置路径(路径是用来描述形状的) 3)  将路径添加到上下文 4)  设置上下文属性(设置颜色,线宽, ...

  2. iOS - Core Animation 核心动画

    1.UIView 动画 具体讲解见 iOS - UIView 动画 2.UIImageView 动画 具体讲解见 iOS - UIImageView 动画 3.CADisplayLink 定时器 具体 ...

  3. 论文第4章:iOS绘图平台的实现

    面向移动设备的矢量绘图平台设计与实现 Design and Implementation of Mobile Device-oriented Vector Drawing Platform 引用本论文 ...

  4. iOS绘图框架CoreGraphics分析

    由于CoreGraphics框架有太多的API,对于初次接触或者对该框架不是十分了解的人,在绘图时,对API的选择会感到有些迷茫,甚至会觉得iOS的图形绘制有些繁琐.因此,本文主要介绍一下iOS的绘图 ...

  5. IOS绘图

    #import "ViewController.h" #import "DrawView.h" @interface ViewController () @pr ...

  6. iOS绘图教程 (转,拷贝以记录)

    本文是<Programming iOS5>中Drawing一章的翻译,考虑到主题完整性,在翻译过程中我加入了一些书中没有涉及到的内容.希望本文能够对你有所帮助. 转自:http://www ...

  7. iOS绘图教程

    本文是<Programming iOS5>中Drawing一章的翻译,考虑到主题完整性,翻译版本中加入了一些书中未涉及到的内容.希望本文能够对你有所帮助.(本文由海水的味道翻译整理,转载请 ...

  8. iOS绘图系统UIKit与Core Graphics

    概述 iOS主要的绘图系统有UIKit,Core Graphics,Core Animation,Core Image,Open GL等,本片博文主要介绍UIKit与Core Graphics的绘图系 ...

  9. OpenGL ES: (3) EGL、EGL绘图的基本步骤、EGLSurface、ANativeWindow

    1. EGL概述 EGL 是 OpenGL ES 渲染 API 和本地窗口系统(native platform window system)之间的一个中间接口层,它主要由系统制造商实现. EGL提供如 ...

随机推荐

  1. 『编程题全队』Beta 阶段冲刺博客五

    1.提供当天站立式会议照片一张 2.每个人的工作 (有work item 的ID) (1) 昨天已完成的工作 孙志威: 1.为新建提醒框添加了正则匹配限制 2.添加了新建Reminder的功能 3.初 ...

  2. PAT L2-027 名人堂与代金券

    https://pintia.cn/problem-sets/994805046380707840/problems/994805055176163328 对于在中国大学MOOC(http://www ...

  3. PAT 1022 D进制的A+B

    https://pintia.cn/problem-sets/994805260223102976/problems/994805299301433344 输入两个非负10进制整数A和B(<=2 ...

  4. PDF文档打印太慢怎么办

    如下图,用Adobe Acrobat打开PDF文件,然后[高级]-打勾[作为图像打印]即可

  5. Angular $broadcast和$emit和$ond实现父子通信

    <!DOCTYPE html><html ng-app="myApp"><head lang="en"> <meta ...

  6. python模块_hashlib详解

    hashlib 摘要算法简介 Python的hashlib提供了常见的摘要算法,如MD5,SHA1等等. 什么是摘要算法呢?摘要算法又称哈希算法.散列算法.它通过一个函数,把任意长度的数据转换为一个长 ...

  7. Linux基础学习(9)--文件系统管理

    第九章——文件系统管理 一.回顾分区和文件系统 1.分区类型: 2.分区表示方法: 3.文件系统: 二.文件系统常用命令 1.df命令.du命令.fsck命令和dump2fs命令: (1)文件系统查看 ...

  8. js脚本 将本地图片路径转换为html

    公司业务类似于电商, 因此有很多纯图片展示的商品详情页, 类似淘宝店商品页面下的多个图片组成的商品详情页, 页面很简单, 就是一大串img标签, 但是每次做详情页都要配合emmet一顿操作( 如下图 ...

  9. ubuntu 程序后台运行几个方法

    51 1. 程序后加上“&” ,即 “./myjob &”, 将命令放入到一个作业队列中,可以用命令“jobs” 查看 2. 将1中的命令放在 “()”中, 即 “(./myjob & ...

  10. BZOJ3298[USACO 2011Open]cow checkers——威佐夫博弈

    题目描述 一天,Besssie准备和FJ挑战奶牛跳棋游戏.这个游戏上在一个M*N的棋盘上, 这个棋盘上在(x,y)(0<=x棋盘的左下角是(0,0)坐标,棋盘的右上角是坐标(M-1,N-1). ...