CC论坛

 找回密码
 立即注册
查看: 734|回复: 0

[iOS] 绘图(CoreGraphics)

[复制链接]

56

主题

57

帖子

339

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
339
发表于 2020-2-18 22:22:32 | 显示全部楼层 |阅读模式
绘图操作必须在 - (void)drawRect:\(CGRect)rect 函数进行,即要重写父类的此方法。
本文绘图内容:
  • 线条/虚线
  • 长方形/正方形
  • 椭圆/圆
  • 三角形
  • 五角星

Objective-C 版本

  1. [list][*](void)drawRect:(CGRect)rect {[/list]
  2.    
  3.     // 获取绘图上下文
  4.     CGContextRef context = UIGraphicsGetCurrentContext();
  5.     if (!context) {
  6.         
  7.         NSLog(@"获取绘图context失败");
  8.         return;
  9.     }
  10.    
  11.     /** ==== 对context进行基本设置 */
  12.     CGContextSetLineWidth(context, 2);  // 数值越大,绘出来的路径越大
  13.     CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor); // 路径颜色
  14.     CGContextSetLineCap(context, kCGLineCapRound);   // 路径起点/终点处显示风格
  15.     CGContextSetLineJoin(context, kCGLineJoinRound); // 路径连接(拐弯)处显示风格
  16.     // 画一条直线
  17.     CGContextMoveToPoint(context, 50, 40);
  18.     CGContextAddLineToPoint(context, 250, 40);
  19.     CGContextStrokePath(context); // 输出到屏幕上
  20.    
  21.     // 画一个正方形/长方形,并输出到屏幕上
  22.     CGContextStrokeRect(context, CGRectMake(50, 50, 100, 50));   // 长方形
  23.     CGContextStrokeRect(context, CGRectMake(200, 50, 100, 100)); // 正方形
  24.    
  25.     // 画一个椭圆/圆形,并输出到屏幕上
  26.     CGContextStrokeEllipseInRect(context, CGRectMake(50, 160, 100, 50)); // 椭圆
  27.     CGContextStrokeEllipseInRect(context, CGRectMake(220, 160, 100, 100)); // 圆
  28.    
  29.     // 画一个三角形
  30.     CGPoint points[4];
  31.     points[0] = CGPointMake(40, 300);
  32.     points[1] = CGPointMake(80, 220);
  33.     points[2] = CGPointMake(120, 300);
  34.     points[3] = CGPointMake(40, 300);
  35.    
  36.     CGContextAddLines(context, points, 4);
  37.     CGContextStrokePath(context); // 输出到屏幕上
  38.    
  39.     // 画一条虚线
  40.     CGFloat lengths[] = {5, 10};
  41.     CGContextSetLineDash(context, 0, lengths, 2);
  42.     CGContextMoveToPoint(context, 50, 320);
  43.     CGContextAddLineToPoint(context, 250, 320);
  44.     CGContextStrokePath(context); // 输出到屏幕上
  45.    
  46.     // 画个五角星(需要到圆、三角函数的知识,忘记数学知识的话,先去温习一下)
  47.     CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
  48.     CGPoint centerPoint=CGPointMake(160, 430);  // 确定中心点
  49.     CGFloat radius=50.0;                        // 确定半径
  50.     CGPoint point1=CGPointMake(centerPoint.x, centerPoint.y-radius); // 五角星到顶点
  51.     CGContextMoveToPoint(context, point1.x, point1.y);
  52.    
  53.     //五角星每个点之间点夹角,采用弧度计算。每两个点进行连线就可以画出五角星
  54.     //点与点之间点夹角为2*M_PI/5.0,
  55.     CGFloat angle=4*M_PI/5.0;
  56.     for (int i=1; i<=5; i++) {
  57.         
  58.         CGFloat x=centerPoint.x-sinf(i*angle)*radius;
  59.         CGFloat y=centerPoint.y-cosf(i*angle)*radius;
  60.         CGContextAddLineToPoint(context, x, y);
  61.     }
  62.    
  63.     // 输出到屏幕上
  64.     CGContextDrawPath(context, kCGPathFill);        // 只填充
  65.     //CGContextDrawPath(context, kCGPathEOFill);    // 只填充(但闭合路径重叠的地方除外)
  66.     //CGContextDrawPath(context, kCGPathStroke);    // 只显示路径
  67.     //CGContextDrawPath(context, kCGPathFillStroke);// 填充并显示路径
  68.     //CGContextDrawPath(context, kCGPathEOFillStroke);// 填充(但闭合路径重叠的地方除外)并显示路径
  69. }
复制代码

Swift 版本

  1. comeing soon
复制代码

效果图

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|粤ICP备19105948号|CC论坛

GMT+8, 2022-12-4 20:54

快速回复 返回顶部 返回列表