IOS开发之——画板-线的粗细及颜色变化(87)

IOS开发之——画板-线的粗细及颜色变化(87)

一 概述

  • 画板——改变线的粗细
  • 画板——添加颜色变化

二 画板——改变线的粗细

2.1 功能描述

  • PaintView中定义画板中线宽的变量width
  • 给绘制View添加线宽变化功能valueChange
  • PaintView中当绘制开始时,设置要绘制线的宽度

2.2 功能代码

PaintView.h

1
@property (nonatomic,assign) CGFloat width;

ViewController.m

1
2
3
4
- (IBAction)valueChange:(UISlider *)sender
{
_paintView.width=sender.value;
}

PaintView.m

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
- (void)awakeFromNib
{
_width=2;
}
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
//创建路径
UIBezierPath *path=[UIBezierPath bezierPath];
path.lineWidth=_width;
_path=path;
[self.paths addObject:path];
//获取触摸点
CGPoint pos=[self pointWithTouches:touches];
//确定起点
[path moveToPoint:pos];
}

2.3 效果图

三 画板——添加颜色变化

3.1 功能描述

  • 自定义PaintPath(继承UIBezierPath,用于添加绘制时颜色)
  • PaintPath添加绘制时的方法,用于确定绘制时的线宽,颜色,粗细,起点
  • 绘制时,拿出颜色值设置

3.2 功能代码

PaintPath.m

1
2
3
4
5
6
7
8
9
10
11
12
#import "PaintPath.h"
@implementation PaintPath

+ (instancetype)paintPathWidthLineWidth:(CGFloat)width color:(UIColor *)color startPoint:(CGPoint)startPoint
{
PaintPath *path=[[self alloc]init];
path.lineWidth=width;
path.color=color;
[path moveToPoint:startPoint];
return path;
}
@end

PaintView.m

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
//确定起点
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
//获取触摸点
CGPoint pos=[self pointWithTouches:touches];
//创建路径
PaintPath *path=[PaintPath paintPathWidthLineWidth:_width color:_color startPoint:pos];

_path=path;
[self.paths addObject:path];
}

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

for (PaintPath *path in self.paths) {

[path.color set];
[path stroke];
}
}

3.3 效果图