UIView上签名绘图示例 .-CSDN博客

本文介绍了一款iPad上的绘图软件，特别关注一款由小朋友开发的涂鸦应用，并提供了示例代码。代码展示了如何在Canvas2D视图中实现基本的绘画功能，包括初始化、绘制线条、响应触摸事件等。

ipad上绘图的软件不错吧，以有有一个小朋友写了一个涂鸦软件，大买呀。这儿有一个示例。

Canvas2D.h

view plain copy to clipboard print ?

#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>
@interface Canvas2D : UIView {
NSMutableArray* arrayStrokes;
UIColor *currentColor;
}
@property (retain) NSMutableArray* arrayStrokes;
@end

Canvas2D.m

view plain copy to clipboard print ?

#import "Canvas2D.h"
@implementation Canvas2D
@synthesize arrayStrokes;
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
self.arrayStrokes = [NSMutableArray array];
}
return self;
}
- (id)initWithCoder:(NSCoder *)aDecoder {
if ((self = [super initWithCoder:aDecoder])) {
self.arrayStrokes = [NSMutableArray array];
}
return self;
}
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
// Drawing code
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(context, 2.0);
CGColorSpaceRef colorspace = CGColorSpaceCreateDeviceRGB();
CGFloat components[] = {0.0, 0.0, 1.0, 1.0};
CGColorRef color = CGColorCreate(colorspace, components);
CGContextSetStrokeColorWithColor(context, color);
CGContextMoveToPoint(context, 0, 0);
CGContextAddLineToPoint(context, 300, 400);
CGContextStrokePath(context);
CGColorSpaceRelease(colorspace);
CGColorRelease(color);
if (self.arrayStrokes)
{
int arraynum = 0;
// each iteration draw a stroke
// line segments within a single stroke (path) has the same color and line width
for (NSDictionary *dictStroke in self.arrayStrokes)
{
NSArray *arrayPointsInstroke = [dictStroke objectForKey:@"points"];
UIColor *color = [dictStroke objectForKey:@"color"];
float size = [[dictStroke objectForKey:@"size"] floatValue];
[color set]; // equivalent to both setFill and setStroke
// draw the stroke, line by line, with rounded joints
UIBezierPath* pathLines = [UIBezierPath bezierPath];
CGPoint pointStart = CGPointFromString([arrayPointsInstroke objectAtIndex:0]);
[pathLines moveToPoint:pointStart];
for (int i = 0; i < (arrayPointsInstroke.count - 1); i++)
{
CGPoint pointNext = CGPointFromString([arrayPointsInstroke objectAtIndex:i+1]);
[pathLines addLineToPoint:pointNext];
}
pathLines.lineWidth = size;
pathLines.lineJoinStyle = kCGLineJoinRound;
pathLines.lineCapStyle = kCGLineCapRound;
[pathLines stroke];
arraynum++;
}
}
}
// Start new dictionary for each touch, with points and color
- (void) touchesBegan:(NSSet *) touches withEvent:(UIEvent *) event
{
NSMutableArray *arrayPointsInStroke = [NSMutableArray array];
NSMutableDictionary *dictStroke = [NSMutableDictionary dictionary];
[dictStroke setObject:arrayPointsInStroke forKey:@"points"];
[dictStroke setObject:[UIColor blackColor] forKey:@"color"];
[dictStroke setObject:[NSNumber numberWithFloat:5] forKey:@"size"];
CGPoint point = [[touches anyObject] locationInView:self];
[arrayPointsInStroke addObject:NSStringFromCGPoint(point)];
[self.arrayStrokes addObject:dictStroke];
}
// Add each point to points array
- (void) touchesMoved:(NSSet *) touches withEvent:(UIEvent *) event
{
CGPoint point = [[touches anyObject] locationInView:self];
CGPoint prevPoint = [[touches anyObject] previousLocationInView:self];
NSMutableArray *arrayPointsInStroke = [[self.arrayStrokes lastObject] objectForKey:@"points"];
[arrayPointsInStroke addObject:NSStringFromCGPoint(point)];
CGRect rectToRedraw = CGRectMake(\
((prevPoint.x>point.x)?point.x:prevPoint.x)-5,\
((prevPoint.y>point.y)?point.y:prevPoint.y)-5,\
fabs(point.x-prevPoint.x)+2*5,\
fabs(point.y-prevPoint.y)+2*5\
);
[self setNeedsDisplayInRect:rectToRedraw];
}
// Send over new trace when the touch ends
- (void) touchesEnded:(NSSet *) touches withEvent:(UIEvent *) event
{
}
- (void)dealloc
{
[arrayStrokes release];
[super dealloc];
}
@end

