Quartz 2D学习笔记--基础篇

4 篇文章 0 订阅
2 篇文章 0 订阅

画一条线:

- (void)drawLine
{
    // 1.获取上下文
    // CGContextRef CG CoreGraphics Ref 引用
    // 目前学的上下文都跟UIGraphics有关,以后想直接获取上下文,直接敲一个UIGraphics
    CGContextRef ctx = UIGraphicsGetCurrentContext();

    // 2.设置绘图信息(拼接路径)
    UIBezierPath *path = [UIBezierPath bezierPath];

    // 设置起点
    [path moveToPoint:CGPointMake(10, 10)];

    // 添加一条线到某个点
    [path addLineToPoint:CGPointMake(125, 125)];
    [path addLineToPoint:CGPointMake(240, 10)];
    // 3.把路径添加到上下文
    // 直接把UIKit的路径转换成CoreGraphics,CG开头就能转
    CGContextAddPath(ctx, path.CGPath);

    // 4.把上下文渲染到视图
    // Stroke描边
    CGContextStrokePath(ctx);
}

画两条线:

- (void)draw2Line
{
    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();

    // 2.拼接路径
    UIBezierPath *path = [UIBezierPath bezierPath];

    // 设置起点
    [path moveToPoint:CGPointMake(10, 125)];

    // 添加一条线到某个点
    [path addLineToPoint:CGPointMake(230, 125)];

    UIBezierPath *path1 = [UIBezierPath bezierPath];

    [path1 moveToPoint:CGPointMake(10, 10)];

    [path1 addLineToPoint:CGPointMake(125, 100)];


    // 3.把路径添加到上下文
    CGContextAddPath(ctx, path.CGPath);
    CGContextAddPath(ctx, path1.CGPath);

    // 设置绘图状态
    // 设置线宽
    CGContextSetLineWidth(ctx, 10);
    CGContextSetLineCap(ctx, kCGLineCapRound);
    //    CGContextSetRGBStrokeColor(ctx, 1, 0, 0, 1);
    [[UIColor redColor] set];

    // 4.渲染上下文到视图
    CGContextStrokePath(ctx);
}

画一条曲线:

- (void)drawCurve
{
    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();

    // 2.拼接路径
    UIBezierPath *path = [UIBezierPath bezierPath];

    CGPoint startP = CGPointMake(10, 125);
    CGPoint endP = CGPointMake(240, 125);
    CGPoint controlP = CGPointMake(125, 0);
    [path moveToPoint:startP];
    [path addQuadCurveToPoint:endP controlPoint:controlP];

    // 3.把路径添加到上下文
    CGContextAddPath(ctx, path.CGPath);

    // 4.渲染上下文到视图
    CGContextStrokePath(ctx);
}

画一个三角形:

- (void)drawTriangle
{
    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();

    // 2.拼接路径
    UIBezierPath *path = [UIBezierPath bezierPath];

    CGPoint startP = CGPointMake(10, 10);

    [path moveToPoint:startP];

    [path addLineToPoint:CGPointMake(125, 125)];

    [path addLineToPoint:CGPointMake(240, 10)];

    // 从路径的终点连接到起点
    [path closePath];

    // 3.把路径添加到上下文
    CGContextAddPath(ctx, path.CGPath);

    [[UIColor blueColor] setFill];
    [[UIColor redColor] setStroke];

    CGContextSetLineWidth(ctx, 15);

    // 4.渲染上下文
    //    CGContextStrokePath(ctx);
    //    CGContextFillPath(ctx);
    // 即填充又描边 kCGPathFillStroke
    CGContextDrawPath(ctx, kCGPathFillStroke);
}

画一个矩形:

- (void)drawRectangle
{
    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();

    // 2.拼接路径
    UIBezierPath *path = [UIBezierPath bezierPathWithRect:CGRectMake(10, 10, 200, 200)];
    path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(10, 10, 200, 200) cornerRadius:20];

    // 3.把路径添加到上下文
    CGContextAddPath(ctx, path.CGPath);

    // 4.渲染上下文
    CGContextStrokePath(ctx);
}

画一个圆:

- (void)drawCircle
{
    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();

    // 2.拼接路径
    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(10, 10, 200, 100)];

    // 3.把路径添加到上下文
    CGContextAddPath(ctx, path.CGPath);

    // 4.渲染上下文
    CGContextStrokePath(ctx);

}

画一个圆弧:

- (void)drawArc
{
    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();

    // 2.拼接路径
    CGPoint center = CGPointMake(125, 125);
    CGFloat radius = 100;
    CGFloat startA = 0;
    CGFloat endA = M_PI_2;
    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:startA endAngle:endA clockwise:YES];

    // 3.把路径添加到上下文
    CGContextAddPath(ctx, path.CGPath);

    // 4.渲染上下文
    CGContextStrokePath(ctx);
}

画文字和图片

- (void)drawImage:(CGRect)rect
{
    // Drawing code
   UIImage *image = [UIImage imageNamed:@"头像"];

//    [image drawAtPoint:CGPointZero];

//    [image drawInRect:CGRectMake(0, 0, 100, 100)];

    // 设置裁剪区域,超出裁剪区域的都会被裁剪掉
    UIRectClip(CGRectMake(0, 0, 100, 100));

    UIImage *pImage = [UIImage imageNamed:@"001"];
    [pImage drawAsPatternInRect:rect];

}

- (void)drawText
{
    NSString *text = @"hello motolosdmotolosdmotolosdmotolosdmotolosdmotolosdmotolosdmotolosdmotolosdmotolosdmotolosdmotolosdmotolosd";
    CGRect textFrame = CGRectMake(0, 0, 250, 250);

    NSDictionary *dict = @{
                           NSFontAttributeName : [UIFont systemFontOfSize:20],
                           NSForegroundColorAttributeName : [UIColor redColor],
                           NSStrokeWidthAttributeName : @5
                           };
    //    UIRectFill(textFrame);
    //    [text drawInRect:textFrame withAttributes:dict];

    /*
     [text drawInRect:textFrame withAttributes:dict]; 会自动换行
     [text drawAtPoint:CGPointZero withAttributes:dict]; 不会自动换行
     */
    [text drawAtPoint:CGPointZero withAttributes:dict];
}

保存/取出 图形上下文栈

// 把ctx拷贝一份放在栈中
    CGContextSaveGState(ctx);
// 把栈顶上下文取出来,替换当前上下文
    CGContextRestoreGState(ctx);

矩阵操作:

- (void)drawRect:(CGRect)rect
{
    // Drawing code

    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();

    //------------------------------------
    // 注意:你的路径一定放在上下文矩阵操作之后
    // !平移上下文
    CGContextTranslateCTM(ctx, 50, 100);

    // !旋转上下文
    CGContextRotateCTM(ctx, M_PI_4);

    // !缩放上下文
    CGContextScaleCTM(ctx, 0.5, 1.2);
    //------------------------------------

    // 2.拼接路径
    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(-50, -100, 150, 200)];

    // 3.把路径添加到上下文
    CGContextAddPath(ctx, path.CGPath);



    [[UIColor yellowColor] set];

    // 4.渲染
    CGContextFillPath(ctx);

}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值