CAShapeLayer画板

参考:CAShapeLayer - 绘图板

由于参考的文章代码的线条是写死的,所有对于画板的需求来说,还是不太好用,所以自己写了个Demo
直接上代码了:
<code>

 @interface ViewController ()

 @property (nonatomic, strong, nullable) NSMutableArray * drawPaths;
 @property (nonatomic, strong, nullable) NSMutableArray * drawLayers;

 @end

 @implementation ViewController

- (void)viewDidLoad {
        [super viewDidLoad];
        UIButton * clearBtn = [[UIButton alloc]
          initWithFrame:CGRectMake(self.view.bounds.size.width - 100, 44, 100, 50)];
        clearBtn.backgroundColor = [UIColor grayColor];
        [clearBtn setTitleColor:[UIColor greenColor] forState:UIControlStateNormal];
        [clearBtn setTitle:@"clear" forState:UIControlStateNormal];
        clearBtn.tag = 1;
        [clearBtn addTarget:self action:@selector(backOrClear:) forControlEvents:UIControlEventTouchUpInside];
        [self.view addSubview: clearBtn];
        UIButton * backBtn = [[UIButton alloc] initWithFrame:CGRectMake(0, 44, 100, 50)];
        backBtn.backgroundColor = [UIColor grayColor];
        [backBtn setTitleColor:[UIColor greenColor] forState:UIControlStateNormal];
        [backBtn setTitle:@"back" forState:UIControlStateNormal];backBtn.tag = 2;
        [backBtn addTarget:self action:@selector(backOrClear:) forControlEvents:UIControlEventTouchUpInside];
        [self.view addSubview: backBtn];
  }
  - (void)backOrClear:(UIButton *)sender{
        switch (sender.tag) {
              case 1:{
                    for (CAShapeLayer * layer in self.drawLayers) {
                          [layer removeFromSuperlayer];
                    }
                    self.drawLayers = nil;
                    [self.drawPaths removeAllObjects];
              }
              break;
              default:{
                    CAShapeLayer * layer = self.drawLayers.lastObject;
                    [layer removeFromSuperlayer];
                    [self.drawLayers removeLastObject];
              }
              break;
        }
  }
  - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{ 
          [super touchesBegan:touches withEvent:event]; 
          UIBezierPath * path = [UIBezierPath bezierPath];  
          [path moveToPoint:[[touches anyObject] locationInView:self.view]];   
          CAShapeLayer *layer = [CAShapeLayer layer];    
          layer.backgroundColor = [UIColor clearColor].CGColor;  
          layer.frame = self.view.bounds;  
          layer.path = path.CGPath;   
          layer.lineWidth = 3.0f;   
          layer.strokeColor = [UIColor redColor].CGColor;  
          layer.miterLimit = 2.;   
          layer.lineDashPhase = 10;   
          layer.lineDashPattern = @[@1,@0];   
          layer.fillColor = [UIColor clearColor].CGColor;
          layer.fillRule = kCAFillRuleEvenOdd;    
          layer.lineCap = kCALineCapRound;   
          layer.lineJoin = kCALineJoinRound;    // 结合 CABasicAnimation 可以变成 动画绘制    // 将layer添加进图层   
          [self.view.layer addSublayer:layer];   
          [self.drawPaths addObject:path];   
          [self.drawLayers addObject:layer];   
 }    
- (void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{  
          [super touchesMoved:touches withEvent:event];                      
          UIBezierPath * path = self.drawPaths.lastObject;      
          CAShapeLayer * layer = self.drawLayers.lastObject;                    
          [path addLineToPoint:[[touches anyObject] locationInView:self.view]];       
          layer.path = path.CGPath;      
}        
- (NSMutableArray *)drawPaths{      
   if (_drawPaths == nil) {     
       _drawPaths = [NSMutableArray array];     
   }       
   return _drawPaths;      
}       
- (NSMutableArray *)drawLayers{     
    if (_drawLayers == nil) {       
          _drawLayers = [NSMutableArray array];    
    }      
    return _drawLayers;   
}

</code>

有人可能会问了,这么写,会不会有问题,为什么不用一个UIBezierPath曲线画,我是这样考虑的:
1.一条曲线渲染速度太慢,画的越多,渲染的速度越慢.会造成延时渲染的效果.这个是我跳入的坑,刚爬出来.
2.对于画板的需求来说,回撤的可能是非常大的.一条曲线不容易操作
对于一条曲线来说,如果渲染慢的话,还是可以解决的,不过要调用,layer的-setNeedsDisplayInRect:方法对touch附近的区域进行渲染,这个继续研究

有不明白的欢迎下载Demo

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 前言:关于贝塞尔曲线与CAShapeLayer的学习 学习Demo演示: 贝塞尔曲线简单了解 使用UIBezier...
    麦穗0615阅读 17,922评论 18 149
  • (一) 国君自焚,宫人尽数逃离,夜,从所未有的安静。偶尔扬起的风隐隐夹杂着血腥味,如地狱般的可怖,暗示着那场刚刚结...
    何潇湘阅读 1,168评论 4 48
  • 雄雉于飞 新月山庄位处杭州东北,庄内规矩森严,门内弟子很少踏出庄外。 山庄庄主花子缎死后,众弟子纷纷逃散,青龙会随...
    一束冬阳阅读 877评论 0 0
  • 首先咱们弄清楚,TCP协议和UCP协议与TCP/IP协议的联系,很多人犯糊涂了,一直都是说TCP/IP协议与UDP...
    莫要戏言阅读 1,292评论 0 0
  • 我,一个90后女生。毕业两年,工作两年。生活在一个陌生而又熟悉的城市里,所有面对的一切让我学会了独立和坚强。 以前...
    不二其实有点二阅读 281评论 0 0