Cocoa绘图技术从基础到高级应用

### Cocoa绘图进阶：从基础到高级技巧 #### 1. LOLView类的构建 在开发过程中，LOLView类需要包含一些属性来存储用户输入的值。为了在值发生变化时触发重绘，我们需要自己实现属性的setter方法，并将属性标记为nonatomic。以下是具体的代码实现： ```objc // LOLView.h: #import <Cocoa/Cocoa.h> @interface LOLView : NSView @property (strong, nonatomic) NSImage *image; @property (copy, nonatomic) NSString *text; @end // LOLView.m: #import "LOLView.h" @implementation LOLView - (id)initWithFrame:(NSRect)frame { self = [super initWithFrame:frame]; if (self) { // Initialization code here. } return self; } - (void)drawRect:(NSRect)dirtyRect { // Drawing code here. } - (void)setImage:(NSImage *)i { if (![i isEqual:_image]) { _image = i; [self setNeedsDisplay:YES]; } } - (void)setText:(NSString *)t { if (![t isEqual:_text]) { _text = [t copy]; [self setNeedsDisplay:YES]; } } ``` 在上述代码中，我们在`LOLView.h`文件中声明了`image`和`text`两个属性，在`LOLView.m`文件中实现了初始化方法、绘图方法以及属性的setter方法。在`setText:`方法中，我们对传入的`NSString`对象进行了显式复制，这是因为在属性声明中我们使用了`copy`关键字。 #### 2. 绘制位图 接下来，我们要在`drawRect:`方法中添加代码来绘制图像。具体步骤如下： 1. 创建一个与图像大小相同的矩形`srcImageRect`。 2. 调用图像的`drawAtPoint:fromRect:operation:fraction:`方法将图像复制到当前图形上下文中。 ```objc - (void)drawRect:(NSRect)dirtyRect { NSRect srcImageRect = NSMakeRect(0, 0, [self.image size].width, [self.image size].height); [self.image drawAtPoint:[self bounds].origin fromRect:srcImageRect operation:NSCompositeCopy fraction:1.0]; } ``` 这个方法会将整个图像复制到视图的左下角。运行应用程序，将一张图像拖入图像框中，你会发现只能看到图像的左下角部分。 #### 3. 实现滚动功能 为了能够查看整个图像，我们可以使用Cocoa的`NSScrollView`类。具体操作步骤如下： 1. 在Xcode中打开nib文件，选择LOLView，然后通过菜单`Editor ➤ Embed in ➤ Scroll View`将其嵌入到滚动视图中。 2. 调整滚动视图的位置和大小，使其几乎填满窗口的宽度，并在其他控件上方留出适当的边距。 3. 选中滚动视图，打开属性检查器，勾选“Magnification”选项的“Allow”复选框，以启用缩放功能。 4. 在`setImage:`方法中添加代码，使LOLView的大小与图像大小匹配。 ```objc - (void)setImage:(NSImage *)i { if (![i isEqual:_image]) { if (i) { NSRect newImageFrame = NSMakeRect(0, 0, [i size].width, [i size].height); [self setFrame:newImageFrame]; } _image = i; [self setNeedsDisplay:YES]; } } ``` 保存所有工作并运行应用程序，现在你可以通过滚动条查看整个图像，并且如果硬件支持，还可以使用捏合手势进行缩放。 #### 4. 绘制文本 最后一步是在图像上叠加文本。在LOLcats社区中，通常使用Impact字体，白色文本搭配黑色阴影。为了选择合适的字体大小，我们需要动态测试不同的字体大小，直到文本宽度不超过视图宽度。以下是具体的代码实现： ```objc - (void)drawRect:(NSRect)dirtyRect { // Drawing code here. NSRect srcImageRect = NSMakeRect(0, 0, [self.image size].width, [self.image size].height); [self.image drawAtPoint:[self bounds].origin fromRect:srcImageRect operation:NSCompositeCopy fraction:1.0]; if (self.text != nil && [self.text length] > 0) { NSPoint textLocation = NSMakePoint(0,0); NSShadow *textShadow = [[NSShadow alloc] init]; [textShadow setShadowOffset:NSMakeSize(0,0)]; [textShadow setShadowColor:[NSColor blackColor]]; [textShadow setShadowBlurRadius:10]; NSMutableDictionary *textAttributes = [NSMutableDictionary dictionaryWithObjectsAndKeys: [NSFont fontWithName:@"Impact" size:40], NSFontAttributeName, [NSColor whiteColor], NSForegroundColorAttributeName, textShadow, NSShadowAttributeName, nil]; // find the optimal size CGFloat fontSize; NSSize testSize = NSMakeSize(0, 0); for(fontSize=1; testSize.width < [self.image size].width; fontSize*=2) ```