In this section we’ll subclass NSView to create a class called BarView to demonstrate a scaled coordinate system. A BarView object will display a simple bar graph that draws a graph between the range to 100, depending on the value of a slider. It will scale its coordinate system and control redrawing with the appropriate display methods. We’ll use the same ViewDemo project we created for BlackView so that we won’t have to go through the project-creation process again.
Back in IB, remove all BlackView instances from your ViewDemo window (select them one by one and type Control-X).
Select the NSView class under the Classes tab of IB’s Nib File window and subclass NSView by choosing IB’s Classes → Subclass NSView menu command.
Change the name of the new subclass from “MyView” to “BarView”.
Drag a CustomView icon from IB’s Cocoa-Containers palette and drop it in the empty window.
Type Command-1, then change the class of the CustomView to BarView in the NSView (Custom) Info panel.
Resize the BarView instance, as shown in Figure 15-5.
Drag a vertical slider from IB’s Cocoa-Other palette and drop it next to the BarView, as shown in Figure 15-5.
With the slider selected, type Command-1 and note that the slider has a default range (Minimum/Maximum) from 0.0 to 100.0 and a Current setting of 50.0.
Change the Current value of the slider to 0.0 in the NSSlider Info panel.
Make sure that the Marker Values Only checkbox is not checked so that you can pick any (float) value between 0 and 100.
Make sure that the Continuous checkbox is checked so that the slider updates when you move it, rather than when you let go.
Your window and slider attributes should now look like those in Figure 15-5.
Select BarView under the Classes tab in the
MainMenu.nibwindow and type Command-1 to see the BarView Attributes.Add the takePercentage: action method to the BarView class in the BarView Class inspector. (By the way, you cannot select the rectangular BarView instance in the window to add outlets or action methods because that represents an instance, not the BarView class).
Control-drag from the slider to the BarView instance and connect with the takePercentage: action method.
Select BarView under the Classes tab in the
MainMenu.nibwindow again.Choose Classes → Create Files for BarView and insert the class files into the ViewDemo project.
Back in PB, insert the lines shown here in bold into
BarView.h:#import <Cocoa/Cocoa.h> @interface BarView : NSView { float percentage; }- (id)initWithFrame:(NSRect)r; - (BOOL)isOpaque; - (void)drawRect:(NSRect)aRect; - (IBAction)takePercentage:(id)sender; @end
It’s not necessary to place
declarations of overridden
methods (e.g., drawRect:) in the
class interface (.h) file, but
it’s good programming style because doing so
documents that they were overridden.
The takePercentage: method is the action that the slider takes when it’s been manipulated. It first gets the value of the slider using [sender floatValue] and then invokes the setPercentage: method (shown in the following example) to set the percentage (size) of the on-screen BarView instance.
Insert the following four new method implementations into
BarView.m:- (id)initWithFrame:(NSRect)r // Designated initializer{[super initWithFrame:r];[self setBoundsSize:NSMakeSize(100.0,1.0)];return self;}- (BOOL)isOpaque{return YES;}- (void)drawRect:(NSRect)aRect{[ [NSColor blackColor] set];NSRectFill( NSMakeRect(0,0,percentage,1) );NSDrawWindowBackground(NSMakeRect(percentage,0,100-percentage,1) );}- (void)setPercentage:(float)val{percentage = val;[self setNeedsDisplay:YES];}
The initWithFrame:
method in BarView.m
invokes the inherited setBoundsSize:
method to scale
BarView’s drawing coordinates so that width scales 0
to 100 (to match the slider control) and height scales 0 to 1.0. This
makes it very easy for the drawRect:
method to draw the bar graph. TheisOpaque
method tells the BarView superview(s)
that this method is opaque. The drawRect: method draws a black rectangle from
the left of the NSView to the line specified by the variable
percentage, then paints the rest of the NSView
with the window background.
The setPercentage: method sets the
percentage instance variable and tells the
NSView’s superclass that redisplay is needed.
Even though it’s not used, the setPercentage: method is included in the class interface so that you can set the value in the BarView directly from an Objective-C statement in your program, without having to use an NSControl object such as a slider. When designing classes, you should include accessor methods for all of the instance variables that a user of your class might want to access or modify, even if the particular application you are working on does not require those accessor methods. This improves code reusability.
Build and run ViewDemo with BarView. Save all pertinent files when prompted.
Drag the slider knob up and the BarView will get wider, as shown in Figure 15-6.
