画板的实现

一.首先,故事板实现界面的搭建: 搭建的效果图如下所示 :

下面的三种颜色的按钮是切换线条颜色的按钮.

 

 

实现的代码如下 :

 

1>设置线宽和颜色 :

#import "CustomPath.h"

@implementation CustomPath


+ (id)paintPathWithLineWidth:(CGFloat)lineWidth color:(UIColor *)color
{
    
    CustomPath *path = [[CustomPath alloc]init];
    
    //设置线宽
    path.lineWidth = lineWidth;
    
    //设置颜色
    path.color = color;

    return path;
    
}
@end

　　

2>子类化绘图 :

 

#import "PaintView.h"
#import "CustomPath.h"


@interface PaintView ()

@property (nonatomic,strong)CustomPath *path;
@property (nonatomic,strong)NSMutableArray *pathArray;

@end

@implementation PaintView


// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.




//设置线宽的默认值
- (void)awakeFromNib
{
    _lineWidth = 1;
    
}



//懒加载
- (NSMutableArray *)pathArray
{
    if (_pathArray == nil) {
        
        _pathArray = [NSMutableArray array];
    }
    
    return _pathArray;
}


//绘图
- (void)drawRect:(CGRect)rect {
    
    
    //从数组中取出即可以连续的画
    for (CustomPath *path in _pathArray) {
   
        //设置绘制的颜色
        [path.color setStroke];
        
        
        //必须加上这句,不然不能绘制
        [path stroke];
    }
}



- (CGPoint)getPoint:(NSSet *)touches
{
    UITouch *touch = [touches anyObject];
    
    //取得开始位置
    CGPoint point = [touch locationInView:self];

    return point;
}




//触摸开始调用
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
    /*
    UITouch *touch = [touches anyObject];
    
    //取得开始位置
    CGPoint startPoint = [touch locationInView:self];
    */
    
    CGPoint startPoint = [self getPoint:touches];
    
    
    //自定义    (设置路径)
    _path = [CustomPath paintPathWithLineWidth:_lineWidth color:_color];
    
    //将路径加入数组
    [self.pathArray addObject:_path];
    
    
    //设置起点
    [_path moveToPoint:startPoint];
    
}


//触摸移动调用
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
    /*
    UITouch *touch = [touches anyObject];
    
    //取得移动位置
    CGPoint movePoint = [touch locationInView:self];
    */
    
    CGPoint movePoint = [self getPoint:touches];
    
    //连线
    [_path addLineToPoint:movePoint];
    
    //设置移动后重新绘制
    [self setNeedsDisplay];
    
}

//清屏
- (void)clear
{
    [_pathArray removeAllObjects];
    
    //记得重新绘制
    [self setNeedsDisplay];
    
    
}

//撤销
- (void)undo
{
    [_pathArray removeLastObject];
    
    //记得重新绘制
    [self setNeedsDisplay];
  
}

　　

3>控制器ViewController代码 :

 

#import "ViewController.h"
#import "PaintView.h"

@interface ViewController ()
- (IBAction)clearScreen:(id)sender;
- (IBAction)undo:(id)sender;
- (IBAction)eraser:(id)sender;
- (IBAction)sava:(id)sender;

- (IBAction)lineWidthChange:(id)sender;
- (IBAction)colorChange:(UIButton *)sender;


@property (weak, nonatomic) IBOutlet PaintView *PaintView;

@property (nonatomic,strong)UIBarButtonItem *lastItem;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
}

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


//封装切换按钮颜色方法
- (void)changeButtonColor:(UIBarButtonItem *)item
{
    
    _lastItem.tintColor = nil;
    item.tintColor = [UIColor blackColor];
    _lastItem = item;
    
}

//清屏
- (IBAction)clearScreen:(UIBarButtonItem *)sender {
    
    /*
    _lastItem.tintColor = nil;
    sender.tintColor = [UIColor blackColor];
    _lastItem = sender;
    */
    [self changeButtonColor:sender];
    
    [_PaintView clear];
    
}

//撤销
- (IBAction)undo:(UIBarButtonItem *)sender {
   
    
    /*_lastItem.tintColor = nil;
    sender.tintColor = [UIColor blackColor];
    _lastItem = sender;
     
     */
    [self changeButtonColor:sender];
    [_PaintView undo];
}


//橡皮擦  (将线条的颜色改为白色即可)
- (IBAction)eraser:(UIBarButtonItem *)sender {
    
    /*
    _lastItem.tintColor = nil;
    sender.tintColor = [UIColor blackColor];
    _lastItem = sender;
     
     */
    [self changeButtonColor:sender];
    _PaintView.color = [UIColor cyanColor];
}


//保存图片至相册
- (IBAction)sava:(id)sender {
    
    //实现截屏->图片
    
    //开启图片上下文
    UIGraphicsBeginImageContext(self.view.frame.size);
    
    //取得当前图形上下文
    CGContextRef ref = UIGraphicsGetCurrentContext();
    
    //设置裁剪区域
    CGContextClipToRect(ref, self.view.frame);
    
    //将视图的图层渲染到位图上下文
    [self.view.layer renderInContext:ref];
    
    //获取到当前图片
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    //关闭图片上下文
    UIGraphicsEndImageContext();
    
    //将图片保存到相册
    UIImageWriteToSavedPhotosAlbum(image, self, @selector(image:didFinishSavingWithError:contextInfo:), nil);
    
}


//将图片保存到相册后调用的方法

- (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo
{
    NSLog(@"图片保存到相册成功...");
    
}


//设置滑块控制线宽
- (IBAction)lineWidthChange:(UISlider *)sender {

    _PaintView.lineWidth = sender.value;
    
}

//改变颜色
- (IBAction)colorChange:(UIButton *)sender {
    

    _PaintView.color = sender.backgroundColor;
    
}
@end