基于CoreGraphics的常见图形的绘制方法

最新推荐文章于 2018-12-23 14:44:03 发布
最新推荐文章于 2018-12-23 14:44:03 发布
阅读量707 收藏 1
点赞数
分类专栏： iOS Developer
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wugao2013/article/details/25806425
版权

        绘制图形并不复杂，但是项目中构建UI界面的时候，经常需要用到。为了方便，我写了一个类，里面定义了绘制常见图形的接口，最后得到一个小机器人。最初的设计是这样滴：唉，算了，本人的绘画功底实在惨不忍睹。大哭

  然后上代码吧：

  

//  Created by Wu on 14-5-14.
//  Copyright (c) 2014年 Wu. All rights reserved.
//

#import "DrawRobbort.h"

//此接口主要定义一些绘制图形的
@interface DrawRobbortClass : NSObject

//绘制空心矩形
-(void) drawRectangleEmpty:(CGRect)rect withColor:(UIColor*)color;
//绘制实心矩形
-(void) drawRectangleFull:(CGRect)rect withColor:(UIColor*)color;
//绘制空心三角形
-(void) drawDeltaEmpty:(CGPoint)firstPoint
            otherPoint:(CGPoint)otherPoint
             lastPoint:(CGPoint)lastPoint
             withColor:(UIColor*)color;
//绘制空心三角形
-(void) drawDeltaFull:(CGPoint)firstPoint
            otherPoint:(CGPoint)otherPoint
             lastPoint:(CGPoint)lastPoint
             withColor:(UIColor*)color;
//绘制一条直线
-(void) drawLineEmpty:(CGPoint)firstPoint
           otherPoint:(CGPoint)otherPoint
            withColor:(UIColor*)color;
//绘制一个空心的圆形
-(void)drawRoundEmpty:(CGRect)rect withColor:(UIColor*)color;
//绘制一个实心的圆形
-(void)drawRoundFull:(CGRect)rect withColor:(UIColor*)color;

@end
    这个是写了一个私有类，接口都是私有的。嘿嘿！实现文件如下： 

@implementation DrawRobbortClass

//绘制空心矩形
-(void) drawRectangleEmpty:(CGRect)rect withColor:(UIColor*)color;
{
    CGContextRef  context = UIGraphicsGetCurrentContext();
    CGContextStrokeRect(context, rect);
    //CGContextSetRGBStrokeColor(context, 0.6, 0.9, 0, 1.0); //设置线条的颜色
//    CGContextSetFillColorWithColor(context, [UIColor blueColor].CGColor);
//    CGContextSetRGBFillColor(context, 61/255.0f, 122/255.0f, 160/255.0f, 0.2f);
    CGContextStrokePath(context);
    
}

//绘制实心矩形
-(void) drawRectangleFull:(CGRect)rect withColor:(UIColor*)color;
{
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextAddRect(context, rect);
    CGContextSetFillColorWithColor(context, color.CGColor);
    CGContextFillPath(context);
}

//绘制空心三角形
-(void) drawDeltaEmpty:(CGPoint)firstPoint
            otherPoint:(CGPoint)otherPoint
             lastPoint:(CGPoint)lastPoint
             withColor:(UIColor*)color;
{
    //画三角形
    CGContextRef  context = UIGraphicsGetCurrentContext(); //获取当前上下文
    CGMutablePathRef pathRef = CGPathCreateMutable();
    // 初始化该path到一个初始点
    CGPathMoveToPoint(pathRef, &CGAffineTransformIdentity, firstPoint.x, firstPoint.y);
    // 添加一条直线，从初始点到该函数指定的坐标点
    CGPathAddLineToPoint(pathRef, &CGAffineTransformIdentity, otherPoint.x, otherPoint.y);
    CGPathAddLineToPoint(pathRef, &CGAffineTransformIdentity, lastPoint.x, lastPoint.y);
    // 关闭该path
    CGPathCloseSubpath(pathRef);
    // 将此path添加到Quartz上下文中
    CGContextAddPath(context, pathRef);
    // 对上下文进行描边
    CGContextStrokePath(context);
}

