简笔画项目总结: ios绘图机制 & 实现记录笔迹功能

    简笔画的项目是从暑期8月份开始的,差不多9月多的时候已经有出版,修修改改拖到现在才算能结项目. 现在来总结有点晚了,一些体会早忘记了,但我还是尽力回忆一些自己认为有用的东西记录一下。 

1、故事板。我在上个项目项目总结：华南师范大学校园开发教育android客户端总结 中谈到了故事板，就是项目的设计图。因为这次的项目系统较为复杂，逻辑连贯性不强，这就考验设计故事板的人的写故事板的能力。其实故事板就是你要完全理解整个应用依赖的东西，所以故事板写得清晰合理的话，项目也会进行得较为顺利。这次的故事板有很多细节没有交代清楚，好多东西都需要后来的讨论才最终确定下来，这虽说是无可避免的但是能减少就减少吧。

2、ios绘图机制：因为简笔画项目主要就是一个绘图软件，所以总结一些ios的绘图是必须的。   

https://developer.apple.com/library/ios/#documentation/2DDrawing/Conceptual/DrawingPrintingiOS/GraphicsDrawingOverview/GraphicsDrawingOverview.html#//apple_ref/doc/uid/TP40010156-CH14-SW1

可参考上面的官方文档。

ios提供了2种绘图方案：

1，采用iOS的核心图形库：Quartz, Core Animation, and UIKit

2，采用OpenGL ES。

这次项目是用第一种，OpenGL更多的是应用于游戏场景中。

Quartz类库是画画的主要类库，提供了基于路径画图、反锯齿渲染、渐变填充、图像、色彩、坐标空间转换和PDF文档的一些操作。

UIKit提供划线、Quartz images和颜色操作的objective-C 封装。

Core Animation：提供了UIKit的的底层支持，也可以用来实现自定义动画。

The UIKit Graphics System

1、画图主要在drawRect:中进行，但你不能主动去调用它，它只能被系统本身调用，我们只能通过setNeedsDisplay or setNeedsDisplayInRect: 通知系统更新绘图，系统之后会自行去调用drawRect。

2、Graphics Contexts：Conceptually, a graphics context is an object that describes where and how drawing should occur, including basic drawing attributes such as the colors to use when drawing, the clipping area, line width and style information, font information, compositing options, and so on。从定义可以看出，Graphics Contexts可以理解成一个画板，画板上可以定义一些基本的画图元素。每个UIVIew都会创建。

3、坐标。

上图是用户坐标、视图坐标、硬件坐标的关系。但我们更关心的是ios接口给我们的坐标系统：2种坐标系统

upper-left-origin coordinate system (ULO)  and  lower-left-origin coordinate system (LLO)

关于坐标变换的可以参考iphone：坐标变换 。

4、画图。

说了这么多，究竟在ios上如何实现画图呢？

-(void)drawRect:(CGRect)rect{
         CGContextRef ref=UIGraphicsGetCurrentContext();//拿到当前被准备好的画板。在这个画板上画就是在当前视图上画
         CGContextBeginPath(ref);//这里提到一个很重要的概念叫路径（path），其实就是告诉画板环境，我们要开始画了，你记下。
         CGContextMoveToPoint(ref, 0, 0);//画线需要我解释吗？不用了吧？就是两点确定一条直线了。
         CGContextAddLineToPoint(ref, 300,300);
         CGFloat redColor[4]={1.0,0,0,1.0};
         CGContextSetStrokeColor(ref, redColor);//设置了一下当前那个画笔的颜色。
         CGContextStrokePath(ref);//告诉画板，对我移动的路径用画笔画一下。
}

什么简单的画了一条线，其实画画的过程都差不多，有几个步骤：

1，拿到当前面板  UIGraphicsGetCurrentContext

2，开始画声明

3，画

4，提交画

主要在对Graphics Contexts做的那些修改上面：

具体内容自行查文档，这里不赘述。

5、View截图

-(UIImage *)getImage
{
    UIGraphicsBeginImageContext(self.bounds.size);
    [self.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *Img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return Img;
}

 记录笔迹：

具体看我的另一篇blog：iphone:实现像DrawSomething类似的自动画图的动画效果

 

 

more ：http://iosdeveloper.diandian.com/post/2011-12-29/16946271