IOS学习之—— Quartz 2D (C语言的框架)

//************************************************************************************************************ -12 Quartz 2D (C语言的框架)
                // 主要是用来自定义view
                1.简介
                （1）Quartz 2D 是一个二维绘图引擎，同时支持ios和 Mac系统
                （2）//绘制图形， 线条，三角形，矩形 圆 狐 // 绘制文字， // 绘制 生成图片 // 读取 生成PDF //截图 裁剪图片
                （3）有些UI界面及其复杂，而且比较有个性化，用普通的UI控件无法实现，这时候可以利用Quartz 2D技术将控件内部的结构画出来，自定义控件的样子
                    其实，ios中大部分的控件的内容都是通过它画出来的
                （4）因此，它中IOS中 很重要的一个价值是：自定义view （自定义UI控件）
// 如何利用Quartz2D自定义view?

//3.如何利用Quartz 2D 绘制东西到view 上？
                （1） 首先，得有图形上下文，因为它能保存绘图信息，并且决定着绘图到什么地方去。
                （2） 其次，那个图形上下文必须跟view 相关联，才能将内容绘制到view 上

//4. 自定义view的步骤：
                （1）新建一个类，继承自UIView
                (2)实现 -（void）drawRect:(CGRect)rect 方法 ，（解开.m 文件中的注释就可以了）
                (3)取得当前view 相关联的图形上下文
                （4）绘制相应的图形内容
                （5）利用图形上下文将绘制的所有内容渲染显示到view 上面

// 画线的步骤：
                （1） 创建一个类LineView 继承UIView  解开.m文件的注释 就可以用其中的内容了
                (2) 创建一个UIView 在Stroyboard 中  让它关联 LineView
                (3)- (void)drawRect:(CGRect)rect {
// 调用方法
                    [self drawRectangle];//矩形
// [self drawTriangle]//三角形 要用哪个调用就好

                    }
#pragma mark 画矩形
                -(void) drawRectangle{


                    //获取上下文 上下文的输出目录就是self[view]
                    CGContextRef context = UIGraphicsGetCurrentContext();

                    //设置线的颜色
                    CGContextSetRGBStrokeColor(context, 1.0, 0.0, 0.0, 1);


                    //设置线宽
                    CGContextSetLineWidth(context, 10);

                    //设置线头尾的样式
                    CGContextSetLineCap(context, kCGLineCapRound);

                    //设置连接点的样式
                    CGContextSetLineJoin(context, kCGLineJoinBevel);


                    //画一条线 需要两个点 一个起点 一个终点
                    //**********************************************方法一 矩形
                    // // 设置一个起点
                    // CGContextMoveToPoint(context, 10, 10);
                    // //设置一个终点
                    // CGContextAddLineToPoint(context, 110, 10);
                    // CGContextAddLineToPoint(context, 110, 110);
                    // CGContextAddLineToPoint(context, 10, 110);
                    // CGContextAddLineToPoint(context, 10, 10);

                    //**********************************************方法二 矩形
                    CGContextAddRect(context, CGRectMake(10, 10, 100, 100));
                    //画到view[渲染]
                    // 只是画了一条线 空心
                    CGContextStrokePath(context);
                    //填充 实心
                    //CGContextFillPath(context);

                }

#pragma mark 画三角形 画线也可以使用这个方法
               // 方法一
// // 设置一个起点
// CGContextMoveToPoint(context, 10, 10);
// //设置一个终点
// CGContextAddLineToPoint(context, 110, 10);
// CGContextAddLineToPoint(context, 110, 110);
             方法二 CGPoint points[3]={{10,10},{110,10},{110,110}};
                    CGContextAddLines(ctx,points,3);
                    //关闭路径
                    CGContextClosePath(context);

#pragma mark 画圆
                    //画圆
                    CGContextAddEllipseInRect(context,CGRectMake(10 ,10, 100, 100));
#pragma mark 画弧
                    // x y 圆心 radious 半径 startAngle 画弧的起始位置 endAngel结束的位置 clockwise 0顺时针 1 逆时针
                    CGContextAddArc(context,100,100,60,M_PI_2,0);
#pragma mark 画扇形
                    //起点
                    CGContextMoveToPoint(context,100,100);
                    CGContextAddArc(context,100,1000,60,- M_PI_4, -3*M_PI_4,1);
                    // x y 圆心 radious 半径 startAngle 画弧的起始位置 endAngel结束的位置 clockwise 0顺时针 1 逆时针
                    //关闭路径
                    CGContextClosePath(context);

