OC-绘制图形的一些简单练习

在UIView中,所有的绘制界面操作,都必须在drawRect:方法中进行操作.

- (void)drawRect:(CGRect)rect {
    
    
//    [self drawLine];
//    [self drawLine2];
//    [self drawRectangle];
//    [self drawCircle];
//    [self drawCurve];
//    [self drawImage];
//    [self drawText];
    
    
  }

绘制直线

第一种方法

- (void)drawLine {
    
    //1 获取当前的绘制图形上下文
    CGContextRef context = UIGraphicsGetCurrentContext();
    //2 创建并且设置路径  可变路径
    CGMutablePathRef path = CGPathCreateMutable();
    //设置路径上的点
    //路径的起始点
    //path 需要添加起始点的可变路径
    //transform 坐标系变化
    CGPathMoveToPoint(path, NULL, 50, 50);
    
    //向路径中添加点
    CGPathAddLineToPoint(path, NULL, 100, 100);
    CGPathAddLineToPoint(path, NULL, 200, 100);
    CGPathAddLineToPoint(path, NULL, 100, 200);
    CGPathAddLineToPoint(path, NULL, 150, 50);
    CGPathAddLineToPoint(path, NULL, 50, 150);
    
    //封闭路径 将路径的终点和起始点链接
    CGPathCloseSubpath(path);

    //3 设置绘制属性 （线条颜色，线条粗细）
    //设置线段颜色
    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
    
    //设置图形的填充颜色
    CGContextSetFillColorWithColor(context, [UIColor greenColor].CGColor);
    
    //设置线条宽度
    CGContextSetLineWidth(context, 5);
    
    //设置线段连接点的样式
    CGContextSetLineJoin(context, kCGLineJoinRound);
    
    //4 绘制路径
    //将创建好的路径 添加到上下文中
    CGContextAddPath(context, path);
    //在图形上下文中绘制已添加路径
    //mode 绘制模式
    CGContextDrawPath(context, kCGPathFillStroke);
    

    //在CG框架中 所有使用到了create函数创建的变量，都需要手动销毁
    CGPathRelease(path);
    
}

一开始用的时候感觉这些方法挺难记的,因为是C语言的一套接口,在OC里面也不好直接查看方法.后来发现context的方法基本都是CGContext开头的,path的方法都是CGPath开头的...

第二种方法

- (void)drawLine2 {
    
    //第二种绘制线段的方法， 不需要使用路径
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    //创建多个点 并且放入到数组中
    CGPoint point1 = CGPointMake(100, 100);
    CGPoint point2 = CGPointMake(150, 150);
    CGPoint point3 = CGPointMake(200, 150);
    CGPoint point4 = CGPointMake(150, 100);
    CGPoint point5 = CGPointMake(200, 100);
    CGPoint points[5] = {point1, point2, point3, point4, point5};
    
    //向上下文中添加线段
    CGContextAddLines(context, points, 5);
    
    CGContextSetLineWidth(context, 3);
    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
    //设置填充颜色 在UIKit框架中，对某些功能进行了简单封装
    //直接调用UIKit中的接口也能够完成一部分的绘制操作
    [[UIColor yellowColor] setFill];
    
    CGContextDrawPath(context, kCGPathEOFillStroke);
    
}

绘制矩形

- (void)drawRectangle {
    
    //创建一个矩形区域
    CGRect rect = CGRectMake(50, 50, 100, 50);
    
    //将rect添加到图形上下文中
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextAddRect(context, rect);
    
    //设定颜色
    [[UIColor redColor] setFill];
    [[UIColor yellowColor] setStroke];
    CGContextSetLineWidth(context, 3);
    
    CGContextDrawPath(context, kCGPathFillStroke);
    
}

绘制圆形

- (void)drawCircle {
    
    //获取当前的上下文
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    //添加一个圆形路径倒上下文中
    
    /**
     *  context  图形上下文
     *  x,y 圆心坐标点
     *  radius 半径
     *  angle 开始和结束的角度  0度在x轴正方向，角度沿顺时针方向增大
     *  clockwise 画的方向 0表示顺时针画圆，1表示逆时针画
     */
    CGContextAddArc(context, 100, 100, 50, 0, M_PI_2, 0);
    
    [[UIColor orangeColor] setStroke];
    [[UIColor purpleColor] setFill];
    CGContextSetLineWidth(context, 5);
    
    //绘制线条
    CGContextDrawPath(context, kCGPathFillStroke);
    
}

这里说明一下,CGContextAddArc这个函数到底是怎么画圆形的好像比较难理解,这里说说我的理解.X的正方向是0度,然后角度沿着顺时针变大.在上面的例子中CGContextAddArc(context, 100, 100, 50, 0, M_PI_2, 0),起始角度是0°也就是x正轴方向,然后结束角度是M_PI_2,也就是90°的位置,图形是起始位置向结束位置画的,clockwise是0也就是逆时针,所以最后画出来的图形是一个90的圆弧

绘制曲线

- (void)drawCurve {
    
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    //设定曲线的起点
    CGContextMoveToPoint(context, 200, 100);
    //添加一条曲线到上下文
//    CGContextAddQuadCurveToPoint(context, 200, 500, 300, 100);
//    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
//    //绘制线条
//    CGContextDrawPath(context, kCGPathStroke);
//    
    
    //绘制贝赛尔曲线
    CGContextAddCurveToPoint(context, 100, 300, 300, 100, 200, 500);
    
    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
    CGContextDrawPath(context, kCGPathStroke);
    
}

绘制图形

- (void)drawImage {
    //读取图片
    UIImage *image = [UIImage imageNamed:@"001"];
    //方式一
    //将图片绘制到某一个位置，图片的大小不变
    [image drawAtPoint:CGPointMake(100, 100)];
    
    //方式二
    [image drawInRect:CGRectMake(100, 200, 200, 200) blendMode:kCGBlendModeDifference alpha:1];
}

绘制文本

- (void)drawText {
    //创建字符串对象
    NSString *text = @"Hello World !";
    
    /*
     文字颜色
     字体以及大小
     */
    UIFont *textFont = [UIFont boldSystemFontOfSize:18];
    UIColor *textColor = [UIColor greenColor];
    //构建参数字典
    NSDictionary *attr = @{NSFontAttributeName : textFont,
                           NSForegroundColorAttributeName : textColor};
    
    //绘制文字
    [text drawInRect:CGRectMake(100, 100, 200, 100) withAttributes:attr];
}