ios画画板

Posted 2020-06-08

  1 @interface NJView ()
  2 /**
  3  *  定义一个大数组(大数组中保存小数组, 每一个小数组保存一条直线所有的点)
  4  */
  5 @property (nonatomic, strong) NSMutableArray *totalPoints;
  6 
  7 @end
  8 
  9 @implementation NJView
 10 
 11 - (NSMutableArray *)totalPoints
 12 {
 13     if (_totalPoints == nil) {
 14         _totalPoints = [NSMutableArray array];
 15     }
 16     return _totalPoints;
 17 }
 18 
 19 // 开始触摸
 20 - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
 21 {
 22 //    NSLog(@"touchesBegan");
 23     
 24     // 1.获取手指对应UITouch对象
 25     UITouch *touch = [touches anyObject];
 26     // 2.通过UITouch对象获取手指触摸的位置
 27     CGPoint startPoint = [touch locationInView:touch.view];
 28     
 29     // 3.将手指触摸的起点存储到数组中
 30     // [self.points addObject:[NSValue valueWithCGPoint:startPoint]];
 31     
 32     // 3.创建一个小数组,用于保存当前路径所有的点
 33     NSMutableArray *subPoints = [NSMutableArray array];
 34     // 4.将手指触摸的起点存储到小数组中
 35     [subPoints addObject:[NSValue valueWithCGPoint:startPoint]];
 36     // 5.将小数组存储到大数组中
 37     [self.totalPoints addObject:subPoints];
 38 
 39 }
 40 // 移动
 41 - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
 42 {
 43     // 1.获取手指对应UITouch对象
 44     UITouch *touch = [touches anyObject];
 45     // 2.通过UITouch对象获取手指触摸的位置
 46     CGPoint movePoint = [touch locationInView:touch.view];
 47     // 3.将手指移动时触摸的点存储到数组中
 48     // [self.points addObject:[NSValue valueWithCGPoint:movePoint]];‘
 49     // 4.从大数组中取出当前路径对应的小数组
 50     NSMutableArray *subPoints = [self.totalPoints lastObject];
 51     // 5.将手指移动时触摸的点存储到小数组中
 52     [subPoints addObject:[NSValue valueWithCGPoint:movePoint]];
 53     
 54     
 55     // 6.调用drawRect方法重回视图
 56     [self setNeedsDisplay];
 57 
 58 }
 59 
 60 // 离开view(停止触摸)
 61 - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
 62 {
 63     // 1.获取手指对应UITouch对象
 64     UITouch *touch = [touches anyObject];
 65     // 2.通过UITouch对象获取手指触摸的位置
 66     CGPoint endPoint = [touch locationInView:touch.view];
 67 
 68     // 3.将手指离开时触摸的点存储到数组中
 69     // [self.points addObject:[NSValue valueWithCGPoint:endPoint]];
 70     
 71     // 4.从大数组中取出当前路径对应的小数组
 72     NSMutableArray *subPoints = [self.totalPoints lastObject];
 73     // 5.将手指移动时触摸的点存储到小数组中
 74     [subPoints addObject:[NSValue valueWithCGPoint:endPoint]];
 75     
 76     // 6.调用drawRect方法重回视图
 77     [self setNeedsDisplay];
 78 
 79 }
 80 
 81 // 画线
 82 - (void)drawRect:(CGRect)rect
 83 {
 84    
 85     // 1.获取上下文
 86     CGContextRef ctx = UIGraphicsGetCurrentContext();
 87     // 遍历大数组,取出所有的小数组(每一个小数组代表一条线段)
 88     for (NSMutableArray *subPointArray in self.totalPoints) {
 89         // 遍历小数组, 取出小数组中所有的点
 90         for (int index = 0; index < subPointArray.count; index++) {
 91             // 1.取出小数组中的每一个点
 92              CGPoint point = [subPointArray[index] CGPointValue];
 93             // 2.绘制线段
 94             if (0 == index) {
 95                 // 2.1. 设置线段的起点
 96                 CGContextMoveToPoint(ctx, point.x, point.y);
 97             }else
 98             {
 99                 // 2.2.设置线段的终点
100                 CGContextAddLineToPoint(ctx, point.x, point.y);
101             }
102         }
103     }
104     
105     /*
106     for (int index = 0; index < self.points.count; index++) {
107         CGPoint point = [self.points[index] CGPointValue];
108         // 2.绘制线段
109         if (0 == index) {
110             // 2.1. 设置线段的起点
111             CGContextMoveToPoint(ctx, point.x, point.y);
112         }else
113         {
114             // 2.2.设置线段的终点
115             CGContextAddLineToPoint(ctx, point.x, point.y);
116         }
117 
118     }
119      */
120     
121     CGContextSetLineCap(ctx, kCGLineCapRound);
122     CGContextSetLineJoin(ctx, kCGLineJoinRound);
123     CGContextSetLineWidth(ctx, 10);
124     
125     // 3.渲染
126     CGContextStrokePath(ctx);
127     
128 }
129 
130 - (void)clearView
131 {
132     [self.totalPoints removeAllObjects];
133     [self setNeedsDisplay];
134 }
135 - (void)backView
136 {
137     [self.totalPoints removeLastObject];
138     [self setNeedsDisplay];
139 }