iOS 中绘图的几种方法

参考文章:https://bihongbo.com/2016/01/03/memoryGhostdrawRect/#more

                    http://www.cocoachina.com/ios/20170809/20187.html

                    https://zsisme.gitbooks.io/ios-/content/chapter2/custom-drawing.html

iOS提供了两套绘图框架,分别是UIBezierPath和Core Graphics。UIBezierPath属于UIKit。UIBezierPath是对Core Graphics框架的进一步封装。

OpenGL和Core Graphics都是绘图专用的API类族,调用图形处理器(GPU)进行图形的绘制和渲染。在架构上是平级的,相比UIkit更接近底层。

CALayer 和 UIView区别

实际上你所看到的视图内容,包括图形等,都是由UIView的一个实例图层属性来绘制和渲染的,那就是CALayer。

CALayer类的概念与UIView非常类似,它也具有树形的层级关系,并且可以包含图片文本、背景色等。它与UIView最大的不同在于它不能响应用户交互,可以说它根本就不知道响应链的存在,它的API虽然提供了“某点是否在图层范围内的方法”,但是它并不具有响应的能力。

在每一个UIView实例当中,都有一个默认的支持图层,UIView负责创建并且管理这个图层。实际上这个CALayer图层才是真正用来在屏幕上显示的,UIView仅仅是对它的一层封装,实现了CALayer的delegate,提供了处理事件交互的具体功能,还有动画底层方法的高级API。可以说CALayer是UIView的内部实现细节。


1.CAShapeLayer +UIBezierPath

-(void)drawMyLayer{

    CGSize size=[UIScreen mainScreen].bounds.size;

    CGFloatWIDTH =20.0;

    CALayer*layer;

    CAShapeLayer* brownRectLayer = [CAShapeLayer layer];

    brownRectLayer.frame=CGRectMake(0,0,100,100);

    UIBezierPath * path = [UIBezierPath bezierPathWithRect:CGRectMake(0, 0,100, 100)];

    brownRectLayer.path= path.CGPath;

    brownRectLayer.fillColor= [UIColorbrownColor].CGColor;

    [self.view.layeraddSublayer:brownRectLayer];

}

效果:

UIGraphicsBeginImageContextWithOptions使用图片上下文

context:图形上下文,可以通过UIGraphicsGetCurrentContext:获取当前视图的上下文

imageContext:图片上下文,可以通过UIGraphicsBeginImageContextWithOptions:获取一个图片上下文,然后绘制完成后,调用UIGraphicsGetImageFromCurrentImageContext获取绘制的图片,最后要记得关闭图片上下文UIGraphicsEndImageContext。

//图片合并

-(UIImage*)createLabel{

    //开启图形上下文

    NSString*text =@"123456";

    UIImage*image = [UIImageimageNamed:@"icon_60pt"];

    UIGraphicsBeginImageContextWithOptions(image.size, NO,1.0);

    //将图片绘制到

    [imagedrawInRect:CGRectMake(0,0,image.size.width, image.size.height)];

    NSDictionary*attr =@{

                           NSFontAttributeName: [UIFontboldSystemFontOfSize:20],  //设置字体                                   NSForegroundColorAttributeName: [UIColorredColor]      //设置字体颜色                       

    };

    [textdrawAtPoint:CGPointMake(20, 20) withAttributes:attr];

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();

    returnnewImage;

}


单纯使用CaLayer

 //获得根图层

    layer=[[CALayeralloc]init];

    //设置背景颜色,由于QuartzCore是跨平台框架,无法直接使用UIColor

    layer.backgroundColor=[UIColor colorWithRed:0 green:146/255.0 blue:1.0 alpha:1.0].CGColor;

    //设置中心点

    layer.position=CGPointMake(size.width/2, size.height/2);

    //设置大小

    layer.bounds=CGRectMake(0,0, WIDTH,WIDTH);

    //设置圆角,当圆角半径等于矩形的一半时看起来就是一个圆形

    layer.cornerRadius=WIDTH/2;

    //设置阴影

    layer.shadowColor=[UIColor grayColor].CGColor;

    layer.shadowOffset=CGSizeMake(2,2);

    layer.shadowOpacity=.9;

    //设置边框

    //    layer.borderColor=[UIColor whiteColor].CGColor;

    //    layer.borderWidth=1;

    //设置锚点

    //    layer.anchorPoint=CGPointZero;

    [self.view.layeraddSublayer:layer];



