Quartz 2D(自定义画板)

1、Quartz 2D简单介绍

Quartz2D是一个二维绘图引擎,同时支持iOS和MacOSX系统(跨平台,纯C 语言的)。包含在CoreGraphics框架中。
Quartz2D能完成的工作有:
1、绘制图形:线条\三角形\矩形\圆\弧等
2、绘制文字
3、绘制\生成图片(图像)
4、读取\生成PDF
5、截图\裁剪图片
6、自定义UI控件
……
•注意:
–Quartz 2D是苹果官方的二维绘图引擎,同时支持iOS和 MacOSX系统。
–Cocos2D(Cocos2D-x、Cocos2D-iPhone、Cocos2D-HTML5等),Cocos2D是一个第三方开源的2D游戏框架。做2D游戏的 还有 SpriteKit。一般3D游戏用 unity3D。
Quartz2D的API是纯C语言的;Quartz2D的API来自于Core Graphics框架
•数据类型和函数基本都以CG作为前缀
ØCGContextRef
ØCGPathRef
CGContextStrokePath

2、Quartz2D 绘图主要步骤

•1.获取【图形上下文】对象
•2.向【图形上下文】对象中添加【路径】
•3.渲染(把【图形上下文】中的图形会知道对应的设备上)

3、使用Quartz2D制作涂鸦画板核心代码如下所示:

#import "CHPaintView.h"
#import "CHBezierPath.h"
@interface CHPaintView()
//@property (nonatomic,strong) UIBezierPath *path;

@property (nonatomic,strong) NSMutableArray *paths;

@end
@implementation CHPaintView
-(NSMutableArray *)paths{
    if (_paths==nil) {
        _paths = [NSMutableArray array];
    }
    return _paths;
}
//手指按下
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
    //获取触摸对象
    UITouch *touch = touches.anyObject;
    //根据触摸对象获取触摸位置
    CGPoint locP = [touch locationInView:touch.view];
   //创建路径
    CHBezierPath  *path = [CHBezierPath bezierPath];
   //设置画笔的起始点
    [path moveToPoint:locP];
   
    //设置线宽
    path.lineWidth = self.lineWidth;
    //设置线的颜色
    path.lineColor = self.lineColor;
    
    [self.paths addObject:path];
}
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
   //获取触摸对象
    UITouch *touch = touches.anyObject;
    //获取移动后的当前位置
    CGPoint currentP = [touch locationInView:touch.view];
    //添加直线
    [[self.paths lastObject] addLineToPoint:currentP];
    //执行重绘
    [self setNeedsDisplay];
}
-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event{


}
-(void)clear{
    [self.paths removeAllObjects];
    [self setNeedsDisplay];
}
-(void)back{
    [self.paths removeLastObject];
    [self setNeedsDisplay];
}
-(void)eraser{
    self.lineColor = self.backgroundColor;
}

- (void)drawRect:(CGRect)rect {
   
    for (CHBezierPath *path in self.paths) {
       
         //设置线头的样式
        path.lineCapStyle = kCGLineCapRound;
         //设置接头的样式
        path.lineJoinStyle = kCGLineJoinRound;
       
        [path.lineColor set];
        [path stroke];
    }
}

@end
#import "ViewController.h"
#import "CHPaintView.h"
@interface ViewController ()

@property (weak, nonatomic) IBOutlet CHPaintView *paintView;
@property (weak, nonatomic) IBOutlet UISlider *slider;

@end
@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
   //默认线宽
    self.paintView.lineWidth = self.slider.value;
}
//隐藏状态栏  运营商 网络 时间 电池电量等隐藏
-(BOOL) prefersStatusBarHidden{

    return YES;
}
- (IBAction)clickValueChanged:(UISlider *)sender {
    self.paintView.lineWidth = sender.value;
}
- (IBAction)colorDidClick:(UIButton *)sender {

    self.paintView.lineColor = sender.backgroundColor;

}
- (IBAction)clearClick:(UIBarButtonItem *)sender {
    [self.paintView clear];
}
- (IBAction)backClick:(UIBarButtonItem *)sender {
    [self.paintView back];
}
- (IBAction)eraserClick:(UIBarButtonItem *)sender {
    [self.paintView eraser];
}
- (IBAction)saveClick:(id)sender {

    //通过屏幕截图
    //1.开启一个图形上下文(bitmap)
    UIGraphicsBeginImageContextWithOptions(self.paintView.bounds.size, NO, 0.0);
    
    //2.获取刚刚开启的图形上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    //3.通过调用layer renderInContext
    [self.paintView.layer renderInContext:ctx];
    
    //4.从图形上下文中获取图片

    UIImage * image = UIGraphicsGetImageFromCurrentImageContext();
    
    //5.结束图形上下文
    UIGraphicsEndImageContext();
    
    //6.使用图片
    UIImageWriteToSavedPhotosAlbum(image, self, @selector(image:didFinishSavingWithError:contextInfo:), @"hello");
}
- (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo;
{
    NSString * str = @"";
    
    if (error)
    {
        str = @"保存失败";
    }
    else
    {
        str = @"保存成功";
    }   
    NSLog(@"%@",str);
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}
@end

画板的效果

Untitled.gif

*** 说明***

This app has crashed because it attempted to access privacy-sensitive data without a usage description. The app's Info.plist must contain an NSPhotoLibraryUsageDescription key with a string value explaining to the user how the app uses this data.

应用程序崩溃的原因是在使用隐私敏感数据的时候没有设置使用描述信息的配置。你需要在 info.plist 文件添加一个 NSPhotoLibraryUsageDescription的 key,然后添加一个描述如何使用这个数据。否则,没有相册的访问权限,必须要在应用程序设置信息中配置对应的键值信息。

解决方案

第一步、在项目中找到info.plist文件,右键点击以Source Code
形式打开2.添加以下键值对,这里以 PhotoLibrary 作为例子
NSPhotoLibraryUsageDescription 在这个世界上,你唯一可以听到的就是你前进的脚步声

你可能感兴趣的:(Quartz 2D(自定义画板))