UIView-绘制相关

一、获取当前绘制上下文

//获取绘图上下文只有在drawRect:方法中获取有效
CGContextRef ctx = UIGraphicsGetCurrentContext();

//设置每次清空上一次绘制的内容(initWithFrame方法中做)
self.clearsContextBeforeDrawing = YES;


二、相关属性设置

//设置线宽    
CGContextSetLineWidth(ctx, 16);
//设置线条颜色
CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);
//设置线条颜色
CGContextSetStrokeColorWithColor(ctx, [UIColor blueColor].CGColor);
//设置填充颜色
CGContextSetFillColorWithColor(ctx, [UIColor redColor].CGColor);

//设置线段的端点形状:方形端点
CGContextSetLineCap(ctx, kCGLineCapSquare);
//设置点线模式:实现宽6,间距10
CGContextSetLineDash(ctx, 0, patterns1, 2);
//取消设置点线模式
CGContextSetLineDash(ctx, 0, 0, 0);
//设置线条连接点的形状
CGContextSetLineJoin(ctx, kCGLineJoinRound);

//设置字符间距
CGContextSetCharacterSpacing(ctx, 4);
//设置文本绘制模式-填充模式
CGContextSetTextDrawingMode(ctx, kCGTextFill);
 //设置绘制文本的字体和大小
CGContextSelectFont(ctx, "Courier New", 40, kCGEncodingMacRoman);

//使用默认的阴影颜色,阴影向左上投影,模糊度为5
CGContextSetShadow(ctx, CGSizeMake(8, -6), 5);
//使用指定的阴影颜色,阴影向右下角投影,模糊度为20
CGContextSetShadowWithColor(ctx, CGSizeMake(10, 8), 20, [UIColor redColor].CGColor);

三、绘制操作

//绘制线段(默认不绘制端点)
CGContextStrokeLineSegments(ctx, points1, 3);

//绘制一个矩形边框
CGContextStrokeRect(ctx, CGRectMake(30, 230, 120, 60));
//绘制一个椭圆
CGContextStrokeEllipseInRect(ctx, CGRectMake(30, 380, 120, 60));
//填充一个矩形
 CGContextFillRect(ctx, CGRectMake(30, 120, 120, 60));

//对CGContextRef 绘制文字时应用变换
//void CGContextSetTextMatrix(CGContextRef cg_nullable c, CGAffineTransform t)
 CGContextSetTextMatrix(ctx, rotate);
//绘制文本
 CGContextShowTextAtPoint(ctx, 50, 300, "crazyit.org", 11);

四、路径

