贝塞尔曲线,听着挺牛气一词,不过下面我们在做画图板的时候就用到贝塞尔绘直线,没用到绘制曲线的功能。如果会点PS的小伙伴会对贝塞尔曲线有更直观的理解。这篇博文的重点不在于如何用使用贝塞尔曲线,而是利用贝塞尔划线的功能来封装一个画图板。
画图板的截图如下,上面的白板就是我们的画图板,是自己封装好的一个UIView,下面会详细的介绍如何封装这个画图板,下面的控件用来控制我们画图板的属性以及Undo,Redo和保存功能。点击保存时会把绘制的图片保存到手机的相册中。下面是具体的实现方案。
一.封装画图板
其实上面的白板就是一继承于UiView的一个子类,我们可以在这个子类中添加我们画图板相应的属性和方法,然后实例化成对象添加到ViewController中,当然为了省事添加白板的时候是通过storyboard来完成的,读者也可以自己实例化然后手动的添加到相应的ViewController中。
1.封装白板的第一步是新建一个UIView的子类MyView,然后添加相应的属性和方法。MyView.h中的代码如下,代码具体意思请参照注释
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
#import 2 @interface MyView : UIView //用来设置线条的颜色 @property (nonatomic, strong) UIColor *color; //用来设置线条的宽度 @property (nonatomic, assign) CGFloat lineWidth; //用来记录已有线条 @property (nonatomic, strong) NSMutableArray *allLine; //初始化相关参数 -(void)initMyView; //unDo操作 -(void)backImage; //reDo操作 -(void)forwardImage; @end |
2、上面的代码是对外的接口,有些属性我们是写在MyView.m的延展中以实现私有的目的,MyView延展部分如下:
1 2 3 4 5 6 |
@interface MyView() //声明贝塞尔曲线 @property(nonatomic, strong) UIBezierPath *bezier; //存储Undo出来的线条 @property(nonatomic, strong) NSMutableArray *cancleArray; @end |
3.下面的代码就是实现部分的代码了,会根据不同功能给出相应的说明
(1).初始化我们的白板,给线条指定默认颜色和宽度并且给相应的变量分配内存空间,初始化代码如下:
1 2 3 4 5 6 7 8 |
//进行一些初始化工作 -(void)initMyView { self.color = [UIColor redColor]; self.lineWidth = 1; self.allLine = [NSMutableArray arrayWithCapacity:50]; self.cancleArray = [NSMutableArray arrayWithCapacity:50]; } |
(2)Undo功能的封装,相当于两个栈,把显示的线条出栈,进入为不显示的线条栈中,每执行一次此操作显示线条栈中的元素会少一条而不显示线条栈中会多一条,大致就这个意思吧,代码如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
//UnDo操作 -(void)backImage { if (self.allLine.count > 0) { int index = self.allLine.count - 1; [self.cancleArray addObject:self.allLine[index]]; [self.allLine removeObjectAtIndex:index]; [self setNeedsDisplay ]; } } |
(3)Redo操作和Undo操作相反,从未显示栈中取出元素放入显示的栈中,代码中的栈我们是用数组来表示的,代码如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
//ReDo操作 -(void)forwardImage { if (self.cancleArray.count > 0) { 有更直观的理解。这篇博文的重点不在于如何用使用贝塞尔曲线,而是利用贝塞尔划线的功能来封装一个画图板。
画图板的截图如下,上面的白板就是我们的画图板,是自己封装好的一个UIView,下面会详细的介绍如何封装这个画图板,下面的控件用来控制我们画图板的属性以及Undo,Redo和保存功能。点击保存时会把绘制的图片保存到手机的相册中。下面是具体的实现方案。
一.封装画图板 其实上面的白板就是一继承于UiView的一个子类,我们可以在这个子类中添加我们画图板相应的属性和方法,然后实例化成对象添加到ViewController中,当然为了省事添加白板的时候是通过storyboard来完成的,读者也可以自己实例化然后手动的添加到相应的ViewController中。 1.封装白板的第一步是新建一个UIView的子类MyView,然后添加相应的属性和方法。MyView.h中的代码如下,代码具体意思请参照注释
2、上面的代码是对外的接口,有些属性我们是写在MyView.m的延展中以实现私有的目的,MyView延展部分如下:
3.下面的代码就是实现部分的代码了,会根据不同功能给出相应的说明 (1).初始化我们的白板,给线条指定默认颜色和宽度并且给相应的变量分配内存空间,初始化代码如下:
(2)Undo功能的封装,相当于两个栈,把显示的线条出栈,进入为不显示的线条栈中,每执行一次此操作显示线条栈中的元素会少一条而不显示线条栈中会多一条,大致就这个意思吧,代码如下:
(3)Redo操作和Undo操作相反,从未显示栈中取出元素放入显示的栈中,代码中的栈我们是用数组来表示的,代码如下:
|