A fantastic resource for Cocoa, Objective-C and programming in general

The script called PropertyFromInstanceVariable had already been added to by a couple of other people, Yung-Luen Lan & Mike Schrag and Pierre Bernard and I have now shaped it for my own specific needs, and possibly yours too.

The tedium I was trying to eliminate was the process of creating Objective-C properties from instance variables and doing basic memory management on them. This is a repetitive process that seems more appropriate to hand off to the machine.

Matt’s script allows you to take an instance variable defined in your interface file and automatically create a property for it, synthesize the property in the implementation, add a release statement and set the property to NULL in the dealloc method.

For example, running the script on this:

NSString *myString;

would automatically create this in the interface:

@property (nonatomic, retain) NSString *myString;

this at the top of the implementation:

@synthesize myString;

and adds these two lines to the dealloc method:

[myString release];
myString = NULL;

Because this script was written before the viewDidUnload method had been added to the UIViewController class it didn’t make use of the viewDidUnload method. I wanted to update it to set the retaining references to subviews in the view hierarchy to nil. These reference properties may have been set through IBOutlets when loading a nib or programmatically in the loadView method.

I have now modified the script to reflect my own coding habits. It still creates the property, synthesizes it and adds a release to the dealloc method, but if the class is a subclass of UIViewController then this is placed in viewDidUnload like so:

self.myString = nil;

This script can be run on multiple instance variables at once and greatly cuts down on the time it takes to set up a new class. Instructions on installing the script can be found here.

You can get my fork of the script on github.

NOTE: I have updated to script and edited this post to reflect those changes. All links are to the most recent version.

OverlayViewTester screenshot

So first I will describe the OverlayViewTester app. Basically it just overlays some cool looking red selection braces on a camera view and has a button that when pressed performs a ‘scan’ for two seconds and lets you know by adding a “Scanning…” label at the top of the screen during that time. So really it does nothing, but it looks good and is a good first step to making a more fun and interesting interactive camera overlay app.

To get started download the source code from GitHub. Next I will go through the files in the project and present the juicy bits. Consult the source code you downloaded for the full meal deal.

OverlayViewTesterApDelegate

Taking a look at the project we start with a typical app delegate, OverlayViewTesterAppDelegate which loads the OverlayViewController. Nothing monumental there so I won’t bother reproducing it here.

OverlayViewController

Now on to the OverlayViewController where we create the camera view.

In the interface, OverlayViewController.h: we define some constants:

// Transform values for full screen support:
#define CAMERA_TRANSFORM_X 1
#define CAMERA_TRANSFORM_Y 1.12412

// iPhone screen dimensions:
#define SCREEN_WIDTH  320
#define SCREEN_HEIGTH 480

In the implementation, OverlayViewController.m there is a bit of a GOTCHA. The line

[self presentModalViewController:picker animated:YES];

must be called in viewDidAppear: not in a viewDidLoad: method. Here it is:

- (void) viewDidAppear:(BOOL)animated {
    OverlayView *overlay = [[OverlayView alloc] initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGTH)];

    // Create a new image picker instance:
    UIImagePickerController *picker = [[UIImagePickerController alloc] init];

    // Set the image picker source:
    picker.sourceType = UIImagePickerControllerSourceTypeCamera;

    // Hide the controls:
    picker.showsCameraControls = NO;
    picker.navigationBarHidden = YES;

    // Make camera view full screen:
    picker.wantsFullScreenLayout = YES;
    picker.cameraViewTransform = CGAffineTransformScale(picker.cameraViewTransform, CAMERA_TRANSFORM_X, CAMERA_TRANSFORM_Y);

    // Insert the overlay:
    picker.cameraOverlayView = overlay;

    // Show the picker:
    [self presentModalViewController:picker animated:YES];
    [picker release];

    [super viewDidAppear:YES];
}

I think the comments make it clear what is going on there.

OverlayView

Next lets look at the custom subclass of UIView called OverlayView. This is where we actually create our overlay.

