TweetFollow Us on Twitter

Screen Savers in Cocoa

Volume Number: 20 (2004)
Issue Number: 6
Column Tag: Programming

Screen Savers in Cocoa

by Scott Knaster

One of the classic mantra-like goals for computer science over the past 20 years or so has been to "Make simple things simple, and complex things possible". Programming with Cocoa has a sometimes-complex learning curve, but once you've swerved through that curve, there are definitely a bunch of things that are much easier to accomplish than they were in the old pre-OS X world we knew and occasionally loved.

One of the classic mantra-like goals for computer science over the past 20 years or so has been to "Make simple things simple, and complex things possible". Programming with Cocoa has a sometimes-complex learning curve, but once you've swerved through that curve, there are definitely a bunch of things that are much easier to accomplish than they were in the old pre-OS X world we knew and occasionally loved. Writing a screen saver is a perfect example: it should be simple. Most typical OS 9 application programmers never dipped their toes into the slightly wacky world of screen savers, but with Cocoa in OS X, implementing a screen saver is well within everybody's grasp. In this month's column, we'll take a look at how to get your very own screen saver up and, er, saving.

Here's What We're Gonna Do

Let's start by taking a look at the process for creating a screen saver in OS X. Here are the broad steps:

  • Create a new screen saver project in Xcode.
  • Edit our .h file.
  • Override methods and write other code in our .m file.
  • Build the project to create a .saver package.
  • Install the .saver package by putting it into the Library/Screen Savers/ folder.
  • Open System Preferences and see a preview of our screen saver.
  • Enjoy the savings!

We'll go through each of these steps in greater depth now.

Little Help

The basic magic that makes screen savers so easy is the Screen Saver framework in Cocoa. This framework defines the ScreenSaverView class, which is a subclass of NSView. By creating your own subclass of ScreenSaverView and adding some code, you define your screen saver. The Screen Saver framework also defines the class ScreenSaverDefaults, which you can use for handling preferences for your saver. Along with these classes, the framework provides some handy utility functions you can use in your code.

We'll go over some of the most interesting methods and functions in the ScreenSaverView class. You will rarely call methods defined by ScreenSaverView - most of the work is creating your own subclass and override some methods.

initWithFrame:isPreview:

- (id)initWithFrame:(NSRect)frame isPreview:(BOOL)isPreview

You override initWithFrame in your ScreenSaverView subclass. The system calls initWithFrame when the screen saver is about take over the screen or is selected in System Preferences. The frame parameter is the frame rectangle for the view. The isPreview parameter tells whether the screen saver is actually being invoked or is merely being asked to preview itself in System Preferences (as shown in Figure 1).


Figure 1. You can preview the screen saver in a little box in System Preferences. In your code, you can tell whether the screen saver is drawing full-screen or in the preview box.

startAnimation

- (void) startAnimation

The system calls startAnimation right before the screen saver is about to start drawing. You should override startAnimation to set up your screen saver's initial state, such as setting line widths or loading images. You should call the inherited implementation, or bad things might happen, such as incorrect drawing, or all water on earth instantaneously evaporating.

animateOneFrame

- (void) animateOneFrame

This is where your screen saver gets to show off its amazing graphical skills. Mac OS X asks your screen saver to do its drawing by calling animateOneFrame repeatedly. You can actually do your drawing in animateOneFrame or in drawRect, or even a little in both places. If you make any changes here that require further redrawing, your implementation should call setNeedsDisplay:YES, which will cause drawRect to be called.

drawRect

- (void) drawRect:(NSRect)rect 

Override drawRect to draw the screen saver view. You can do your drawing in animateOneFrame, or you can do some or all of it here. rect is the rectangle you're drawing into, which is handy to have when you want to erase the view and start drawing afresh.

stopAnimation

- (void) stopAnimation 

When Mac OS X wants your screen saver to stop doing its thing, it calls stopAnimation. You can override stopAnimation to release resources or do any other cleanup you want before your screen saver goes away.

Saving Time

