UIBezierPath(转)

@import url(/css/cuteeditor.css);
@import url(/css/cuteeditor.css);
@import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/css/cuteeditor.css);

视图可以通过子视图、图层或实现drawRect：方法来表现内容，如果说实现了drawRect：方法，那么最好就不要混用其他方法了，如图层和子视图。自定义绘图大部分是由UIKit或者Core Graphics来实现的。现在我们来讲讲UIBezierPath和Core Graphics。

1.UIBezierPath

UIKit中的UIBezierPath是Core Graphics框架关于path的一个封装。可以创建基于矢量的路径，例如椭圆或者矩形，或者有多个直线和曲线段组成的形状。

1.绘制矩形

绘制矩形最简单的办法是使用UIRectFrame和UIRectFill,如下

- (void)drawRect:(CGRect)rect
{
[[UIColor redColor]setFill];
UIRectFill(CGRectMake(20, 20, 100, 50));
}

其中UIColor setFill是设置画笔颜色。

通过使用UIBezierPath可以自定义绘制线条的粗细，是否圆角等。

- (void)drawRect:(CGRect)rect
{
UIColor *color = [UIColor colorWithRed:0 green:0 blue:0.7 alpha:1];
[color set]; //设置线条颜色
UIBezierPath* aPath = [UIBezierPath bezierPathWithRect:CGRectMake(20, 20, 100, 50)];
aPath.lineWidth = 8.0;
aPath.lineCapStyle = kCGLineCapRound; //线条拐角
aPath.lineJoinStyle = kCGLineCapRound; //终点处理
[aPath stroke];
}

效果如下：

2.圆和椭圆

只有将上面代码中的：

UIBezierPath* aPath = [UIBezierPath bezierPathWithRect:CGRectMake(20, 20, 100, 50)];

替代为以下代码即可绘制一个圆形

UIBezierPath* aPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(20, 20, 100, 100)];

椭圆：

UIBezierPath* aPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(20, 20, 100, 50)];

3.多边形

多边形是一些简单的形状,这些形状是由一些直线线条组成，我们可以用moveToPoint: 和 addLineToPoint:方法去构建。moveToPoint:设置我们想要创建形状的起点。从这点开始，我们可以用方法addLineToPoint:去创建一个形状的线段。
我们可以连续的创建line，每一个line的起点都是先前的终点，终点就是指定的点。
closePath可以在最后一个点和第一个点之间画一条线段。

- (void)drawRect:(CGRect)rect
{
UIColor *color = [UIColor colorWithRed:0 green:0.7 blue:0 alpha:1];
[color set];
UIBezierPath* aPath = [UIBezierPath bezierPath];
aPath.lineWidth = 5.0;
aPath.lineCapStyle = kCGLineCapRound;
aPath.lineJoinStyle = kCGLineCapRound;
// 起点
[aPath moveToPoint:CGPointMake(100.0, 0.0)];
// 绘制线条
[aPath addLineToPoint:CGPointMake(200.0, 40.0)];
[aPath addLineToPoint:CGPointMake(160, 140)];
[aPath addLineToPoint:CGPointMake(40.0, 140)];
[aPath addLineToPoint:CGPointMake(0.0, 40.0)];
[aPath closePath];//第五条线通过调用closePath方法得到的
//根据坐标点连线
[aPath stroke];
[aPath fill];
}

效果如下：

4.不规则形状

想画弧线组成的不规则形状，我们需要使用中心点、弧度和半径，如下图。弧度使用顺时针脚底，0弧度指向右边，pi/2指向下方，pi指向左边，-pi/2指向上方。然后使用bezierPathWithArcCenter: radius: startAngle endAngle: clockwise:方法来绘制。

1).绘制一段弧度

- (void)drawRect:(CGRect)rect
{
UIColor *color = [UIColor redColor];
[color set]; //设置线条颜色
UIBezierPath* aPath = [UIBezierPath bezierPathWithArcCenter:CGPointMake(80, 80)
radius:75
startAngle:0
endAngle:DEGREES_TO_RADIANS(135)
clockwise:YES];
aPath.lineWidth = 5.0;
aPath.lineCapStyle = kCGLineCapRound; //线条拐角
aPath.lineJoinStyle = kCGLineCapRound; //终点处理
[aPath stroke];
}

