- (void)viewDidLoad
{
[super viewDidLoad];
PanelView *panel = [[PanelView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:panel];
ToolView *toolView = [[ToolView alloc] initWithFrame:CGRectMake(0, 20, 320, 104)];
toolView.backgroundColor = [UIColor grayColor];
[self.view addSubview:toolView];
[toolView addSelectColorBlock:^(UIColor *color) {
panel.drawColor = color;
} selectLine:^(CGFloat lineWidth) {
panel.lineWidth = lineWidth;
} selectEarser:^{
panel.lineWidth = 10;
//橡皮
panel.drawColor = [UIColor whiteColor];
} selectUndo:^{
//撤銷
[panel undo];
} selectClear:^{
//清屏
[panel clearView];
@implementation PanelView
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
self.drawColor = [UIColor blackColor];
self.lineWidth = 5.0f;
self.backgroundColor = [UIColor whiteColor];
}
return self;
}
- (void)undo {
//移除最後一條路徑
[self.paths removeLastObject];
//重新繪製
[self setNeedsDisplay];
}
//清屏
- (void)clearView {
//移除最後一條路徑
[self.paths removeAllObjects];
//重新繪製
[self setNeedsDisplay];
}
#pragma mark - 繪製方法
- (void)drawRect:(CGRect)rect {
//遍歷所有的路徑，將這些路徑繪製
for (PathModel *p in self.paths) {
//1.獲取上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//2.設置繪製屬性
[p.color setStroke]; //設置線的顏色
CGContextSetLineWidth(ctx, p.lineWidth); //設置線寬
//3.繪製CGPath
CGContextAddPath(ctx, p.path);
//4.繪製
CGContextDrawPath(ctx, kCGPathStroke);
}
if (self.drawPath != nil) {
//1.獲取上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//2.設置繪製屬性
[self.drawColor set]; //設置線的顏色
CGContextSetLineWidth(ctx, self.lineWidth); //設置線寬
//3.繪製CGPath
CGContextAddPath(ctx, self.drawPath);
//4.繪製
CGContextDrawPath(ctx, kCGPathStroke);
}
}
/**
繪製有兩種方式
1. 直接向Context上繪製圖形
2. 創建一個CGPath, 向CGPath上繪製圖形, 再將CGPath繪製到Context
*/
#pragma mark - touch
//1.開始觸摸
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
CGPoint p = [touch locationInView:self];
// NSLog(@"%@",NSStringFromCGPoint(p));
//1.創建一個CGPath
self.drawPath = CGPathCreateMutable();
//2.將第一個點添加到CGPath
CGPathMoveToPoint(self.drawPath, NULL, p.x,p.y);
}
//2.觸摸移動中...
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
//1.取得觸摸點
UITouch *touch = [touches anyObject];
CGPoint p = [touch locationInView:self];
//2.將觸摸點添加到路徑中
CGPathAddLineToPoint(self.drawPath, NULL, p.x, p.y);
//3.重新繪製
[self setNeedsDisplay];
}
//3.觸摸結束
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
//觸摸結束後，將完整的路徑添加到數組中保存起來
if (self.paths == nil) {
self.paths = [NSMutableArray array];
}
PathModel *pathModel = [[PathModel alloc] init];
pathModel.path = self.drawPath;
pathModel.color = self.drawColor;
pathModel.lineWidth = self.lineWidth;
[self.paths addObject:pathModel];
CGPathRelease(self.drawPath);
self.drawPath = nil;
@implementation ToolView
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
//1.創建按鈕
[self _createButtons];
//2.創建顏色視圖
[self _createColorView];
//3.創建選擇線寬的視圖
[self _createLineWidthView];
}
return self;
}
- (void)addSelectColorBlock:(SelectColorBlock)colorBlock
selectLine:(SelectLineBlock)selectLine
selectEarser:(SelectBlock)selectEarser
selectUndo:(SelectBlock)selectUndo
selectClear:(SelectBlock)selectClear {
_colorBlock = [colorBlock copy];
_lineBlock = [selectLine copy];
_selectEarser = [selectEarser copy];
_selectUndo = [selectUndo copy];
_selectClear = [selectClear copy];
}
#pragma mark - create views 創建子視圖
- (void)_createButtons {
NSArray *titleArray = @[@"顏色",@"線寬",@"橡皮",@"撤銷",@"清屏"];
_buttonView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(self.bounds), 40)];
_buttonView.backgroundColor = [UIColor grayColor];
[self addSubview:_buttonView];
CGFloat width = self.bounds.size.width/titleArray.count;
for (int i=0; i<titleArray.count; i++) {
SelectButton *button = [[SelectButton alloc] initWithFrame:CGRectMake(i*width, 0, width, 40)];
button.backgroundColor = [UIColor clearColor];
button.title = titleArray[i];
button.font = [UIFont systemFontOfSize:16];
button.tag = i;
[button addTarget:self action:@selector(tapButton:) forControlEvents:UIControlEventTouchUpInside];
[_buttonView addSubview:button];
}
}
- (void)_createColorView {
_colorView = [[UIView alloc] initWithFrame:CGRectMake(0, CGRectGetMaxY(_buttonView.frame), 320, 60)];
_colorView.backgroundColor = [UIColor clearColor];
_colorView.hidden = YES;
[self addSubview:_colorView];
_colorArray = @[
[UIColor darkGrayColor],
[UIColor redColor],
[UIColor greenColor],
[UIColor blueColor],
[UIColor yellowColor],
[UIColor orangeColor],
[UIColor purpleColor],
[UIColor brownColor],
[UIColor blackColor]
];
CGFloat width = 320/_colorArray.count;
for (int i=0; i<_colorArray.count; i++) {
UIControl *control = [[UIControl alloc] initWithFrame:CGRectMake(i*width, 5, width-5, 50)];
control.tag = i;
control.backgroundColor = _colorArray[i];
[control addTarget:self action:@selector(selectColor:) forControlEvents:UIControlEventTouchUpInside];
[_colorView addSubview:control];
}
}
- (void)_createLineWidthView {
_lineWidthView = [[UIView alloc] initWithFrame:CGRectMake(0, CGRectGetMaxY(_buttonView.frame), 320, 60)];
_lineWidthView.hidden = YES;
_lineWidthView.backgroundColor = [UIColor clearColor];
[self addSubview:_lineWidthView];
_lineWidthArray = @[@1.0,@3.0,@5.0,@8.0,@10.0,@15.0,@20.0];
CGFloat width = 320/_lineWidthArray.count;
for (int i=0; i<_lineWidthArray.count; i++) {
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
NSString *title = [NSString stringWithFormat:@"% 點",_lineWidthArray[i]];
[button setTitle:title forState:UIControlStateNormal];
button.frame = CGRectMake(i*width, 5, width-5, 50);
button.tag = i;
[button addTarget:self action:@selector(selectLineWidth:) forControlEvents:UIControlEventTouchUpInside];
[_lineWidthView addSubview:button];
}
}
#pragma mark - 按鈕事件
- (void)tapButton:(SelectButton *)button {
// NSLog(@"%d",button.tag);
//1.之前的Button設置爲不選中
self.selectButton.selectedState = NO;
//2.當前的button設置爲選中
button.selectedState = YES;
//3.記錄當前選中的button
self.selectButton = button;
//4.判斷按鈕
switch (button.tag) {
case 0:
_colorView.hidden = NO;
_lineWidthView.hidden = YES;
break;
case 1:
_colorView.hidden = YES;
_lineWidthView.hidden = NO;
break;
case 2:
//橡皮
_selectEarser();
break;
case 3:
_selectUndo();
break;
case 4:
_selectClear();
break;
default:
break;
}
}
- (void)selectColor:(UIControl *)control {
UIColor *selectColor = _colorArray[control.tag];
// NSLog(@"%@",selectColor);
//將選中顏色的事件，傳遞給外部
//[代理對象 協議方法1];
if (_colorBlock != nil) {
_colorBlock(selectColor);
}
}
- (void)selectLineWidth:(UIButton *)button {
NSNumber *lineWidth = _lineWidthArray[button.tag];
//將選中的線寬事件，傳遞給外部
//[代理對象 協議方法2];
if (_lineBlock) {
_lineBlock([lineWidth floatValue]);
}
}
@implementation SelectButton
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
self.font = [UIFont systemFontOfSize:14.0];
}
return self;
}
//顯示屬性修改之後，調用setNeedsDisplay 重新繪製
- (void)setFont:(UIFont *)font {
if (_font != font) {
_font = font;
[self setNeedsDisplay];
}
}
- (void)setTitle:(NSString *)title {
if (_title != title) {
_title = title;
[self setNeedsDisplay];
}
}
- (void)setSelectedState:(BOOL)selectedState {
_selectedState = selectedState;
[self setNeedsDisplay];
}
#pragma mark - 繪製
- (void)drawRect:(CGRect)rect {
CGRect titleFrame = rect;
titleFrame.origin.y += 10;
//1.將標題繪製上
[self.title drawInRect:titleFrame withFont:self.font lineBreakMode:NSLineBreakByTruncatingTail alignment:NSTextAlignmentCenter];
//2.繪製選中的線條
if (self.selectedState) {
CGRect frame = CGRectMake(0, CGRectGetHeight(rect)-2, CGRectGetWidth(rect), 2);
[[UIColor redColor] setFill];
UIRectFill(frame);
}
}
}
}];
}