In the interface, OverlayView.h we declare two new methods:

- (void)scanButtonTouchUpInside;
- (void)clearLabel:(UILabel *)label;

Here are the important parts of the implementation, OverlayView.m:

- (id)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {
        // Clear the background of the overlay:
	self.opaque = NO;
	self.backgroundColor = [UIColor clearColor];

	// Load the image to show in the overlay:
	UIImage *overlayGraphic = [UIImage imageNamed:@"overlaygraphic.png"];
	UIImageView *overlayGraphicView = [[UIImageView alloc] initWithImage:overlayGraphic];
	overlayGraphicView.frame = CGRectMake(30, 100, 260, 200);
	[self addSubview:overlayGraphicView];
	[overlayGraphicView release];

	ScanButton *scanButton = [[ScanButton alloc] initWithFrame:CGRectMake(130, 320, 60, 30)];

	// Add a target action for the button:
	[scanButton addTarget:self action:@selector(scanButtonTouchUpInside) forControlEvents:UIControlEventTouchUpInside];
	[self addSubview:scanButton];
    }
    return self;
}

- (void) scanButtonTouchUpInside {
    UILabel *scanningLabel = [[UILabel alloc] initWithFrame:CGRectMake(100, 50, 120, 30)];
    scanningLabel.backgroundColor = [UIColor clearColor];
    scanningLabel.font = [UIFont fontWithName:@"Courier" size: 18.0];
    scanningLabel.textColor = [UIColor redColor];
    scanningLabel.text = @"Scanning...";

    [self addSubview:scanningLabel];

    [self performSelector:@selector(clearLabel:) withObject:scanningLabel afterDelay:2];

    [scanningLabel release];
}

- (void)clearLabel:(UILabel *)label {
    label.text = @"";
}

Notice that we have used an instance of ScanButton which we will get to next. When the ScanButton detects a UIControlEventTouchUpInside it calls the scanButtonTouchUpInside method which places a label on the screen for 2 seconds.

ScanButton

So finally we are left with our ScanButton. You might think that for a custom button we would subclass UIButton, but unless you really want to use the UIBUtton method setTitle:ForState it is recommended that you subclass UIControl. It will save you a world of hurt.

Here is the interface, ScanButton.h:

#import <Foundation/Foundation.h>

@interface ScanButton : UIControl {
}

- (void)buttonPressed;

@end

I put the buttonPressed method in here for future use. It is meant to be used to change things related to the button itself and not the actions associated with the button in the OverlayViewController. You could for example use it to have the button’s image or state or both toggle.

Last but not least we have the implementation, ScanButton.m:

#import "ScanButton.h"

@implementation ScanButton

- (id)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {
	// Set button image:
	UIImageView *buttonImage = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 60, 30)];
	buttonImage.image = [UIImage imageNamed:@"scanbutton.png"];

	[self addTarget:self action:@selector(buttonPressed) forControlEvents:UIControlEventTouchUpInside]; // for future use

        [self addSubview:buttonImage];
    }
    return self;
}

- (void)buttonPressed {
    // TODO: Could toggle a button state and/or image
}

@end

So there you have it. A custom camera overlay and a custom button. I hope that with this code you will be well on your way to writing much more useful, interesting and creative apps than this example. Happy coding!

//
//  helloworld.m
//  helloworld
//
//  Created by John Smith on 24/10/09.
//  Copyright __MyCompanyName__ 2009. All rights reserved.
//

then it is time to open up your Terminal app.

OSX Terminal app

You will find it at ~/Applications/Utilities/Terminal.app.

Enter the following in the open terminal (replacing the company name with yours):

defaults write com.apple.Xcode PBXCustomTemplateMacroDefinitions '{"ORGANIZATIONNAME" = "Smith Incorporated";}'

Now when you create new source files in XCode you will see this:

//
//  helloworld.m
//  helloworld
//
//  Created by John Smith on 24/10/09.
//  Copyright Smith Incorporated 2009. All rights reserved.
//

Much better.