iOS开发之基本图形绘制

一、画直线

第一种方式:

- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    //获取图形上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    //创建并描述路径
    CGMutablePathRef path = CGPathCreateMutable();
    
    //设置起点
    CGPathMoveToPoint(path, NULL, 50, 100);
    
    //添加一条线到某个点
    CGPathAddLineToPoint(path, NULL, 200, 137);
    
    //把路径添加到上下文
    CGContextAddPath(ctx, path);
    
    //渲染上下文
    CGContextStrokePath(ctx);
    
}

第二种方式:

//这种方式实际上是系统已经创建了路径并且已经在上下文了,就省去了自己去创建路径和添加到上下文这两个步骤
- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    //获取图形上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
      //设置起点
    CGContextMoveToPoint(ctx, 29, 199);
    
    //添加一条线到某个点
    CGContextAddLineToPoint(ctx, 261, 88);
    
    //渲染上下文
    CGContextStrokePath(ctx);
    
}

第三种方式:

//用UIKit封装的绘图功能完成
- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    //贝塞尔路径
    //创建路径
    UIBezierPath *path = [UIBezierPath bezierPath];
    
    //设置起点
    [path moveToPoint:CGPointMake(49, 12)];
    
    //添加一条线到某个点
    [path addLineToPoint: CGPointMake(111, 22)];
    
    //渲染
    [path stroke];
    
}


二、画曲线

- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    //绘制曲线
    
    //创建上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    //设置起点
    CGContextMoveToPoint(ctx, 50, 150);
    
    //控制点
    CGContextAddQuadCurveToPoint(ctx, 100, 20, 150, 150);
    
    //渲染
    CGContextStrokePath(ctx);
    
}


三、画图形

- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    //圆角矩形
//    UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 20, 100, 100) byRoundingCorners:UIRectCornerAllCorners cornerRadii:CGSizeMake(10, 10)];
    
    //圆弧
    //参数1:圆心   参数2:半径  参数3:起点角度  参数4:终点角度   参数5:YES表示顺时针NO表示逆时针
//    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(50, 50) radius:30 startAngle:0 endAngle:M_PI clockwise:NO];
    
    //画扇形
    //起点
    CGPoint center = CGPointMake(90, 60);
    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:130 startAngle:0 endAngle:M_SQRT2 clockwise:YES];
    
    [path addLineToPoint:center];
    
    //[path closePath];
    
    //渲染
    //[path stroke];
    [path fill];

}


四、画饼图

- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    //半径
    CGFloat radius = rect.size.width * 0.5;
    
    //圆心
    CGPoint center = CGPointMake(radius, radius);
    
    CGFloat startA = 0;
    CGFloat angle = 0;
    CGFloat endA = 0;
    
    NSArray *arr = [self arrRandom];
    
    for (int i = 0; i < arr.count; i++) {
        startA = endA;
        angle = [arr[i]doubleValue] / 100.0 * M_PI * 2;
        endA = startA + angle;
        //画圆弧
        UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:startA endAngle:endA clockwise:YES];
        
        //添加一根线到圆心
        [path addLineToPoint:center];
        
        //描边填充
        [[self colorRandom]set];
        [path fill];
    }
    
}

- (NSArray *)arrRandom {
    
    int total = 100;
    NSMutableArray *arrM = [NSMutableArray array];
    
    int temp = 0;
    for (int i = 0; i < arc4random_uniform(6) + 1; i++) {
        temp = arc4random_uniform(total) + 1;
        [arrM addObject:@(temp)];
        total -= temp;
    }
    if (total) {
        [arrM addObject:@(total)];
    }
    return arrM;
    
}

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    //重绘
    [self setNeedsDisplay];
    
}

- (UIColor *)colorRandom {
    
    CGFloat r = arc4random_uniform(256) / 255.0;
    CGFloat g = arc4random_uniform(256) / 255.0;
    CGFloat b = arc4random_uniform(256) / 255.0;
    return [UIColor colorWithRed:r green:g blue:b alpha:1];
    
}


五、画柱状图

- (void)drawRect:(CGRect)rect {
     //Drawing code
    
    NSArray *arr = [self arrRandom];
    
    CGFloat w = 0;
    CGFloat x = 0;
    CGFloat h = 0;
    CGFloat y = 0;
    
    for (int i = 0; i < arr.count; i++) {
        w = rect.size.width / (2 * arr.count - 1);
        x = 2 * i * w;
        h = [arr[i]floatValue] / 100.0 * rect.size.height;
        y = rect.size.height - h;
        
        UIBezierPath *path = [UIBezierPath bezierPathWithRect:CGRectMake(x, y, w, h)];
        
        [[self colorRandom]set];
        
        [path fill];
    }
    
}

- (NSArray *)arrRandom {
    
    int total = 100;
    NSMutableArray *arrM = [NSMutableArray array];
    
    int temp = 0;
    for (int i = 0; i < arc4random_uniform(6) + 1; i++) {
        temp = arc4random_uniform(total) + 1;
        [arrM addObject:@(temp)];
        
        if (temp == total) {
            break;
        }
        
        total -= temp;
    }
    if (total) {
        [arrM addObject:@(total)];
    }
    return arrM;
    
}

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    
    [self setNeedsDisplay];
    
}

- (UIColor *)colorRandom {
    
    CGFloat r = arc4random_uniform(256) / 255.0;
    CGFloat g = arc4random_uniform(256) / 255.0;
    CGFloat b = arc4random_uniform(256) / 255.0;
    return [UIColor colorWithRed:r green:g blue:b alpha:1];
    
}


六、绘制文字

- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    NSString *str = @"你好";
    
    NSMutableDictionary *textDict = [NSMutableDictionary dictionary];
    
    //设置文字颜色
    textDict[NSForegroundColorAttributeName] = [UIColor orangeColor];
    
    //设置字体大小
    textDict[NSFontAttributeName] = [UIFont systemFontOfSize:50];
    
    //设置文字的空心颜色和宽度
    textDict[NSStrokeColorAttributeName] = [UIColor yellowColor];
    textDict[NSStrokeWidthAttributeName] = @10;
    
    //设置文字阴影
    NSShadow *shadow = [[NSShadow alloc]init];
    shadow.shadowColor = [UIColor redColor];
    shadow.shadowOffset = CGSizeMake(10, 10);
    shadow.shadowBlurRadius = 3;
    textDict[NSShadowAttributeName] = shadow;
    
    //不能换行
    //[str drawAtPoint:CGPointZero withAttributes:textDict];
    
    //可以换行
    [str drawInRect:rect withAttributes:textDict];
    
}


七、绘制图片

    //裁剪
    UIRectClip(CGRectMake(50, 50, 50, 50));
    
    //绘制内容的尺寸默认和图片尺寸一样大
    [image drawInRect:rect];
    
    //平铺
    [image drawAsPatternInRect:rect];


转载于:https://my.oschina.net/shenhuniurou/blog/652030

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值