//绘制实心三角形
-(void) drawDeltaFull:(CGPoint)firstPoint
            otherPoint:(CGPoint)otherPoint
             lastPoint:(CGPoint)lastPoint
             withColor:(UIColor*)color;
{
    CGContextRef context = UIGraphicsGetCurrentContext(); //获取图形上下文
    CGContextBeginPath(context); //创建一个新的空图形路径
    CGContextMoveToPoint(context, firstPoint.x, firstPoint.y);
    CGContextAddLineToPoint(context, otherPoint.x, otherPoint.y);
    CGContextAddLineToPoint(context, lastPoint.x, lastPoint.y); //在当前点追加直线段
    //关闭并终止当前路径的子路径，并在当前点和子路径的起点之间追加一条线
    CGContextClosePath(context);
    CGContextSetFillColorWithColor(context, color.CGColor); //设置填充色
    //绘制当前路径
    CGContextFillPath(context);
}

//绘制一条直线
-(void) drawLineEmpty:(CGPoint)firstPoint
           otherPoint:(CGPoint)otherPoint
            withColor:(UIColor*)color;
{
    CGContextRef  context = UIGraphicsGetCurrentContext(); //获取当前上下文
    CGContextMoveToPoint(context, firstPoint.x, firstPoint.y); //设置起点
    CGContextAddLineToPoint(context, otherPoint.x, otherPoint.y); //设置终点
    CGContextSetLineWidth(context, 2); //设置线宽度
    CGContextSetLineCap(context, kCGLineCapSquare);
    CGContextSetRGBStrokeColor(context, 1.0,0.0,0.0,1.0);
    CGContextStrokePath(context);
}

//绘制一个空心的圆形
-(void)drawRoundEmpty:(CGRect)rect withColor:(UIColor*)color;
{
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetRGBStrokeColor(context, 0.6, 0.9, 0, 1.0); //设置线条的颜色
    CGContextSetLineWidth(context, 1.0);  //设置宽度
    CGContextSetFillColorWithColor(context, color.CGColor);
    CGContextAddEllipseInRect(context, rect);
    CGContextStrokePath(context); //跟上句代码效果是一样的
}

//绘制一个实心的圆形
-(void)drawRoundFull:(CGRect)rect withColor:(UIColor*)color;
{
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextAddEllipseInRect(context,rect);
    CGContextSetFillColorWithColor(context, color.CGColor);
    CGContextFillPath(context);
}

   好了，接口设计完毕了。开始调用吧！

   

@implementation DrawRobbort

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        
    }
    return self;
}

