So here we are going to see how to develop a simple iphone application which will take an input from the user and display it as soon as the user submits it. Here’s a snapshot of actually how our application will look like.
This application will help you to understand how to use various IBOutlet elements such as UITextField and UILabel and how to handle events and actions such as a button click.
So lets get started :-
1.) Creating a new project
The first step is to create a new project. For this we need to :-
a.) launch Xcode.
b.) click on File -> New Project.
c.) select Application (under iPhone OS).
d.) select View-Based Application project template.
e.) click on choose.
f.) save the project and give it a name.
Xcode creates some files for us based on the name of the project, so we need to be careful with the name we provide. I have named my project “basic“.
This is how the list of files look like in Xcode.
All the class files are stored under the “Classes” folder, some special files are listed under “Other Sources”, all the view files and resources show up under “Resources”, and any library or frameworks we add to our project are listed under the “Frameworks” folder. It is important that we save all the images, files, databases, and views in the “Resources” folder because all the iPhone apps run in its own sand box, which means they can only access files placed under the resources folder.
2.)Building the Interface
So our next step is to build the user interface for our application. For this we have to just go to the “Resources” folder and just click on the “basicViewController.xib” file. This will launch the”Interface Builder” which consists of few windows.
If some of the windows don’t open up , you can open them by going to the Tools menu at the top.
a.)Now we will go to the “Library window” and from there we will select a “TextField” and drag it to the “View window”.
b.)Same way we are going to drag a “Round Rect Button” and a “Label”.
c.) Select the “Round Rect Button” and type in “submit” on the button.
d.)Then we will select the “TextField” in the “View window” and we will see that its get highlighted. Then we will move on to the “Inspector window” from where we can change the attributes of the selected element.
There we see a “TextField” attribute known as “Placeholder“.There we are going to write “please enter your name” and then click on the “View window”. We see that our text appears in the “TextField” in a light grey color. This actually prompts the user of what he has to do. Its much better than putting a label for that.
We have to declare or define the objects and functions in the “.h file” or the “header file” and then implementation is done in the “.m file“.
a.)So Code for “basicViewController.h” file
There would be a piece of code that Xcode has already written for you. Here’s what the whole code will look like.
Here we define the objects we used in our interface which were the “TextField” and “Label”.We will discuss about the “property” statement later and we also define a function “doSomething” which return an “IBAction” i.e it will return an action.
b.)Code for “basicViewController.m” file
Here is where we are going to implement our function.You would see many commented lines of code which Xcode provides you. Here’s what the whole code will look like
a.)Now here we see “synthesize” statements.Actually the “property” statements and the “synthesize” statements generate the “getter and setter methods” for the element.
b.)In the “doSomething” function we initialize a String that takes the user name entered in the “TextField” and displays it in the “Label” when the button is clicked.
c.)At the end we will release the string. The delloc function called at last releases all the resources held by the application when the application ends.
The “retain” and “release” methods are used mainly in the memory management of iPhone applications, that’s because there isn’t any garbage collection in the iPhone OS.
4.)Building the Connections
Our next step is to build the connections between the code we have written with our Interface elements.
a.)So we click on the “basicViewController.xib” in the “Resources” folder to launch “Interface Builder.
b.)There in the “Document window” we select “File’s Owner” and right click it.
c.)Now a window pops up which shows all the “Outlets and Actions” defined by us.
d.)We select the “lblMessage” outlet and drag it to the Label in the View window as shown in the figure.
e.)Then we select the “txtName” outlet and drag it to the TextField same as above step.
f.)Then we select the “doSomething action” and drag it to the Round Rect Button in View window. A pop up appears with various options. From it we select the “Touch Up Inside” option which means action will take place when the button is touched from inside.
g.)Go to the File menu and Save it.
5.)Build and Run
Now finally we have to go to the Xcode and there at the top bar we see “Build and Run“. Just click it to run the application. Make sure we have saved our application before doing this.
An “iphone Simulator” is lauched and our application is loaded and ready for us to use.
So just go ahead and type in your name and press “submit”.
Make the keyboard disappear
We see when we just go to the “TextField” to enter our name , the keyboard pops us. This is the default behavior. We need not to write any code for this.
But when we press “submit” or “click anywhere else” or “return”, the keyboard doesn’t disappear. According to “iphone user interface guidelines for developers” , we have make that happen and for that we have to write a bit of code.
This we will see in our next article.