zoukankan      html  css  js  c++  java
  • Quartz 2D中的基本图形绘制

    在iOS中绘图一般分为以下几个步骤:

    1.获取绘图上下文

    2.创建并设置路径

    3.将路径添加到上下文

    4.设置上下文状态

    5.绘制路径

    6.释放路径

    在UIKit中默认已经为我们准备好了一个图形上下文对象,在UI控件的drawRect:方法(这个方法在 loadView、viewDidLoad方法后执行)中我们可以通过UIKit封装函数UIGraphicsGetCurrentContext()方 法获得这个图形上下文(注意在其他UI控件方法中无法取得这个对象),然后我们只要按照绘图步骤一步步执行即可。下面自定义一个KCView继承自 UIView,重写drawRect:方法绘制两条直线说明上面绘图的步骤:

    //
    //  DLView.m
    //  Demo0223
    //
    //  Created by wiseman on 16/2/23.
    //  Copyright (c) 2016年 wiseman. All rights reserved.
    //
    
    #import "DLView.h"
    
    @implementation DLView
    
    /*
    // Only override drawRect: if you perform custom drawing.
    // An empty implementation adversely affects performance during animation.
    - (void)drawRect:(CGRect)rect {
        // Drawing code
    }
    */
    
    //绘图只能在此方法中调用,否则无法得到当前图形上下文
    -(void)drawRect:(CGRect)rect{
        //1.取得图形的上下文对象
        CGContextRef context = UIGraphicsGetCurrentContext();
    
        /*
        //2.绘制路径
        CGContextMoveToPoint(context, 20, 50);
        CGContextAddLineToPoint(context, 20, 100);
        CGContextAddLineToPoint(context, 300, 100);
        //封闭路径
        CGContextClosePath(context);
        
        //3.设置图形上下文属性
        [[UIColor redColor] setStroke];//设置红色边框
        [[UIColor blueColor] setFill];//设置蓝色填充
        //[[UIColor blueColor]set];//同时设置填充和边框色
        
        //4.绘制路径
        CGContextDrawPath(context, kCGPathFillStroke);
         */
        
        /*
            绘制矩形
         */
    //    [self drawRectWithContext:context];
        
        /*
            绘制椭圆
         */
    //    [self drawEllipseWithContext:context];
        
        /*
            绘制弧形
         */
    //    [self drawArc:context];
        
        /*
            绘制贝塞尔曲线
         */
    //    [self drawCurve:context];
        
        /*
            文字绘制
         */
        [self drawText:context];
        
    }
    
    #pragma mark - 绘制文字
    -(void)drawText:(CGContextRef)context{
        //绘制到指定的区域内容
        NSString *str=@"Star Walk is the most beautiful stargazing app you’ve ever seen on a mobile device. It will become your go-to interactive astro guide to the night sky, following your every movement in real-time and allowing you to explore over 200, 000 celestial bodies with extensive information about stars and constellations that you find.";
        CGRect rect= CGRectMake(20, 50, 280, 100);
        UIFont *font=[UIFont systemFontOfSize:18];//设置字体
        UIColor *color=[UIColor redColor];//字体颜色
        NSMutableParagraphStyle *style=[[NSMutableParagraphStyle alloc]init];//段落样式
        NSTextAlignment align=NSTextAlignmentLeft;//对齐方式
        style.alignment=align;
        [str drawInRect:rect withAttributes:@{NSFontAttributeName:font,NSForegroundColorAttributeName:color,NSParagraphStyleAttributeName:style}];
    }
    
    #pragma mark - 绘制贝塞尔曲线
    -(void)drawCurve:(CGContextRef)context{
        //绘制曲线
        CGContextMoveToPoint(context, 20, 100);//移动到起始位置
        /*绘制二次贝塞尔曲线
         c:图形上下文
         cpx:控制点x坐标
         cpy:控制点y坐标
         x:结束点x坐标
         y:结束点y坐标
         
         CGContextAddQuadCurveToPoint(CGContextRef c, CGFloat cpx, CGFloat cpy, CGFloat x, CGFloat y)
         */
        CGContextAddQuadCurveToPoint(context, 160, 0, 300, 100);
        
        [[UIColor clearColor] setFill];
        [[UIColor blackColor] setStroke];
        
        
        /*绘制三次贝塞尔曲线
         c:图形上下文
         cp1x:第一个控制点x坐标
         cp1y:第一个控制点y坐标
         cp2x:第二个控制点x坐标
         cp2y:第二个控制点y坐标
         x:结束点x坐标
         y:结束点y坐标
         */
        CGContextMoveToPoint(context, 20, 500);
        CGContextAddCurveToPoint(context, 80, 300, 240, 500, 300, 300);
        
        [[UIColor redColor] setStroke];
        [[UIColor clearColor] setFill];
        
        CGContextDrawPath(context, kCGPathFillStroke);
    }
    
    #pragma mark - 绘制弧形
    -(void)drawArc:(CGContextRef)context{
        //添加弧形对象
        /*
         x:中心点x坐标
         y:中心点y坐标
         radius:半径
         startAngle:起始弧度
         endAngle:终止弧度
         closewise:是否逆时针绘制,0则顺时针绘制
        
         CGContextAddArc(CGContextRef c, CGFloat x, CGFloat y, CGFloat radius, CGFloat startAngle, CGFloat endAngle, int clockwise)
         */
        CGContextAddArc(context, 160, 160, 100, 0, M_PI_2, 1);
        [[UIColor blueColor]setStroke];
        [[UIColor clearColor]setFill];
        CGContextDrawPath(context, kCGPathFillStroke);
        
    }
    
    #pragma mark - 绘制椭圆
    -(void)drawEllipseWithContext:(CGContextRef)context{
        //添加对象,绘制椭圆(圆形)的过程首先也是创建一个矩形
        CGRect rect = CGRectMake(50, 50, 220, 200);
        CGContextAddEllipseInRect(context, rect);
        //设置属性
        [[UIColor redColor] set];
        CGContextDrawPath(context, kCGPathFillStroke);
    }
    
    #pragma mark 绘制矩形
    -(void)drawRectWithContext:(CGContextRef)context{
        //添加矩形对象
        CGRect rect=CGRectMake(20, 50, 280.0, 50.0);
        CGContextAddRect(context,rect);
        //设置属性
        [[UIColor blueColor]set];
        //绘制
        CGContextDrawPath(context, kCGPathFillStroke);
    }
    
    #pragma mark 绘制矩形(利用UIKit的封装方法)
    -(void)drawRectByUIKitWithContext:(CGContextRef)context{
        CGRect rect= CGRectMake(20, 150, 280.0, 50.0);
        CGRect rect2=CGRectMake(20, 250, 280.0, 50.0);
        //设置属性
        [[UIColor yellowColor]set];
        //绘制矩形,相当于创建对象、添加对象到上下文、绘制三个步骤
        UIRectFill(rect);//绘制矩形(只有填充)
        
        [[UIColor redColor]setStroke];
        UIRectFrame(rect2);//绘制矩形(只有边框)
    }
    
    @end
  • 相关阅读:
    深入剖析Java中的装箱和拆箱
    JDBC(1)
    设计模式
    MySQL学习笔记(3)
    MySQL学习笔记(2)
    MySQL学习笔记(1)
    tomcat 部署项目出现Error thrown in preDeregister method
    JSP页面中的request.getContextPath()出现“ .... .. refers to the missing type String
    myEclipse 导入 jquery包为什么整个项目都会报错
    走楼梯
  • 原文地址:https://www.cnblogs.com/iOSDeng/p/5209806.html
Copyright © 2011-2022 走看看