CGContextRef

- (void)drawRect:(CGRect)rect {

    //获取图形上下文


    CGContextRef ctx = UIGraphicsGetCurrentContext();

    CGContextSetStrokeColorWithColor(ctx,[UIColor redColor].CGColor);

    CGContextSetLineWidth(ctx,2.0);

    CGContextMoveToPoint(ctx,80,30);

    CGContextAddLineToPoint(ctx,80,150);

    CGContextStrokePath(ctx);


    CGContextSetStrokeColorWithColor(ctx, [UIColor blueColor].CGColor);

    CGContextMoveToPoint(ctx,100,30);

    CGContextAddLineToPoint(ctx,100,100);

    CGContextStrokePath(ctx);


    CGContextMoveToPoint(ctx,120,30);

    CGContextAddLineToPoint(ctx,120,100);

    CGContextStrokePath(ctx);


    CGContextMoveToPoint(ctx,150,30);

    CGContextAddLineToPoint(ctx,190,30);

    CGContextStrokePath(ctx);


    //CGContextAddRect(ctx, CGRectMake(0,0,100,100));


    CGContextFillRect(ctx, CGRectMake(0,0,1000,1000));

    CGContextSetStrokeColorWithColor(ctx,[UIColor redColor].CGColor);;

    CGContextStrokePath(ctx);


    /*

    [[UIColor orangeColor] set];

    UIBezierPath *path = [UIBezierPath bezierPath];

    path.lineWidth = 2.0;

    [path moveToPoint:CGPointMake(80,100)];

    [path  addLineToPoint:CGPointMake(80,150)];

    [path stroke];


    UIBezierPath *cirlePaht = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(80-10,150,20,20)];

    [[UIColor grayColor]set];

    cirlePaht.lineWidth = 5/3;

    [cirlePaht stroke];

    [cirlePaht fill];


    UIBezierPath *paths = [UIBezierPath bezierPath];

    paths.lineWidth = 2.0;

    [paths moveToPoint:CGPointMake(80,170)];

    [paths  addLineToPoint:CGPointMake(80,200)];

    [paths stroke];

    */

}


单纯UIBezierPath

- (void)drawRect:(CGRect)rect {

    //获取图形上下文

    /*

    CGContextRef ctx = UIGraphicsGetCurrentContext();

    CGContextSetStrokeColorWithColor(ctx,[UIColor redColor].CGColor);

    CGContextSetLineWidth(ctx,2.0);

    CGContextMoveToPoint(ctx,80,30);

    CGContextAddLineToPoint(ctx,80,150);

    CGContextStrokePath(ctx);


    CGContextSetStrokeColorWithColor(ctx, [UIColor blueColor].CGColor);

    CGContextMoveToPoint(ctx,100,30);

    CGContextAddLineToPoint(ctx,100,100);

    CGContextStrokePath(ctx);


    CGContextMoveToPoint(ctx,120,30);

    CGContextAddLineToPoint(ctx,120,100);

    CGContextStrokePath(ctx);


    CGContextMoveToPoint(ctx,150,30);

    CGContextAddLineToPoint(ctx,190,30);

    CGContextStrokePath(ctx);


    //CGContextAddRect(ctx, CGRectMake(0,0,100,100));


    CGContextFillRect(ctx, CGRectMake(0,0,100,100));

    CGContextSetStrokeColorWithColor(ctx,[UIColor redColor].CGColor);;

    CGContextStrokePath(ctx);

    */


    [[UIColor orangeColor] set];

    UIBezierPath *path = [UIBezierPath bezierPath];

    path.lineWidth=2.0;

    [pathmoveToPoint:CGPointMake(80,100)];

    [path  addLineToPoint:CGPointMake(80,150)];

    [pathstroke];


    UIBezierPath *cirlePaht = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(80-10,150,20,20)];

    [[UIColor grayColor]set];

    cirlePaht.lineWidth=5/3;

    [cirlePahtstroke];

    [cirlePahtfill];


    UIBezierPath *paths = [UIBezierPath bezierPath];

    paths.lineWidth=2.0;

    [pathsmoveToPoint:CGPointMake(80,170)];

    [paths  addLineToPoint:CGPointMake(80,200)];

    [pathsstroke];

}


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,524评论 5 460
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,869评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,813评论 0 320
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,210评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,085评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,117评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,533评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,219评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,487评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,582评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,362评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,218评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,589评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,899评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,176评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,503评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,707评论 2 335