-(void)drawRect:(CGRect)rect{
#if 1
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    for (int i = 0; i<10; i++) {
        CGContextBeginPath(ctx);//开始定义路径
        //添加一段圆弧,最后一个参数1代表逆时针,0代表顺时针
        
        /**
         画弧度

         @param ctx 绘图上下文
         @param 参数2 圆心参数
         @param 参数3 圆心参数
         @param 参数4 开始角度
         @param 参数5 结束角度
         @param 参数6 0代表顺时针,1代表逆时针
         */
        CGContextAddArc(ctx, i*25, i*25, (i+1)*8, M_PI*1.5, M_PI, 0);
        CGContextClosePath(ctx);//关闭路径
        CGContextSetRGBFillColor(ctx, 1, 0, 1, (10-1)*0.1);//设置填充颜色
        CGContextFillPath(ctx);//填充当前路径
    }
    
#elif 0
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    //开始添加路径
    CGContextBeginPath(ctx);
    //添加一个五角星的路径
    CGContextAddStar(ctx, 5, 80, 150, 40);
    //添加一个圆角矩形的路径
    CGContextAddRoundRect(ctx, 10, 30, 150, 70, 14);
    //关闭路径
    CGContextClosePath(ctx);
    //设置线条颜色
    CGContextSetRGBStrokeColor(ctx, 1, 1, 0, 1);
    //设置线宽
    CGContextSetLineWidth(ctx, 4);
    //绘制路径
    CGContextStrokePath(ctx);
    
    
    //开始添加路径
    CGContextBeginPath(ctx);
    //添加一个五角星的路径
    CGContextAddStar(ctx, 5, 240, 150, 40);
    //添加一个圆角矩形的路径
    CGContextAddRoundRect(ctx, 170, 30, 130, 70, 14);
    //关闭路径
    CGContextClosePath(ctx);
    //设置填充颜色
    CGContextSetRGBFillColor(ctx, 1, 0, 1, 1);
    //采用填充并绘制路径的方式来绘制路径
    CGContextDrawPath(ctx, kCGPathFillStroke);
    
    
    //开始添加路径
    CGContextBeginPath(ctx);
    //添加一个三角星的路径
    CGContextAddStar(ctx, 3, 60, 220, 40);
    //关闭路径
    CGContextClosePath(ctx);
    //设置填充颜色
    CGContextSetRGBFillColor(ctx, 1, 0, 0, 1);
    //填充路径
    CGContextFillPath(ctx);
    
    
    //开始添加路径
    CGContextBeginPath(ctx);
    //添加一个七角星的路径
    CGContextAddStar(ctx, 7, 160, 220, 40);
    //关闭路径
    CGContextClosePath(ctx);
    //设置填充颜色
    CGContextSetRGBFillColor(ctx, 0, 1, 0, 1);
    //填充路径
    CGContextFillPath(ctx);
    
    
    //开始添加路径
    CGContextBeginPath(ctx);
    //添加一个九角星的路径
    CGContextAddStar(ctx, 9, 260, 220, 40);
    //关闭路径
    CGContextClosePath(ctx);
    //设置填充颜色
    CGContextSetRGBFillColor(ctx, 0, 0, 1, 1);
    //填充路径
    CGContextFillPath(ctx);
    
#elif 0
    //获取绘图上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    //开始添加路径
    CGContextBeginPath(ctx);
    //添加5花瓣路径
    CGContextAddFlower(ctx, 5, 50, 100, 30, 80);
    //设置填充颜色
    CGContextSetRGBFillColor(ctx, 1, 0, 0, 1);
    //填充路径
    CGContextFillPath(ctx);
    
    //添加6花瓣路径
    CGContextAddFlower(ctx, 6, 160, 100, 30, 80);
    //设置填充颜色
    CGContextSetRGBFillColor(ctx, 1, 1, 0, 1);
    //填充路径
    CGContextFillPath(ctx);

    
    //添加7花瓣路径
    CGContextAddFlower(ctx, 7, 270, 100, 30, 80);
    //设置填充颜色
    CGContextSetRGBFillColor(ctx, 1, 0, 1, 1);
    //填充路径
    CGContextFillPath(ctx);

    //关闭路径
    CGContextClosePath(ctx);

    /***************************************************************************\
     *  PS:重要说明
     *  注意到上面的程序并未在每次添加花朵路径后立即关闭
     *  这也是被允许的,而且每次填充路径时并不会再次填充前一次已经填充过的路径。
     *  这是因为只用程序绘制了CGContexRef当前所包含的路径
     *  系统会自动清除已经绘制的路径
     *
     \************************************************************************/
#endif
    
}


/**
 该方法负责绘制圆角矩形。

 @param c 绘图上下文
 @param x1 左上角x
 @param y1 左上角y
 @param width 圆角矩形的宽
 @param height 圆角矩形的高
 @param radius 圆角半径
 */
void CGContextAddRoundRect(CGContextRef c,CGFloat x1,CGFloat y1,CGFloat width,CGFloat height,CGFloat radius){
    //移动到左上角
    CGContextMoveToPoint(c, x1+radius, y1);
    //添加一条连接到右上角的线段
    CGContextAddLineToPoint(c, x1+width-radius, y1);
    //添加一段圆弧
    CGContextAddArcToPoint(c, x1+width, y1, x1+width, y1+radius, radius);
    //添加一条连接到右下角的线段
    CGContextAddLineToPoint(c, x1+width, y1+height-radius);
    //添加一段圆弧
    CGContextAddArcToPoint(c, x1+width, y1+height, x1+width-radius, y1+height, radius);

    //添加一条连接到左下角的线段
    CGContextAddLineToPoint(c, x1+radius, y1+height);
    //添加一段圆弧
    CGContextAddArcToPoint(c, x1, y1+height, x1, y1+height-radius, radius);
    
    //添加一条连接到左上角的线段
    CGContextAddLineToPoint(c, x1, y1+radius);
    //添加一段圆弧
    CGContextAddArcToPoint(c, x1, y1, x1+radius, y1, radius);
}