#pragma mark 画文字
                - (void)drawRect:(CGRect)rect {
                    // Drawing code
                    CGFloat w = rect.size.width;
                    CGFloat h = rect.size.height;

                    //画图片
                    UIImage *image =[UIImage imageNamed:@"papa"];
                    //设置位置
                    [image drawInRect:CGRectMake(10, 10, 100, 100)];
                    //设置平铺
                    [image drawAsPatternInRect:CGRectMake(0, 0, 180, 180)];



                    //画文字
                    NSString *text =@"skdfkljahsjfdlasdfhkasjdhflasjkhfdlkashdfjkh";
                    //设置字体的样式
                    NSDictionary *attr =@{NSFontAttributeName:[UIFont  systemFontOfSize:13],NSForegroundColorAttributeName:[UIColor yellowColor]};
                    //指定宽度和高度 和字体样式
                    [text drawInRect:CGRectMake(0, 0, w, h*0.5) withAttributes:attr];// withAttributes 设置字体的样式
                }
#pragma mark 饼状图
                //核心 第五天
                步骤：
                （1）自定义一个饼状view(PieView) 添加到控制器view 上
                （2） 添加PieView的一个类型为数据的section属性  存储所有分类的个数，并且添加一个颜色数组，用于存储颜色
                （3）中drawRect 方法中遍历section 的大小
                （4）遍历section的个数，进行总数汇总
                （5）定义一个“扇形的起始位置”
                （6）设置路径中心点
                （7）遍历section 计算数组中每一个元素占用总数的比例
                （8）根据比例计算饼状的结束位置 病设置“弧”的路径
                （9）渲染扇形中UIView 上，实现实心的扇形
                （10）给“扇形的起始位置”重新赋值，进入下一个循环


#pragma mark 矩阵操作 （ 平移 缩放 旋转 ）
                目标：掌握中图层上下文的平移 缩放 旋转
                #warining qurtz2d 的平移 要在绘制之前。
                //平移
                CGContextTranslateCTM(ctx,0,-80);//x y轴
                //缩放
                CGContextScaleCTM(ctx,1.5,1.0);//x y缩放的倍数
                //旋转
                CGContextRotateCTM(ctx,-M_PI*0.1);// 负数 逆时针， 正数 顺时针 围绕左上角（0，0）进行旋转的





#pragma mark 使用UIKit 绘图方法
            //UIKit 方法，虽然不用获取上下文，但是内部最终都会获取上下文进行绘制。
// 画实心
            UIRectFill(CGRectMake(10,10,100,100));
// 画空心
            UIRectFrame(CGRectMake(10,10,100,100));


#pragma mark Path 的使用
            （1）画出的东西 ，都是沿着一条路径去画的。
            （2）path 是将路径定义好后，再放入上下文。
            使用步骤：1.创建路径 CGMutablePathRef path =CGPathCreateMutable();
                    2.通过CGPathAddLineToPoint,CGPointAddArc,CGPathAddEllipseInRect 定义路径
                    3.将路径添加到上下文中CGContextAddPath;

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

                CGContextRef ctx = UIGraphicsGetCurrentContext();

                //每调用一次，往上下文添加路径
                // CGContextMoveToPoint(ctx, 10, 10);
                // CGContextAddLineToPoint(ctx, 100, 100);

                //先把所有的路径定义好，然后一次性往上下文中添加
                CGMutablePathRef path = CGPathCreateMutable();

                // 设置圆的路径
                CGPathAddEllipseInRect(path, NULL, CGRectMake(10, 10, 100, 100));
                CGPathAddEllipseInRect(path, NULL, CGRectMake(20, 20, 80, 80));

                //添加弧的路径
                //CGPathAddArc(<#CGMutablePathRef path#>, <#const CGAffineTransform *m#>, <#CGFloat x#>, <#CGFloat y#>, <#CGFloat radius#>, <#CGFloat startAngle#>, <#CGFloat endAngle#>, <#bool clockwise#>)

                //添加 "线" 路径
                //CGPathAddLines(<#CGMutablePathRef path#>, <#const CGAffineTransform *m#>, <#const CGPoint *points#>, <#size_t count#>)

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

                // 渲染
                CGContextStrokePath(ctx);

                //开发过程中，ARC环境 C语言的资源是不会自动释放
                // 什么情况下创建的C语言资源，需要释放 以create，retain,copy创建的数据要释放
                //CGPathRelease(path);
                // 能用
                CFRelease(path);


            }