- (void)drawRect:(CGRect)rect;
{
    DrawRobbortClass * drawRobbortClass = [[DrawRobbortClass alloc] init];
    //绘制天线
    CGPoint  point_1 = CGPointMake(100, 60);
    CGPoint  point_2 = CGPointMake(130, 80);
    CGPoint  point_3 = CGPointMake(190, 60);
    CGPoint  point_4 = CGPointMake(160, 80);
    //绘制两条眉毛
    CGPoint  point_5 = CGPointMake(110, 100);
    CGPoint  point_6 = CGPointMake(130, 120);
    CGPoint  point_7 = CGPointMake(180, 100);
    CGPoint  point_8 = CGPointMake(160, 120);
    //鼻子的坐标
    CGPoint  point_9 = CGPointMake(145, 122);
    CGPoint  point_10 = CGPointMake(130, 140);
    CGPoint  point_11 = CGPointMake(160, 140);
    //绘制两条手臂
    CGPoint  point_12 = CGPointMake(80, 220);
    CGPoint  point_13 = CGPointMake(30, 250);
    CGPoint  point_14 = CGPointMake(220, 220);
    CGPoint  point_15 = CGPointMake(270, 250);
    
    //绘制两条大腿
    CGRect rectleftLeg = CGRectMake(100, 360, 20, 250);
    CGRect rectRightLeg = CGRectMake(180, 360, 20, 250);
    //绘制两双脚
    CGRect rectleftFoot = CGRectMake(60, 390, 60, 30);
    CGRect rectRightFoot = CGRectMake(180, 390, 60, 30);
    
    //脑袋的坐标
    CGRect rectHead = CGRectMake(100, 80, 100, 100);
    //肚子坐标
    CGRect rectBelly = CGRectMake(80, 220, 140, 140);
    //脖子的坐标
    CGRect rectNeck = CGRectMake(135, 180, 30, 40);
    //嘴巴的坐标
    CGRect rectMouth = CGRectMake(130, 145, 30, 30);
    //眼睛的坐标
    CGRect rectleftEye  = CGRectMake(110, 115, 10, 10);
    CGRect rectRightEye = CGRectMake(170, 115, 10, 10);
    //手的坐标
    CGRect rectleftHand  = CGRectMake(20, 240, 30, 30);
    CGRect rectRightHand = CGRectMake(260, 240, 30, 30);
    //可爱的机器人有话说
    CGRect rectText = CGRectMake(230, 80, 70, 20);
    
    UIColor * color = [UIColor redColor];
    //先绘制两根天线
    [drawRobbortClass drawLineEmpty:point_1 otherPoint:point_2 withColor:color];
    [drawRobbortClass drawLineEmpty:point_3 otherPoint:point_4 withColor:color];
    //然后绘制正方形大脑袋
    [drawRobbortClass drawRectangleEmpty:rectHead withColor:color];
    //开始绘制两条眉毛
    [drawRobbortClass drawLineEmpty:point_5 otherPoint:point_6 withColor:color];
    [drawRobbortClass drawLineEmpty:point_7 otherPoint:point_8 withColor:color];
    //开始绘制两个眼睛
    [drawRobbortClass drawRectangleEmpty:rectleftEye withColor:color];
    [drawRobbortClass drawRectangleEmpty:rectRightEye withColor:color];
    //开始绘制鼻子
    [drawRobbortClass drawDeltaFull:point_9 otherPoint:point_10 lastPoint:point_11 withColor:color];
    //开始绘制嘴巴
    [drawRobbortClass drawRectangleEmpty:rectMouth withColor:color];
    //开始绘制脖子
    [drawRobbortClass drawRectangleFull:rectNeck withColor:color];
    //开始绘制肚子
    [drawRobbortClass drawRectangleEmpty:rectBelly withColor:color];
    //再画两条手臂
    [drawRobbortClass drawLineEmpty:point_12 otherPoint:point_13 withColor:color];
    [drawRobbortClass drawLineEmpty:point_14 otherPoint:point_15 withColor:color];
    //开始画手
    [drawRobbortClass drawRoundFull:rectleftHand withColor:color];
    [drawRobbortClass drawRoundFull:rectRightHand withColor:color];
    //开始画腿
    [drawRobbortClass drawRectangleFull:rectleftLeg withColor:color];
    [drawRobbortClass drawRectangleFull:rectRightLeg withColor:color];
    //开始画脚
    [drawRobbortClass drawRectangleFull:rectleftFoot withColor:color];
    [drawRobbortClass drawRectangleFull:rectRightFoot withColor:color];
    //尼玛大功告成了
    //开始画对话框
    [drawRobbortClass drawRectangleEmpty:rectText withColor:color];
    UILabel * textLabel = [[UILabel alloc] initWithFrame:CGRectMake(230, 40, 100, 100)];
    [textLabel setTextColor:[UIColor redColor]];
    [textLabel setText:@"渣渣们"];
    [self addSubview:textLabel];
    //
}


@end
    然后，实例化这个View，添加到FirstViewcontroller的view上： 

- (void)viewDidLoad
{
    [super viewDidLoad];
    self.navigationItem.title = @"首页";
    UIBarButtonItem * leftBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"下一页" style:UIBarButtonItemStylePlain target:self action:@selector(leftBarButtonItemClicked:)];
    self.navigationItem.rightBarButtonItem = leftBarButtonItem;
    self.drawRobbort = [[DrawRobbort alloc] initWithFrame:CGRectMake(0, 65, 320, 400)];
    _drawRobbort.backgroundColor = [UIColor clearColor];
    [self.view addSubview:_drawRobbort];
    
}
   运行，一切正常，可爱的小机器人就粗来啦！哈哈哈哈！


   吐槽吧大婶们！！
