Create view without InterfaceBuilder for iPhone

Although InterfaceBuilder is an important tool for iPhone development, the tool is not as intuitive to use as Visual Studio UI designer.
To help understand what interfacebuilder does, we can create the interface without using InterfaceBuilder, and then comparing the corresponding steps done by InterfaceBuilder.

Steps to add a ViewController without using InterfaceBuild:
1. Create a Window based iPhone application
2. Add a new UIViewController subclass in the project. Do not select "With XIB for user interface" checkbox
3. In the UIViewContollerSubclass' viewDidLoad method, create some UI elements and then add them into UIViewController.view collection by [self.view addSubview:uiElement] method.
4. In WindowAppDelegate.m didFinishLaunchingWithOptions method, create a instance of this new UIViewControllerSubClass instance, add it into appliation's main window with [window addSubview:uiViewControllerInstance.view].

Comparing with InterfaceBuilder to do the same thing, the following steps are required
1. If a UI sub class is created in the app for a ui element, like UIViewControllerSubClass, then the identity class of the UI element added in InterfaceBuilder needs to set the corresponding sub class with Identity Inspector.
2. For UIViewController object, use Attribute Inspector to set the NIB name to load the xib file, this associates the xib file with the UI control added in InterfaceBuilder.
3. Any IBOutlet property , or IBAction defined in .h file need to be associated with the corresponding ui element added in InterfaceBuilder.
4. File owner is the class that will load the xib file at runtime, for MainWindow.xib, it must be UIApplication classor its subclass. For UIViewController.xib, it must be a subclass of UIViewController class.

Jonathan

How to hide and show soft keyboard on iPhone simulator

When testing with iPhone simulator, occasionaly, you will need to show or hide the soft keyboard. To do so, go to IOS simulator's Hardware menu, and select "Simulator Hardware Keyboard" submenu, it will toggle the soft keyboard's state.


Jonathan

Protocol in Objective C

Protocol in Objective C is quite similar to interface in java or .net, so there is not much to say about it.

To define a protocol in a class header as
@protocol MyProtocol
-(void) myfunction;
@end

The header file of the class that implements a protocol looks like the following, notice the syntax is quite similar to category but uses angle bracket instead of parenthesis.

@interface MyUserClass : NSObject .

Jonathan

Category in Objective C

Category in Objective C is a new concept to C++ developer. The catetory must associate with any existing class, even if the class implementation is not accessible to you. Note that a cateory can not declare additional instance variables for the class. It can only include instance methods.
While category is similar to subclass, the difference is with category, the new methods directly added into the original class without creating a new derived class.

The syntax is

Header file (name convention is "classname+categoryname.h"):
#interface "ClassName.h"

@interface ClassName (CategoryName )
- (int) categoryFunction;
@end


Implementation file (name convention is "classname+categoryname.m"):
#import "classnmae+categoryname.m"

@implementation ClassName (CategoryName )
- (int) categoryFunction {
return 0;
}
@end

Note another Objective C feature: Extension is like cateory but without an name, the extension methods must be implemented in the main @implementation block of the corresponding class. The extension example is shown below:
Header file ( "classname.h")
@interface ClassName ()
- (int) extensionFunction;
@end

implementation file ("classname.m")
@implementation classname

... class methods implementation

- (int) extensionFunction {
return 1;
}

@end

Jonathan

Object inheritance with Javascript

Prototype can be used to define data member and function member to a object. It also is used to realize inheritance for javascript. In order to inherit an object from another object, we set the new the new function's prototype to the existing function as show below:
function base()
{ this.inbase = 2;}

base.prototype.inbaseProto = 3;
base.prototype.getint = function()
{
return 3;
}

derived.prototype = new base;
function derived()
{ this.inderived = 4;}

derived.prototype.inderivedProto = 5;

x = new derived;
s = x.getint();

alert(base.inbase + ', ' + x.inbaseProto + ', ' + x.inderived + ', ' + x.inderivedProto + ', ' + s );
The result is "2, 3, 4, 5, 3";

Jonathan

Use prototype to make javascript object oriented

Unlike other object oriented language, javascript does not support the common way of defining data member or function member. However, this can be supported in javascript by using prototype.
For javascript, when a function is defined, it automatcally gets a data member of prototype, which also has a constructor method by default- i.e the function itself. The constructor is used to create the instance of the object. If any data members or function members are defined on this prototype object, then all instances created by the function will automatically have those data members and function members defined, similar to other object oriented lanaguages, the code is shown below,
function f(){
}
f.prototype.datamember=3.14159;

// create the object method
function f2(o){
alert(o);
}
f.prototype.funcmember=f2;

Note for prebuild types, only object, image, string, data and array can have their prototype changed to add new data members and function members, which means you can extend new function into those prebuild types. With the following code, then all instance of object will have the newprop as 123.
Object.prototype.newprop = "123";

Note if a same named property is defined in both object instance itself and object propotype, then the object instance property will take priority.
Jonathan

Function object and this in javascript

Unlike other languages, function in javascript is an object same as other instance object. For example, if the following function is defined
function f(m,n) {
this.x = m;
this.y = n;
}

Then calling
var o1 = f;
Then the type of o is an object that represents the function. It is not a instance that is created by the f function.

Now let us see what happens if calling
var o2 = new f;
This time, the function serves as the construct to create a instance . The instance has two data member x, and y, whose values are not initialized. To set the data member values, calling
var o3 = new f(1, 2);

Now try to use the function in a different way as showing below
var o3 = f(2, 3);
This time, the function f is not used as a constructor, instead it is just a normal javascript method call, inside the function f, this pointer points to the window object of the current html page, and it just sets two new data members to the window object.

Another thing unique in javascript is, although any object instance can add new data members by just calling assigning operation as below
this.x = somevalue;

It can not do so to directly call a javascript funtion on an instance object. Instead, it must first assign the function to the instance's member before calling the function on it.
this.f = somefunction;
this.f();

By the way, the this point in javascript function call chain is not inherited. So if within a function A, the this points to instance Obj1, then calling function b from function A, within the function b, the this pointer is the global object, instead of Obj1. If you want to set the this pointer Obj1 to be function b's this pointer, then you must first assign function b as a member of Obj1, and then calling function as its member function. This also explains why we need to assign onclick attribute to a external function and then call onclick to keep the current html element as the external function's this object.