结果如下：

2).两种贝塞尔曲线

a).第一种：

- (void)drawRect:(CGRect)rect
{
UIColor *color = [UIColor redColor];
[color set]; //设置线条颜色
UIBezierPath* aPath = [UIBezierPath bezierPath];
aPath.lineWidth = 5.0;
aPath.lineCapStyle = kCGLineCapRound; //线条拐角
aPath.lineJoinStyle = kCGLineCapRound; //终点处理
[aPath moveToPoint:CGPointMake(20, 100)];
[aPath addQuadCurveToPoint:CGPointMake(120, 100) controlPoint:CGPointMake(70, 0)];
[aPath stroke];
}

效果如下：

b).第二种：

- (void)drawRect:(CGRect)rect
{
UIColor *color = [UIColor redColor];
[color set]; //设置线条颜色
UIBezierPath* aPath = [UIBezierPath bezierPath];
aPath.lineWidth = 5.0;
aPath.lineCapStyle = kCGLineCapRound; //线条拐角
aPath.lineJoinStyle = kCGLineCapRound; //终点处理
[aPath moveToPoint:CGPointMake(5, 80)];
[aPath addCurveToPoint:CGPointMake(155, 80) controlPoint1:CGPointMake(80, 0) controlPoint2:CGPointMake(110, 100)];
[aPath stroke];
}

3).曲线组合：

下面我们来画一朵花：

- (void)drawRect:(CGRect)rect {
CGSize size = self.bounds.size;
CGFloat margin = 10;
//rintf：四舍五入函数
CGFloat radius = rintf(MIN(size.height - margin, size.width - margin) / 4);
CGFloat xOffset, yOffset;
CGFloat offset = rintf((size.height - size.width) / 2);
if (offset > 0) {
xOffset = (CGFloat)rint(margin / 2);
yOffset = offset;
} else {
xOffset = -offset;
yOffset = rintf(margin / 2);
}
[[UIColor redColor] setFill];
UIBezierPath *path = [UIBezierPath bezierPath];
[path addArcWithCenter:CGPointMake(radius * 2 + xOffset, radius + yOffset)
radius:radius
startAngle:(CGFloat)-M_PI
endAngle:0
clockwise:YES];
[path addArcWithCenter:CGPointMake(radius * 3 + xOffset, radius * 2 + yOffset)
radius:radius
startAngle:(CGFloat)-M_PI_2
endAngle:(CGFloat)M_PI_2
clockwise:YES];
[path addArcWithCenter:CGPointMake(radius * 2 + xOffset, radius * 3 + yOffset)
radius:radius
startAngle:0
endAngle:(CGFloat)M_PI
clockwise:YES];
[path addArcWithCenter:CGPointMake(radius + xOffset, radius * 2 + yOffset)
radius:radius
startAngle:(CGFloat)M_PI_2
endAngle:(CGFloat)-M_PI_2
clockwise:YES];
[path closePath];
[path fill];
}



记得调用以下这个方法，使其view变化后(例如横屏了)重新调用drawRect：

- (void)awakeFromNib 


{
// Comment this line to see default behavior
self.contentMode = UIViewContentModeRedraw;
}

@import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/css/cuteeditor.css);

时间： 2024-11-13 10:08:51

UIBezierPath(转)的相关文章

CALayer与UIBezierPath

UIView继承于UIResponder CALayer继承于nsobject 创建UIView创建一个layer,通过UIView的layer属性可依访问它的图层.UIView具有事件处理功能,可以与用户交互,layer负责显示和动画任务. 要显示一个UIView,会自动调用起drawRect方法绘画所有内容,然后字啊将图层拷贝到屏幕上,完成UICView的显示. frame不能作动画  修改大小bounds  修改位子position CALayer不能直接使用UIColer.UIImage

IOS Animation-CAShapeLayer、UIBezierPath与Animation的结合

