Shortlink

Plain Old Objective-C class – II

In the earlier post we had a simple Car class with model and year variables. The Car interface had the declarations for model and year properties and the implementation had the setter/getter methods for these.
It’s pretty frustrating to hand-toss properties all the time. You can use the @property directive to declare the properties in the interface like shown below.

//Car.h
@interface Car : NSObject {
    NSString* model;
    int year;
}
@property NSString* model;
@property int year;

@end

In our implementation instead of defining the getter/setter for model and year you can use @synthesize directive that generates getter/setters.

//Car.m

#import "Car.h"
@implementation Car
  @synthesize model;
  @synthesize year;
@end

The @synthesize directive generates a model/setModel and year/setYear methods. The ‘get’ prefix is ignored in the ‘getter’ methods generated. Also while invoking the model and year you can use the dot notation instead of using it like a method as shown below.

#import "Car.h"
int main (int argc, const char * argv[])
{
    
    Car *car1 = [Car alloc];
    car1.model = @"Cadillac";
    car1.year = 2008;
    
    NSLog(@"Model: %@, Year: %d",car1.model,car1.year);
}
Shortlink

Plain Old Objective-C class

Let’s create a simple class Car with model and year properties and getter/setter methods in Objective-C.
In Objective-C the class implementation is split into two parts, the interface definition and the implementation. The interface is defined in a .h file and the implementation in a .m file. The interface has the list of variables and method declarations.
A Car.h file with the definition for Car interface is shown below.

//Car.h
@interface Car : NSObject {
    NSString* model;
    int year;
}
-(int)year;
-(void) setYear:(int)input;

-(NSString*)model;
-(void) setModel:(NSString*)input;

@end

The Car interface has the model and year variables. It also has the definition of getter/setter methods. The ‘get’ prefix word is not required for the getter methods. The minus (-) sign before the method definitions indicate that they are instance methods.

The implementation class Car.m is shown below.

#import "Car.h"

@implementation Car
    -(NSString*) model{
        return model;
    }
    -(void) setModel:(NSString *)input{
        model = input;
    }

    -(int)year{
        return year;
    }
    -(void) setYear:(int)input{
        year = input;
    }
@end

Car.m implements the Car interface and provides the implementation for getter/setters of model and year.
If you want to create an object of Car class and access the methods, you can do it as shown below.

    Car* car1 = [Car alloc];
    [car1 setModel:@"Audi"];
    [car1 setYear:2012];
    NSLog(@"Model: %@, Year of make: %d",[car1 model],[car1 year]);

We have created an object of Car class ‘car1’ and assigned values to the model and year. A method is accessed using [object methodName:params] syntax in Objective-C.
Objective-C 2.0 (released long ago) provides a much easier syntax to define the accessors. We will discuss it in our next post.

Shortlink

GuessingGame logic in Sencha Touch 2.0

It’s fun writing OO code Sencha Touch 2.0. Ext.define is used to define clases and Ext.create for creating objects. Ext.define has it’s own set of rules to define properties, constructors, methods etc. Here is an example of the favourite Guessing Game class written in Sencha Touch 2.0. The GuessingGame class that has the core logic sans the UI is shown below:


Ext.define("GuessingGame",{
	config : {
		target : 0,
		attempts : 0,
		message : "",
		gameOver : false
	},
	constructor : function(config){
		this.initConfig(config);
		this.setTarget(Math.floor(Math.random()*101));
	},
	play : function(guess){
		var target = this.getTarget();
		var attempts = this.getAttempts();
		var message = "";
		attempts++;
		if(guess > target)
			message = "Aim Lower";
		if(guess < target)
			message = "Aim Higher";
		if(guess == target)
		{
			message = "You have got it!!!";
			this.setGameOver(true);
		}
		this.setMessage(message);
		this.setAttempts(attempts);
	}
});

You can create an object of the GuessingGame class like

	var game = Ext.create("GuessingGame");
	game.play(50);
	alert(game.getMessage());
	// continue playing the game

Shortlink

Dynamic access in JavaScript

A simple yet powerful feature in JavaScript that can save you several lines of code is the ability to dynamically access members of a class(or a function). A Calculator function is shown below

function Calculator(){
	this.add = function(num1,num2){
		return num1+num2;
	}
	this.subtract = function(num1,num2){
		return num1 - num2;
	}
}

Let’s create an instance of Calculator ‘calc’.

	var calc = new Calculator();

If you want to access the add and subtract methods based on the user input, you’ll land up having if-else conditions in the code like,

		
	if(someCondition)
		calc.add(num1,num2); //num1 and num2 are textbox inputs
	else
		calc.subtract(num1,num2);

The dynamic feature in JavaScript can come in handy in this situation. You can invoke the add and subtract methods like shown below.

	var operation = "add"; //or "subtract" based on the user input
	calc[operation](num1,num2); 

So the members of the object can be invoked using an array like syntax. This feature is very widely used in languages like Groovy also.
This spares us several lines of code in JavaScript.

Shortlink

Snapshots of using Sencha Touch in Eclipse

Given here are snapshots of working with Sencha 2 using Eclipse-Indigo.
You can create a “Dynamic Web Project” in Eclipse and copy the core sencha libraries to the “WebContent” folder. Shown below is a sample web project in Eclipse with the Sencha libraries copied to it.

Notice the touch folder that has the Sencha “src”, “resources” and sencha-touch-all.js in WebContent.
The index.html with the hello world code is shown below.

You can view videos of Sencha Touch v2 here.