The canvas and the brush
A useful way of envisioning how Cocoa drawing works is to think of how you would draw anything else. You'll need a surface to draw onto and something to draw with -- in other words, a canvas and a brush. In Cocoa, the canvas is the class
NSView, and the brush is the class
NSBezierPath. Let's first look at how we set up our canvas in Project Builder and Interface Builder, and then we'll get to the fun part of actually drawing.
Setting up the canvas
As I said above, Cocoa's canvas is the class
NSView is a class that provides a mechanism for defining an area on the screen to draw to, as well as all of the machinery behind drawing.
NSView is a beast of a class, and to go into a detailed description of the inner workings of this beast would be an exercise in duplicating the excellent documentation provided by Apple, and would make this column entirely too long. So I refer you to the
NSView class documentation for a detailed understanding of the workings of this class, and here we will talk about how to use it.
We never directly interact with an instance of
NSView -- it is an abstract class. Rather, we subclass
NSView and add all of our drawing code to the subclass, and interact with the subclass. Project Builder provides a means for creating a skeletal
The first thing we need to do is to create a new project. Call your new project
CocoaDrawing. After the new project opens up, go to the File menu and select "New File". In the New File dialog select "Objective-C NSView Subclass" as the type of file you want to create. Click on Next, and name your new file
CocoaDrawing.m. Make sure that
CocoaDrawing.h is set to be created as well. Click Finish, and you have your
NSView subclass file.
The next step is to let our application know about our subclass of
NSView. This is done within Interface Builder (IB). Open Interface Builder by double-clicking on the file
MainMenu.nib in your Project. With Interface Builder open, we do a neat little trick of adding our new class,
CocoaDrawing, to those classes that IB knows about. We do this by dragging the file
CocoaDrawing.h from our project window onto the IB Instances pane.
This will add our new class,
CocoaDrawing, to the list in the Classes pane as shown in the image below. This process of adding a class to IB can be done with any class you create in Project Builder. In fact, this is the reason for all of the
IBAction tags we see in our IB-generated code, so IB can make available any indicated outlets and actions.
The next step is to drag a
CustomView container onto our application's window. From the Cocoa Containers Palette, drag a
Custom View object onto the window. With
CustomView selected, open the Show Info panel, and under Attributes you should see
CocoaDrawing in the class list. Select it and the name of the view will change to
CocoaDrawing, and the contents of this view will now be controlled by the code in
CocoaDrawing. We're now set and ready to learn about the Cocoa paintbrush. Save your work in IB, return to Project Builder, and move onto the next section.