/**
 该方法负责绘制多角星

 @param c 绘制上下文
 @param n 该参数通常应为奇数,控制绘制N角星
 @param dx 中心x
 @param dy 中心y
 @param size 控制N角星的大小
 */
void CGContextAddStar(CGContextRef c,NSInteger n,CGFloat dx,CGFloat dy,NSInteger size){
    CGFloat dig = 4*M_PI/n;
    CGContextMoveToPoint(c, dx, dy+size);//移动到指定地点
    for (int i = 1; i<=n; i++) {
        CGFloat x = sin(i*dig);
        CGFloat y = cos(i*dig);
        //绘制当前点连接到指定点的线条
        CGContextAddLineToPoint(c, x*size + dx, y*size+dy);
    }
}



/**
 该方法负责绘制花朵

 @param c 绘图上下文
 @param n 花瓣数
 @param dx 花朵位置x
 @param dy 花朵位置y
 @param size 控制花朵大小
 @param length 控制花瓣长度
 */
void CGContextAddFlower(CGContextRef c,NSInteger n,CGFloat dx,CGFloat dy,CGFloat size,CGFloat length){
    //移动到指定地点(二次曲线的起始点)
    CGContextMoveToPoint(c, dx, dy+size);
    CGFloat dig = 2*M_PI/n;
    //采用循环添加n段二次曲线路径
    for (int i = 1; i<n+1; i++) {
        //计算控制点的坐标
        CGFloat ctrlX = sin((i-0.5)*dig)*length+dx;
        CGFloat ctrly = cos((i-0.5)*dig)*length+dy;
        //计算结束点的坐标
        CGFloat x = sin(i*dig)*size+dx;
        CGFloat y = cos(i*dig)*size+dy;
        //添加二次曲线(二次曲线由 起始点 控制点 结束点 )
        CGContextAddQuadCurveToPoint(c, ctrlX, ctrly, x, y);
    }
}

五、将绘图转为UIImage并存储到本地

-(UIImage*)drawImage:(CGSize)size{
    //创建内存中的图片(绘制环境)
    UIGraphicsBeginImageContext(size);
    //获取绘图上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    //设置线宽
    CGContextSetLineWidth(ctx, 8);
    
    //----------下面开始向内存中绘制图形----------
    //设置线条颜色
    CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);
    //绘制一个矩形边框
    CGContextStrokeRect(ctx, CGRectMake(30, 30, 120, 60));
    //设置线条颜色
    CGContextSetRGBFillColor(ctx, 1, 1, 0, 1);
    //绘制一个矩形边框
    CGContextStrokeRect(ctx, CGRectMake(180, 30, 120, 60));
    //设置线条颜色
    CGContextSetRGBFillColor(ctx, 0, 1, 1, 1);
    
    //绘制一个椭圆
    CGContextStrokeEllipseInRect(ctx, CGRectMake(30, 120, 120, 60));
    
    //设置填充颜色
    CGContextSetRGBFillColor(ctx, 1, 0, 1, 1);
    CGContextFillEllipseInRect(ctx, CGRectMake(180, 120, 120, 60));

    //获取该绘图Context中的图片
    UIImage * newImage = UIGraphicsGetImageFromCurrentImageContext();
    //----------结束绘图----------
    UIGraphicsEndImageContext();
    
    //获取当前应用路径中Documents 目录下的指定文件名对应的文件路径
    NSString * path = [[NSHomeDirectory()
                        stringByAppendingPathComponent:@"Documents"]
                        stringByAppendingPathComponent:@"newPng.png"];
    //保存png图片
    [UIImagePNGRepresentation(newImage) writeToFile:path atomically:YES];

    return newImage;
}






  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值