Now that you're familiar with the cast of characters in ScreenSaverView, let's go ahead and code up our screen saver. To start, we'll open Xcode and create a new project of type Screen Saver (see Figure 2).


Figure 2. Creating a new Screen Saver project gets you started with the Screen Saver framework, including your own subclass of ScreenSaverView.

This proves that Xcode already knows about the screen saver framework, which saves us plenty of work. Our new project already contains a subclass of ScreenSaverView, and we already have the usual .h and .m files. We'll edit the .h file that Xcode gives us until it looks like this:

#import <ScreenSaver/ScreenSaver.h>


@interface SaveyerView : ScreenSaverView 
{
   NSBezierPath *path;
}


@end

The header file is pretty darn basic. All we do here is create a subclass of ScreenSaverView and add an NSBezierPath object to keep track of what we're drawing.

Now let's get into the implementation files and see what we can find. When we told Xcode to create a new ScreenSaver project, it start us off with some code, including the implementation for initWithFrame:isPreview:, the designated initializer. In this case, we're able to use the supplied code for initWithFrame without any changes:

- (id)initWithFrame:(NSRect)frame isPreview:(BOOL)isPreview
{
    self = [super initWithFrame:frame isPreview:isPreview];
    if (self) {
        [self setAnimationTimeInterval:1/30.0];
            // Draw 30 frames per second
    }
    return self;

The code here starts by calling the inherited implementation. After that, we use setAnimationTimeInterval to tell Mac OS X that we want our screen saver to draw 30 frames per second. As I mentioned, this is the default code that Xcode writes for this method. You can modify it if you want to perform some other task when the screen saver starts up. For example, if your screen saver has user-settable options, you can handle them here.

Next, we'll take a look at our startAnimation method, which the system calls right before asking our screen saver to start drawing. Our implementation of startAnimation begins by calling the inherited implementation. Then, we create our Bezier path and choose a nifty line join style:

- (void)startAnimation
{
   NSPoint x;

   [super startAnimation];
	
   path = [[NSBezierPath alloc] init];
      // We'll use a Bezier path for drawing

   [path setLineJoinStyle: NSRoundLineJoinStyle];	
      // Just for fun, connect the lines with
      // a round joint

When the system asks our screen saver to get ready to draw, we can call the view's isPreview method to see if we're being asked to draw on the full screen or in the little preview box in System Preferences (as shown back in Figure 1).

We can use the result of isPreview to make decisions about just what to draw. In our screen saver, we'll make the lines skinny for the preview, and fatter for the real, full-screen version:

   if ([self isPreview])
      // When drawing a preview, make the lines
      // much thinner than when saving screens.
   {
      [path setLineWidth: 0.0];
      // This is the thinnest possible line width
   }
   else
   {
      [path setLineWidth: 10.18];
      // This line width was chosen at random.
      // OK, actually, it's my son's birthdate.
   }

Our last task here is to get the Bezier path started. We'll do that by picking a random starting point and moving the path there:

   x = SSRandomPointForSizeWithinRect 
         (NSMakeSize (0,0), [self bounds]);
      // Call utility function to get a random point

   [path moveToPoint:x];
      // Start the path at the random point
}

We get a random point by calling SSRandomPointForSizeWithinRect, a handy function provided by the screen saver framework for just this purpose. Hooray for handy functions! Then, we simply move the path pen to that random point to start it out.

Everything that starts must end, and the next method we define is stopAnimation, which is called when the system doesn't need the screen saver to draw any more. Here's our implementation of stopAnimation:

- (void)stopAnimation
{
   [super stopAnimation];
	
   [path release];
         // Release the path

   path = nil;
         // Tell our screen saver view that there's no path
}

The standard stopAnimation provided by Xcode simply calls the inherited implementation. In our version, we keep that super call, and add code to release the Bezier path object and set the path instance variable to nil.

Every time the system wants our screen saver to draw another piece, it calls our animateOneFrame method. Let's take a look at that. First, we'll call that convenient SSRandomPointForSizeWithinRect utility function to get another random point:

- (void)animateOneFrame
{
    NSPoint x;
	
   x = SSRandomPointForSizeWithinRect 
         (NSMakeSize (0,0), [self bounds]);
            // Get a random point to extend the Bezier path

We want our screen saver to draw a bunch of lines on the screen, and every so often, we want it to erase the lines and start over. Let's say we want 50 lines at a time, in honor of our 50 states. If we haven't reached 50 yet, we add the new random point to the path:

if ([path elementCount] < 50)
      // Draw 50 lines before erasing
      {
         [path lineToPoint: x];
            // If we don't have 50 yet, add the 
            // new point to the line
      }

Once we have 50 points in the path, we want to reset the path by callously discarding all points and then start building it up again:

      else
      {
         [path removeAllPoints];
         [path moveToPoint:x];
            // If we do have 50, clean out the path
            // and get ready to start over
      }

We finish by telling the system that we've messed with the path and it needs to be redrawn by calling the screen saver view's drawRect method. Alternatively, we could do the actual drawing right here in animateOneFrame:

   [self setNeedsDisplay:YES];
      // Tell the system that something has changed
      // and drawRect should be called
}

The actual drawing happens in drawRect, which we'll look at NeXT. We start by calling the inherited drawRect, which by default erases the background to black.

- (void)drawRect:(NSRect)rect
{
   NSColor *color;

   [super drawRect:rect];

We then choose a pretty color, and call set to make sure that the drawing happens in that color. Then we call stroke on the Bezier path object to actually draw the thing:

   color = [NSColor colorWithCalibratedRed:(0.0) 
                  green:(1.0) blue:(1.0) alpha:(1.0)];

   [color set];
      // Set the color to teal. Go Sharks!
	
   [path stroke];
      // Draw the Bezier path 
}

The last method we implement is our version of dealloc. The view's Bezier path is the only allocated object we have to worry about, so our method looks like this:

- (void) dealloc
{
   [path release];
      // Release the Bezier path

   [super dealloc];
}

Put Me In, Coach

When we have all the source code done, we build our project. If everything builds OK, a file with the suffix .saver ends up in the project's build folder. To install the screen saver, start by quitting System Preferences if it's running. Then move or copy the .saver file into the /Library/Screen Savers directory. You can put it in ~/Library/Screen Savers if you want to keep it all to yourself and prevent other users from seeing it.

Once our screen saver is in the folder, you can start System Preferences, click Desktop & Screen Saver, click the Screen Saver tab, and select our screen saver in the list. You should see the skinny lines in the preview mode. Then click Test, and observe the big teal lines with their round elbows. There you go! You can get this month's code at http://www.papercar.com/mt/Jun04.zip

If you're interested in making your own screen savers, there are lots of directions you can go from here. Add user-settable options by overriding the hasConfigureSheet and configureSheet methods. Use random colors. Do some much fancier drawing in your animateOneFrame method - for example, draw shapes, use curveToPoint instead of lineToPoint, or load images from disk. Whatever you do, have fun, and remember: the screen you save may be your own.


Scott Knaster writes books, including the recently published Mac Toys and the brand-new Hacking iPod and iTunes, both from Wiley Publishing. Scott can't read and listen to vocal music at the same time. Scott writes these little bios in the third person. Write to Scott at scottk@mactech.com.

 

Community Search:
MacTech Search:

Software Updates via MacUpdate

Apple iTunes 12.2 - Play Apple Music...
Apple iTunes lets you organize and stream Apple Music, download and watch video and listen to Podcasts. It can automatically download new music, app, and book purchases across all your devices and... Read more
Apple Security Update 2015-005 - For OS...
Apple Security Update 2015-005 is recommended for all users and improves the security of OS X. For detailed information about the security content of this update, please visit: http://support.apple.... Read more
Apple HP Printer Drivers 3.1 - For OS X...
Apple HP Printer Drivers includes the latest HP printing and scanning software for OS X Lion or later. For information about supported printer models, see this page. Version 3.1: The latest printing... Read more
Epson Printer Drivers 3.1 - For OS X 10....
Epson Printer Drivers installs the latest software for your EPSON printer or scanner for OS X Yosemite, OS X Mavericks, OS X Mountain Lion, and OS X Lion. For more information about printing and... Read more
Xcode 6.4 - Integrated development envir...
Xcode provides everything developers need to create great applications for Mac, iPhone, and iPad. Xcode brings user interface design, coding, testing, and debugging into a united workflow. The Xcode... Read more
OS X Yosemite 10.10.4 - Apple's lat...
OS X Yosemite is Apple's newest operating system for Mac. An elegant design that feels entirely fresh, yet inherently familiar. The apps you use every day, enhanced with new features. And a... Read more
Dash 3.0.2 - Instant search and offline...
Dash is an API Documentation Browser and Code Snippet Manager. Dash helps you store snippets of code, as well as instantly search and browse documentation for almost any API you might use (for a full... Read more
FontExplorer X Pro 5.0 - Font management...
FontExplorer X Pro is optimized for professional use; it's the solution that gives you the power you need to manage all your fonts. Now you can more easily manage, activate and organize your... Read more
Typinator 6.6 - Speedy and reliable text...
Typinator turbo-charges your typing productivity. Type a little. Typinator does the rest. We've all faced projects that require repetitive typing tasks. With Typinator, you can store commonly used... Read more
Arq 4.12.1 - Online backup to Google Dri...
Arq is super-easy online backup for the Mac. Back up to your own Google Drive storage (15GB free storage), your own Amazon Glacier ($.01/GB per month storage) or S3, or any SFTP server. Arq backs up... Read more

Vector 2 is Officially a Thing and it...
Vector is a pretty cool parkour-driven runner that's gotten a pretty decent following since it first came out - although personally I think more people could stand to show it some love. Anyway, Nekki has announced that a sequel isofficially on its... | Read more »
This Week at 148Apps:June 22-26, 2015
June's Summer Journey Continues With 148Apps How do you know what apps are worth your time and money? Just look to the review team at 148Apps. We sort through the chaos and find the apps you're looking for. The ones we love become Editor’s Choice,... | Read more »
LEGO® Minifigures Online (Games)
LEGO® Minifigures Online 1.0.1 Device: iOS iPhone Category: Games Price: $4.99, Version: 1.0.1 (iTunes) Description: | Read more »
World of Tanks Blitz celebrates its firs...
Today marks the first anniversary of the launch of World of Tanks Blitz, the mobile version of the PC tank battler, World of Tanks. World of Tanks Blitz launched on iOS and Android on June 26th last year and to celebrate, Wargaming is giving all... | Read more »
Heroes and Castles 2 Has its Own Standal...
Heroes and Castles 2 is a third-person castle defense game from the same team behind Block Fortress and Bug Heroes. It's cool, it's fun, and now it has its very own free version. [Read more] | Read more »
Formula Cartoon All-Stars Lets You Race...
Ever want to pit your favorite characters from shows like Steven Universe, Adventure Time, and Regular Show against each other in a not quite death race? Well once upon a time you could, but Formula All Stars Touch N' Go doesn't exist anymore. Hope... | Read more »
Retype - Typography Photo Editor (Photo...
Retype - Typography Photo Editor 1.0 Device: iOS Universal Category: Photography Price: $2.99, Version: 1.0 (iTunes) Description: Retype is built out of passion for great typography and it's all about adding text to photo with style... | Read more »
Hungry Shark Evolution Celebrates Shark...
Shark Week is almost here, as is Independence Day, so naturally Hungry Shark Evolution is going to get in on the action. Yes, even the fireworks. [Read more] | Read more »
The New Trivia Crack Will Feature a Musi...
It's official: iHeartMedia (you may know them from iHeartRadio) will be in charge of providing music-related questions for Trivia Crack's upcoming sequel. Also Trivia Crack is getting a sequel. [Read more] | Read more »
Toca Life: City (Education)
Toca Life: City 1.0 Device: iOS Universal Category: Education Price: $2.99, Version: 1.0 (iTunes) Description: Welcome to Toca Life: City, a metropolis filled with everyday fun! Customize characters, explore exciting locations and... | Read more »

Price Scanner via MacPrices.net

12-inch 1.2GHz Gray MacBook on sale for $1487...
Amazon.com has the new 12″ 1.2GHz Gray MacBook in stock and on sale for $1487 including free shipping. Their price is $102 off MSRP, and it’s the lowest price available for this model. We expect... Read more
15-inch 2.2GHz Retina MacBook Pro on sale for...
Amazon.com has the 15″ 2.2GHz Retina MacBook Pro on sale for $1819 including free shipping. Their price is $180 off MSRP, and it’s the lowest price available for this model. Read more
OtterBox Releases New Symmetry Series Metalli...
Otterbox’s new Symmetry Series of smartphone cases flaunts the best of both both street style and street smarts with their new metallic finishes and trusted OtterBox protection for iPhone 6 and... Read more
Eliminate Cable Chaos with New GE Branded Wra...
GE licensee Jasco Products has introduced a new line of GE branded Wrap-n-Charge USB wall chargers with built-in cable management. “We are always working to combine great technology with innovative... Read more
2015 13-inch 2.7GHz Retina MacBook Pro on sal...
B&H Photo has the new 2015 13″ 2.7GHz/128GB Retina MacBook Pro on sale today for $1199 including free shipping plus NY sales tax only. Their price is $100 off MSRP, and it’s the lowest price for... Read more
13-inch 2.5GHz MacBook Pro (refurbished) avai...
The Apple Store has Apple Certified Refurbished 13″ 2.5GHz MacBook Pros available for $829, or $270 off the cost of new models. Apple’s one-year warranty is standard, and shipping is free: - 13″ 2.... Read more
Apple refurbished iPad Air 2s available for u...
The Apple Store has Apple Certified Refurbished iPad Air 2s available for up to $140 off the price of new models. Apple’s one-year warranty is included with each model, and shipping is free: - 128GB... Read more
MacBook Airs on sale for up to $75 off MSRP
Save up to $75 on the purchase of a new 2015 13″ or 11″ 1.6GHz MacBook Air at the following resellers. Shipping is free with each model: 11" 128GB MSRP $899 11" 256GB... Read more
Apple’s Education discount saves up to $300 o...
Purchase a new Mac or iPad at The Apple Store for Education and take up to $300 off MSRP. All teachers, students, and staff of any educational institution qualify for the discount. Shipping is free,... Read more
Save up to $600 with Apple refurbished Mac Pr...
The Apple Store has Apple Certified Refurbished Mac Pros available for up to $600 off the cost of new models. An Apple one-year warranty is included with each Mac Pro, and shipping is free. The... Read more

Jobs Board

*Apple* TV Live Streaming Frameworks Test En...
**Job Summary** Work and contribute towards the engineering of Apple 's state-of-the-art products involving video, audio, and graphics in Interactive Media Group (IMG) at Read more
Project Manager, WW *Apple* Fulfillment Ope...
…a senior project manager / business analyst to work within our Worldwide Apple Fulfillment Operations and the Business Process Re-engineering team. This role will work Read more
Senior Data Scientist, *Apple* Retail - Onl...
**Job Summary** Apple Retail - Online sells Apple products to customers around the world. In addition to selling Apple products with unique services such as iPad Read more
*Apple* Music Producer - Apple (United State...
**Job Summary** Apple Music seeks a Producer to help shepherd some of the most important content and editorial initiatives within the music app, with a particular focus Read more
Sr. Technical Services Consultant, *Apple*...
**Job Summary** Apple Professional Services (APS) has an opening for a senior technical position that contributes to Apple 's efforts for strategic and transactional Read more
All contents are Copyright 1984-2011 by Xplain Corporation. All rights reserved. Theme designed by Icreon.