自定义View(画直线,弧线,扇形)

自定义View

1.首先,得有图形上下文,因为他能保存绘图细信息,并且决定着绘制到什么地方去
2.其次,那个图形上下文必须跟view相关联,才能将内容绘制到view上面

自定义View的步骤

1.新建一个类,继承子UIView
2.实现-(void)drawRect:(CGRect)rect方法,然后在这个方法中
1)取得跟当前view相关联的图形上下文
2)绘制相应的图形内容
3)利用图形上下文将绘制的所有内容渲染显示到view上面

eg:画直线

在drawRect方法中系统已经帮你创建了一个跟View相关联的上下文(Layer上下文) 只要直接获取就可以了

-(void)drawRect:(CGRect)rect{
//1.创建一个图形上下文(画板)
CGContextRef ctx = UIGraphicsGetCurrentContext();
//2.创建一个绘制路径(画笔)
UIbezierPath *path = [UIbezierPath bezierPath];
//3.设置起点
[path moveToPoint:CGPointMake(50,200)];
//4.设置直线终点
[path addLineToPoint:CGPointMake(280,50)];
//5.将图形添加到图形上下文中
//UIbezierPath:UIKit框架->CGPathRef:CoreGraphics框架
CGContextAddPath(ctx,path.CGPath);
//6.将图形上下文的内容显示到View上(渲染到View的Layer)(stroke fill)
CGContextStrokePath(ctx);
}
上下文的状态(线宽等)(都是在drawRect方法中调用)
  • 线宽
CGContextSetLineWidth(ctx,10);
  • 线的连接样式
CGContextSetLineJoin(ctx,KCGLineJoinRound);
  • 线的端点样式
CGContextSetLineCap(ctx,KCGLineCapRound);
  • 线的颜色(设置的时候方式需要和将图形上下文显示到View的方式相同,如果只用set,他就可以自动识别)
[[UIColor redColor] setStroke];
或者
[[UIColor redColor] set];
  • 添加曲线(后面的参数是控制点)
只是添加终点的时候不一样,其他的都一样
[path addQuadCurveToPoint:CGPointMake(250,200) controlPoint:CGPointMake(50,50)];
画弧

//在设置路径的时候用的方法不同
//在显示上下文的方法不同

//圆心
CGpoint center = CGPointMake(rect.size.width * 0.5,rect.size.height * 0.5);
//半径
CGFloat radius = rect.size.width * 0.5 - 10;
//开始角度(-90度)
CGFloat starA = -M_PI_2;
//结束角度()
self.progressValue:进度条的值
CGFloat angle = self.progressValue * M_PI *2;
CGFloat endA =starA + angle ;
//是否顺时针
clockwise
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:starA endAngle:endA clockwise:YES];

将上下文渲染到View上面

CGContextStrokePath(<上下文的名字>);
  • 注意:
    1)drawRect如果是手动调用的话,它是不会给你创建跟View相关联的上下文,只有系统调用该方法,才会创建跟View相关联的上下文,如果想要实现和系统一样的效果需要调用重绘方法
  • 重绘(系统自动帮你调用drawRect:)
[self setNeedsDisplay];
画扇形
  • 和画弧一样,不过需要在画的同时添加线到圆心
//给扇形添加颜色
[[UIColor redColor] set];
//添加线
[path addLineToPoint:center]
[path fill];

直接绘制(设置路径,路径的状态)

  • 有路径,有起点,有终点也可以直接绘制
[path stroke];
  • 设置线的宽度
[path setLineWidth:10];
  • 设置线的连接方法
[path setLineJoinStyle:KCGLineJoinRound];

你可能感兴趣的:(iOS-UI,iOS开发,ios,objective-c,xcode)