在阅读本文之前,对CAShapeLayer.UIBezierPath不熟悉的话,可以先阅读文章 贝塞尔曲线与Layer 如果对动画不熟悉的话,先阅读文章 动画基础.深入 Layer是绘图的画板,Bezier是画图的画笔,Animation是画图的动作.现在我们可以通过下面例子更好的让它们更好地结合在一起. 1)画一个小屋子动画 我们首先通过定义CAShapeLayer画板,然后定义path来确定画图路径.最后使用动画.如下面代码 1 //让一个屋子的线画起来的动画效果 2 func addCAS

UIBezierPath 贝塞尔曲线

1. UIBezierPath * path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(30, 30, 100, 100) cornerRadius:0]; CAShapeLayer * layer = [CAShapeLayer layer];    layer.path = path.CGPath;    layer.fillColor = [[UIColor blackColor]CGColor]; layer.strokeC

使用贝赛尔路径(UIBezierPath)创建画板

在iOS开发中,创建图形,经常会使用贝塞尔路径,用于描绘一些比较复杂的图形. 使用贝塞尔路径,需要在view中的方法- (void)drawRect:(CGRect)rect中进行描绘. 1 - (void)drawRect:(CGRect)rect{ 2 UIBezierPath *path = [UIBezierPath bezierPath]; 3 // 起点 4 [path moveToPoint:CGPointMake(0, 0)]; 5 // 途经点 6 [path addLineT

通过UIBezierPath贝塞尔曲线画圆形、椭圆、矩形

/**创建椭圆形的贝塞尔曲线*/ UIBezierPath *_ovalPath=[UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 200, 100)]; /**创建矩形的贝塞尔曲线*/ UIBezierPath *_rectPath=[UIBezierPath bezierPathWithRect:CGRectMake(0, 0, 200, 100)]; /**创建圆形的贝塞尔曲线*/ UIBezierPath *_circlePa

UIBezierPath和CGContext类中的方法

 UIBezierPath和CGContext类中的方法 CGContextSetLineWidth(ctr, 10); // 即描写边线又填充 CGContextDrawPath(ctr, kCGPathFillStroke); void CGContextSetLineWidth(CGContextRef c, CGFloat width); // 设置边线的宽度 void CGContextAddLineToPoint(CGContextRef c, CGFloat x, CGFloat

iOS学习：CAShapeLayer与UIBezierPath动画

CAShapeLayer与UIBezierPath动画: CAShapeLayer与UIBezierPath的动画,就离不开 CABasicAnimation:也将会使用到 strokeEnd.strokeStart.lineWidth 三个属性: 先做一条贝塞尔曲线: UIBezierPath *path = [UIBezierPath bezierPath]; [path moveToPoint:CGPointMake(40, 80)]; [path addCurveToPoint:CGPo

iOS开发 贝塞尔曲线UIBezierPath（2）

使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形 . 1:UIBezierPath: UIBezierPath是在 UIKit 中的一个类,继承于NSObject,可以创建基于矢量的路径.此类是Core Graphics框架关于path的一个OC封装.使用此类可以定义常见的圆形.多边形等形状 .我们使用直线.弧(arc)来创建复杂的曲线形状.每一个直线段或者曲线段的结束的地方是下一个的开始的地方.每一个连接的直线或者曲线段的集

用UIBezierPath数组对UIView进行镂空处理

效果 源码 // // CutOutClearView.h // CutOutMaskView // // Created by YouXianMing on 16/7/8. // Copyright © 2016年 YouXianMing. All rights reserved. // #import <UIKit/UIKit.h> @interface CutOutClearView : UIView @property (nonatomic, strong) UIColor *fill

XMG UIBezierPath与CGContextRef

1. 贝泽尔路径只有当stroke的时候才会添加到上下文当中 如果想要在stroke之前就添加到上下文中的话 // 把路径添加到上下文 // .CGPath 可以UIkit的路径转换成CoreGraphics路径 CGContextAddPath(ctx, path.CGPath); 如果用贝泽尔stroke 的话只认贝泽尔的状态,是不去管上下文的状态 2. 现在存在的问题是如果我设置的是上下文的状态的话.那么以后绘制的内容所有的状态都和现在一样. 我还需要去单独进行设置 3. 绘图的状态包括线