Quartz 2D中的基本图形绘制

在iOS中绘图一般分为以下几个步骤:

1.获取绘图上下文

2.创建并设置路径

3.将路径添加到上下文

4.设置上下文状态

5.绘制路径

6.释放路径

在UIKit中默认已经为我们准备好了一个图形上下文对象,在UI控件的drawRect:方法(这个方法在 loadView、viewDidLoad方法后执行)中我们可以通过UIKit封装函数UIGraphicsGetCurrentContext()方 法获得这个图形上下文(注意在其他UI控件方法中无法取得这个对象),然后我们只要按照绘图步骤一步步执行即可。下面自定义一个KCView继承自 UIView,重写drawRect:方法绘制两条直线说明上面绘图的步骤:

//
// DLView.m
// Demo0223
//
// Created by wiseman on 16/2/23.
// Copyright (c) 2016年 wiseman. All rights reserved.
// #import "DLView.h" @implementation DLView /*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
// Drawing code
}
*/ //绘图只能在此方法中调用,否则无法得到当前图形上下文
-(void)drawRect:(CGRect)rect{
//1.取得图形的上下文对象
CGContextRef context = UIGraphicsGetCurrentContext(); /*
//2.绘制路径
CGContextMoveToPoint(context, 20, 50);
CGContextAddLineToPoint(context, 20, 100);
CGContextAddLineToPoint(context, 300, 100);
//封闭路径
CGContextClosePath(context); //3.设置图形上下文属性
[[UIColor redColor] setStroke];//设置红色边框
[[UIColor blueColor] setFill];//设置蓝色填充
//[[UIColor blueColor]set];//同时设置填充和边框色 //4.绘制路径
CGContextDrawPath(context, kCGPathFillStroke);
*/ /*
绘制矩形
*/
// [self drawRectWithContext:context]; /*
绘制椭圆
*/
// [self drawEllipseWithContext:context]; /*
绘制弧形
*/
// [self drawArc:context]; /*
绘制贝塞尔曲线
*/
// [self drawCurve:context]; /*
文字绘制
*/
[self drawText:context]; } #pragma mark - 绘制文字
-(void)drawText:(CGContextRef)context{
//绘制到指定的区域内容
NSString *str=@"Star Walk is the most beautiful stargazing app you’ve ever seen on a mobile device. It will become your go-to interactive astro guide to the night sky, following your every movement in real-time and allowing you to explore over 200, 000 celestial bodies with extensive information about stars and constellations that you find.";
CGRect rect= CGRectMake(, , , );
UIFont *font=[UIFont systemFontOfSize:];//设置字体
UIColor *color=[UIColor redColor];//字体颜色
NSMutableParagraphStyle *style=[[NSMutableParagraphStyle alloc]init];//段落样式
NSTextAlignment align=NSTextAlignmentLeft;//对齐方式
style.alignment=align;
[str drawInRect:rect withAttributes:@{NSFontAttributeName:font,NSForegroundColorAttributeName:color,NSParagraphStyleAttributeName:style}];
} #pragma mark - 绘制贝塞尔曲线
-(void)drawCurve:(CGContextRef)context{
//绘制曲线
CGContextMoveToPoint(context, , );//移动到起始位置
/*绘制二次贝塞尔曲线
c:图形上下文
cpx:控制点x坐标
cpy:控制点y坐标
x:结束点x坐标
y:结束点y坐标 CGContextAddQuadCurveToPoint(CGContextRef c, CGFloat cpx, CGFloat cpy, CGFloat x, CGFloat y)
*/
CGContextAddQuadCurveToPoint(context, , , , ); [[UIColor clearColor] setFill];
[[UIColor blackColor] setStroke]; /*绘制三次贝塞尔曲线
c:图形上下文
cp1x:第一个控制点x坐标
cp1y:第一个控制点y坐标
cp2x:第二个控制点x坐标
cp2y:第二个控制点y坐标
x:结束点x坐标
y:结束点y坐标
*/
CGContextMoveToPoint(context, , );
CGContextAddCurveToPoint(context, , , , , , ); [[UIColor redColor] setStroke];
[[UIColor clearColor] setFill]; CGContextDrawPath(context, kCGPathFillStroke);
} #pragma mark - 绘制弧形
-(void)drawArc:(CGContextRef)context{
//添加弧形对象
/*
x:中心点x坐标
y:中心点y坐标
radius:半径
startAngle:起始弧度
endAngle:终止弧度
closewise:是否逆时针绘制,0则顺时针绘制 CGContextAddArc(CGContextRef c, CGFloat x, CGFloat y, CGFloat radius, CGFloat startAngle, CGFloat endAngle, int clockwise)
*/
CGContextAddArc(context, , , , , M_PI_2, );
[[UIColor blueColor]setStroke];
[[UIColor clearColor]setFill];
CGContextDrawPath(context, kCGPathFillStroke); } #pragma mark - 绘制椭圆
-(void)drawEllipseWithContext:(CGContextRef)context{
//添加对象,绘制椭圆(圆形)的过程首先也是创建一个矩形
CGRect rect = CGRectMake(, , , );
CGContextAddEllipseInRect(context, rect);
//设置属性
[[UIColor redColor] set];
CGContextDrawPath(context, kCGPathFillStroke);
} #pragma mark 绘制矩形
-(void)drawRectWithContext:(CGContextRef)context{
//添加矩形对象
CGRect rect=CGRectMake(, , 280.0, 50.0);
CGContextAddRect(context,rect);
//设置属性
[[UIColor blueColor]set];
//绘制
CGContextDrawPath(context, kCGPathFillStroke);
} #pragma mark 绘制矩形(利用UIKit的封装方法)
-(void)drawRectByUIKitWithContext:(CGContextRef)context{
CGRect rect= CGRectMake(, , 280.0, 50.0);
CGRect rect2=CGRectMake(, , 280.0, 50.0);
//设置属性
[[UIColor yellowColor]set];
//绘制矩形,相当于创建对象、添加对象到上下文、绘制三个步骤
UIRectFill(rect);//绘制矩形(只有填充) [[UIColor redColor]setStroke];
UIRectFrame(rect2);//绘制矩形(只有边框)
} @end
上一篇:Unity3D行为树插件Behave学习笔记


下一篇:js中的数组对象排序