#import "Canvas2D.h"@implementation Canvas2D@synthesize arrayStrokes;- (id)initWithFrame:(CGRect)frame{    self = [super initWithFrame:frame];    if (self) {        // Initialization codeself.arrayStrokes = [NSMutableArray array];    }    return self;}- (id)initWithCoder:(NSCoder *)aDecoder {    if ((self = [super initWithCoder:aDecoder])) {self.arrayStrokes = [NSMutableArray array];    }    return self;}// Only override drawRect: if you perform custom drawing.// An empty implementation adversely affects performance during animation.- (void)drawRect:(CGRect)rect{    // Drawing codeCGContextRef context = UIGraphicsGetCurrentContext();CGContextSetLineWidth(context, 2.0);CGColorSpaceRef colorspace = CGColorSpaceCreateDeviceRGB();CGFloat components[] = {0.0, 0.0, 1.0, 1.0};CGColorRef color = CGColorCreate(colorspace, components);CGContextSetStrokeColorWithColor(context, color);CGContextMoveToPoint(context, 0, 0);CGContextAddLineToPoint(context, 300, 400);CGContextStrokePath(context);CGColorSpaceRelease(colorspace);CGColorRelease(color);if (self.arrayStrokes){int arraynum = 0;// each iteration draw a stroke// line segments within a single stroke (path) has the same color and line widthfor (NSDictionary *dictStroke in self.arrayStrokes){NSArray *arrayPointsInstroke = [dictStroke objectForKey:@"points"];UIColor *color = [dictStroke objectForKey:@"color"];float size = [[dictStroke objectForKey:@"size"] floatValue];[color set];		// equivalent to both setFill and setStroke// draw the stroke, line by line, with rounded jointsUIBezierPath* pathLines = [UIBezierPath bezierPath];CGPoint pointStart = CGPointFromString([arrayPointsInstroke objectAtIndex:0]);[pathLines moveToPoint:pointStart];for (int i = 0; i < (arrayPointsInstroke.count - 1); i++){CGPoint pointNext = CGPointFromString([arrayPointsInstroke objectAtIndex:i+1]);[pathLines addLineToPoint:pointNext];}pathLines.lineWidth = size;pathLines.lineJoinStyle = kCGLineJoinRound;pathLines.lineCapStyle = kCGLineCapRound;[pathLines stroke];arraynum++;}}}// Start new dictionary for each touch, with points and color- (void) touchesBegan:(NSSet *) touches withEvent:(UIEvent *) event{NSMutableArray *arrayPointsInStroke = [NSMutableArray array];NSMutableDictionary *dictStroke = [NSMutableDictionary dictionary];[dictStroke setObject:arrayPointsInStroke forKey:@"points"];[dictStroke setObject:[UIColor blackColor] forKey:@"color"];[dictStroke setObject:[NSNumber numberWithFloat:5] forKey:@"size"];CGPoint point = [[touches anyObject] locationInView:self];[arrayPointsInStroke addObject:NSStringFromCGPoint(point)];[self.arrayStrokes addObject:dictStroke];}// Add each point to points array- (void) touchesMoved:(NSSet *) touches withEvent:(UIEvent *) event{CGPoint point = [[touches anyObject] locationInView:self];CGPoint prevPoint = [[touches anyObject] previousLocationInView:self];NSMutableArray *arrayPointsInStroke = [[self.arrayStrokes lastObject] objectForKey:@"points"];[arrayPointsInStroke addObject:NSStringFromCGPoint(point)];CGRect rectToRedraw = CGRectMake(\ ((prevPoint.x>point.x)?point.x:prevPoint.x)-5,\ ((prevPoint.y>point.y)?point.y:prevPoint.y)-5,\ fabs(point.x-prevPoint.x)+2*5,\ fabs(point.y-prevPoint.y)+2*5\ );[self setNeedsDisplayInRect:rectToRedraw];}// Send over new trace when the touch ends- (void) touchesEnded:(NSSet *) touches withEvent:(UIEvent *) event{}- (void)dealloc{[arrayStrokes release];    [super dealloc];}@end

记得加入QuartzCore.framework

用法: 在xib中的view关联Canvas2D