Cocoa_ios
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
基于Core Graphics框架
04-05
作者wang82426107，源码SDauthCode，一个基于Core Graphics框架的本地动态验证码，喜欢的朋友可以参考一下。
Graphics 框架画各种图形（圆、三角形、扇形、弧线、圆角矩形等等）
热门推荐
图解AI
03-16 2万+
Core Graphics Framework是一套基于C的API框架，使用了Quartz作为绘图引擎。它提供了低级别、轻量级、高保真度的2D渲染。该框架可以用于基于路径的绘图、变换、颜色管理、脱屏渲染，模板、渐变、遮蔽、图像数据管理、图像的创建、遮罩以及PDF文档的创建、显示和分析。 iOS支持两套图形API族：Core Graphics/QuartZ 2D 和OpenGL ES。OpenGL
CoreGraphics简单绘图学习
liuzhihui666的博客
03-18 887
一、导入coreGraphics.framework 二、绘制图形 1、绘制矩形 // 绘制矩形 - (void)drawRectangle { // 定义矩形的rect CGRect rectangle = CGRectMake(100, 290, 120, 25); // 获取当前图形，视图推入堆栈的图形，相当于你所要绘制图形的图纸 CGConte
iOS圆角view的Swift实现（利用Core Graphics绘制）
weixin_30449453的博客
11-01 356
iOS圆角view的Swift实现（利用Core Graphics绘制） 因为app的列表用用到了圆形图片的头像，所以去探究并思考了一下这个问题。首先这个问题有两个方向的解决方案： 把图片弄成圆形的。 把ImageView弄成圆形的。 这两个解决方案如果只在前端解决的话，我比较推荐第二种方案类型的。因为在列表中，修改的ImageView是可以参与Cell的重用的。但是第一种方案也有特殊的，因...
.Net Core 使用 ImageSharp 画图形
睡在上铺的猴
07-28 8500
首先在项目中NuGet添加程序包：SixLabors.ImageSharp 和 SixLabors.ImageSharp.Drawing 接下来就可以愉快的玩耍啦 画贝塞尔曲线： using (var image = new Image<Rgba32>(500, 500)) { //贝塞尔曲线 ...
利用CoreGraphics.framework框架 自己画圆
木头书屋专栏
06-05 1105
CGContextRef line = UIGraphicsGetCurrentContext();     CGContextSetLineWidth(line, 4);     CGContextSetStrokeColorWithColor(line, [UIColor colorWithRed:229.0f/255.0f green:229.0f/255.0f blue:229
CoreGraphicsGraph:在Swift中使用CoreGraphics绘制折线图。 该代码旨在作为示例，说明如何使用CoreGraphics绘制图形和其他类似的UI元素
04-08
CoreGraphicsGraph 使用CGPath和Swift绘制折线图。 这实际上只是使用Swift的结果，因此我无法保证代码已准备好投入生产，甚至非常好。 // GraphView.swift example usagelet myData = [ [ " Mon " : 15 ], [ " Tues ...
iOS仿微博导航栏动画(CoreGraphics)的实现方法
08-27
主要给大家介绍了关于iOS仿微博导航栏动画(CoreGraphics)的实现方法，文章最后给出了完整的示例代码，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
CoreGraphics：CoreGraphics
02-20
CoreGraphics：CoreGraphics
基于.net core微服务的另一种实现方法
01-02
基于.net core 的微服务,网上很多介绍都是千篇一律基于类似webapi,通过http请求形式进行访问,但这并不符合大家使用习惯.如何像形如[ GetService().SaveOrder(orderInfo)]的方式, 调用远程的服务,如果你正在为此苦恼,...
CoreGraphic&UIBezierPath绘图比较
cc_guang的专栏
01-13 637
CoreGraphic&UIBezierPath绘图比较CoreGraphic框架提供了面向C语言风格的绘图API，而贝塞尔曲线实际是面向OC编程风格的绘图方式，但其实它是对CoreGraphic的封装，下面我向大家展示这两种绘图方式：CoreGraphic绘图/** 使用CoreGraphic来绘制 */ - (void)drawRect:(CGRect)rect { CGContex
Core Graphics之（二）：绘制：矩形、椭圆、圆形、文字、图片
leleyuan1130的博客
02-04 2650
使用Graphics函数可以绘制线段，也可以绘制图形。 1、绘制矩形（可以使用线段拼接绘制图形，但iOS提供了更好用的绘制图形的函数） 2、在设定的CGRect中画圆，随CGRect的形状而改变 圆形 椭圆 3、使用绘制圆形的函数画圆 4、画字符串 5、画图片 6、在图片上添加水印（画文字） ...
CocosCreator之KUOKUO带你用cc.graphics做个小画板
kuokuo666的博客
12-03 7765
本次引擎2.0.5 编辑工具VSCode 如遇不会某个步骤可以先过一遍之前教程，或者下方评论，感谢支持！   目标：使用cc.graphics组件完成一个小画板 啦啦啦，让我们快乐地画画去！   好了，新建工程，建个白色背景，再加个空节点起名为draw 给draw添加渲染组件-->cc.graphics组件。 调整属性：（代码里也可以修改） 好了，让我们新建个Ja...
iOS绘图教程
weixin_30765475的博客
12-12 188
　　本文是《Programming iOS5》中Drawing一章的翻译，考虑到主题完整性，翻译版本中加入了一些书中未涉及到的内容。希望本文能够对你有所帮助。 　　本文由海水的味道翻译整理，转载请注明译者和出处，请勿用于商业用途！ Core Graphics Framework是一套基于C的API框架，使用了Quartz作为绘图引擎。它提供了低级别、轻量级、高保真度的2D渲染。该框...
使用CoreGraphics绘制一个简单的折线图，可自定义坐标。
qq_28699375的博客
11-17 1330
首先新建一个工程，然后，导入CoreGraphics和UIKit框架。然后，创建一个坐标点的模型类。 OnePoint.h #import @interface OnePoint : NSObject @property (nonatomic, assign) float x; @property (nonatomic, assign) float
核心绘图——Core Graphics
诠释完美
10-30 4755
一. Core Graphics简介 Core Graphics是一个基于C的绘图专用的API族，它经常被称为QuartZ或QuartZ 2D，是一个二维绘图引擎，同时支持iOS和Mac系统。它提供了低级别、轻量级、高保真度的2D渲染。该框架可以用于基于路径的绘图、变换、颜色管理、脱屏渲染，模板、渐变。 提示： 引擎：经过包装的函数库，方便开发者使用。QuartZ 2D是苹果帮封装的一套绘
Swift - Core Graphics绘图框架详解4（绘制图片、图形变换）
雨夜枫起的博客
11-29 2334
一、绘制图像 Core Graphics 也是支持绘制图片图像的，而且 UIKit 中对这个做了封装，方便我们使用。 1，绘制到指定的矩形中 使用这种方式的话图片会自动进行拉伸。如果矩形比例不对，图片会变形。 import UIKit   class ViewController: UIViewController {     
iOS总结-有关动画基础之CoreGraphics、Quartz2D、QuartzCore、CoreAnimation的总结
qq_28551705的博客
12-23 613
参考:https://blog.csdn.net/make___/article/details/45576857https://www.jianshu.com/p/397690fd4555 一直对于CoreGraphics, QuartzCore, CoreAnimation区分不清楚。 CoreGraphics,核心图形。它是ios的核心图形库，平时使用最频繁的point,size,rect等...
opencv在图形上绘制三维物体
最新发布
05-18
// 绘制三维图形 cv::Mat img = cv::Mat::zeros(480, 640, CV_8UC3); std::vector<std::vector<cv::Point>> contours = {{points[0], points[1], points[2], points[3]}, {points[4], points[5], points[6], ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值