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);