好了,在之前的两篇文章里面写了Quartz2D的一些基本知识。从这篇开始写一下OC绘制基本图形的方法。
UIRectFill(rect)
UIRectFrame(rect)
[str drawInRect:rect withAttributes:attr];
[image drawInRect:rect]
[image drawAtPoint:CGPointZero];
[image drawAsPatternInRect:rect];
线头样式及交叉线样式.png
- (void)drawRect:(CGRect)rect {
// 创建路径
UIBezierPath *path = [UIBezierPath bezierPath];
// 移动到起点
[path moveToPoint:CGPointMake(10, 10)];
// 添加线段到终点
[path addLineToPoint:CGPointMake(90, 90)];
[path moveToPoint:CGPointMake(90, 10)];
[path addLineToPoint:CGPointMake(10, 90)];
// 设置线宽
path.lineWidth = 10.0f;
// 设置线头样式
path.lineCapStyle = kCGLineCapRound;
// 设置线交叉样式
path.lineJoinStyle = kCGLineJoinMiter;
// 渲染
[path stroke];
}
- (void)drawRect:(CGRect)rect {
// 创建路径
// 参数1:矩形的左上角圆点及矩形的宽高。参数2:矩形圆角的半径
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(10, 10, 80, 80) cornerRadius:10];
// 渲染
[path stroke];
}
- (void)drawRect:(CGRect)rect {
UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(10, 10, 90, 30)];
[path stroke];
}
- (void)drawRect:(CGRect)rect {
// 绘制扇形。参数:1,圆点坐标。参数2:半径。参数3+4,起点和终点的弧度。参数5:YES表示顺时针,NO表示逆时针。
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(50, 50) radius:30 startAngle:0 endAngle:M_PI_2 clockwise:YES];
//连接圆心
[path addLineToPoint:CGPointMake(50, 50)];
// 渲染
[path fill];
}
- (void)drawRect:(CGRect)rect {
// 准备文字
NSString *str = @"今天天气不错,挺风和日丽的";
// 设置文字属性:字号为12,颜色为灰色,描边宽度为10
NSDictionary *attriStr = @{NSFontAttributeName:[UIFont systemFontOfSize:12.0],NSForegroundColorAttributeName:[UIColor grayColor],NSStrokeWidthAttributeName:@10
};
// 绘制方式一:在限定的rect范围内进行绘制,文字会自动换行
[str drawInRect:CGRectMake(0, 0, 45, 100) withAttributes:attriStr];
// 绘制方式二:从指定的点开始绘制。超出view 的区域就不再显示了。
[str drawAtPoint:CGPointMake(0, 45) withAttributes:attriStr];
}
drawInrect
进行绘制
图片比区域小,就会拉伸;图片比区域大,就会压缩。drawAtPoint
进行绘制
有多大就绘制多大,不做任何压缩、拉伸drawAsPatten
进行绘制
如果图片比区域小,会进行平铺;如果图片比区域大,有多少绘制多少- (void)drawRect:(CGRect)rect {
UIImage *image = [UIImage imageNamed:@"image"];
// 方式一:
[image drawInRect:CGRectMake(10, 10, 50, 50)];
// 方式二:
[image drawAtPoint:CGPointMake(55, 55)];
// 方式三:
[image drawAsPatternInRect:CGRectMake(50, 50, 100, 100)];
}
/**
保存图片事件
@param sender 保存按钮
*/
- (IBAction)savePicture:(id)sender {
// 开启图片context。参数1:context的大小。参数2:是否不透明。参数三:缩放比,0 表示当前屏幕的缩放比 UIGraphicsBeginImageContextWithOptions(self.patinView.bounds.size, NO, 0);
// 获取图片的范围
[self.patinView drawViewHierarchyInRect:self.patinView.bounds afterScreenUpdates:YES];
// 从context获取图片
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
// 结束context,开启一定要结束
UIGraphicsEndImageContext();
// 将图片保存至照片库
UIImageWriteToSavedPhotosAlbum(image, self, @selector(image:didFinishSavingWithError:contextInfo:), nil);
}
//系统指定的保存后结束要执行的方法
- (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo{
}
系统指定的保存后结束要执行的方法.png
OS8.0 之后,访问相册,给出提示文字。
访问相册,给出提示文字.png
接下来,会分享如何使用OC绘制饼状图、柱状图和扇形图。以及如何使用它们来绘制动态的进度条等等