iPhone Tutorial5–Views-Transition

This tutorial will focus on transitioning from one view to another. We will be utilizing Windows based Application to move from one view to another view.

In this tutorial you will learn:

• Add A Windows Based Application.
• Add a View Controller
• Add a class to create Array
• Set Up The Transition To The View
• Connect The View To The Code

Creating a New Window Based Application

Start a new iPhone OS Project
Click Xcode > New Project and a window should pop up like this:

Make sure Application is selected under iPhone OS and then select Windows-Based Application. Click Choose… It will ask you to name your project. Type in “Tutorial 3 –transition between view” and let’s get started.

Now, all of these files together create a basic program.When you click Go ahead and click on the Build and Go button ,It display the bellow

You will see the iPhone simulator start and your program will launch.

Use Array to display Fresa Content in First View:-

Process to create Array class :-

1. For Creating Array for fresa application à GO TO FILE à ADDà New Fileàand Select Objective C –Class and enter the name of file .The Screen will look like this

2. Now start by opening FresaCellView.h. This is the class for view controller that Apple display fresa content to main view .

Here you are creating the instance of Label and image to display the content to label and Picture to Image view control and you are creating method .

1. Now start FresaCellView.m.

Here you have created the class and initialize the label.

1. Now you want to utilize this class , you have to create a new table view controller class. For Creating New Viewcontroller Class . All of the functions you see already created in here are functions that have been overridden from the Table View super class.

Process to create viewController Class

1. GO TO File à ADD à New File àSelect Objective C Class àEnter the name àFresaTableViewController.

Automatically two file will created .

1. FresaTableViewController.h
2. FresaTableViewController.m

Now you have to write code to utilize the FresaCellView Class .

Here you have to import fresaCellView class in FresaTableViewController.h .

This is fresatableViewController.m file . here you have to define your fresa content , Which will be appear in simulator

Since we are editing a table, all of these functions will be related to editing a table. So find the function called numberOfRowsInSection.

This function tells the application how many rows are in our table. Currently, it returns 0. Let’s change that to return no of content defined in array

.

Now go down to the function called cellForRowAtIndexPath. This function gets called once for every row. This is where we define what content to display in a given row. In this case we want the row to be a string that says.

What this function is doing is creating a new cell object and returning it. The code between the i(cell==null) block checks to see if we have created a cell before, if not build a new cell, otherwise use the one we created before. This helps in performance so we don’t need to build new cells each time we visit this function. So right before the // Set up the cell comment add the following code:

[call setLabelText:[arryData objectAtIndex:indexPath.row]];

Now come to the main file Tutorial2_NsArrayAppDelegate.h and Tutorial2_NsArrayAppDelegate.m .

For displaying view to the main window you have to create navigationControll to mapped with the view.

Now You have to create User Interface to display the fresa content .

Process to Create User Interface View :-

1.GOTOà ResourceàAdd File àView UIàAdd Label and ImageView

Now most important part to mapping with label and image. You have to mapped with the class .Here description text properties which is defined in fresaCellView.h class is mapped with label .

Process for User Interface :

1. Now open Window.xib file.
2. Drag and drop Navigation control to mainwindow.xib .
3. Select Tutorial2_NsarrayAppdelegate class from Class identity.
4. Now most important part here is that, You have to mapped navigationcontroller with the navigationControlle tab which you have selected from Library.

5. Now Call FresatableViewcontroller.xib file in View Controller properties . the screen will be look like this .

After Mapping Click the Build and Go button again to launch the iPhone simulator. You should see screen look like this and your content will display on the screen

Now here you want to transition between one view to another view . When you will click the Fresa menu the data or content of the respective menu will be display to other view . For displaying the content or description of the menu You have to follow the following process .

Add A New View

We will now add the view that we will be transitioning to. Click on. Once inside Interface Builder click on File -> New and select View.

It will add a blank View to your project mention the name nextviewcontroller . For now, we will keep it simple. Go ahead and drag a new Label on to the View.

Let’s save the view. Click File -> Save. Call it NextViewController.

Add A View Controller

Now we need to create a NextViewController class. This class will be used to connect the view that we just created to our code. Inside of Xcode click File -> New File… Select UIViewController subclass and click Next.

Name it NextViewController and make sure “Also create “NextViewController.h” “ is checked. Click Finish to continue. This will add the new ViewController to your project.

Set Up The Transition To The New View

Open up Tutorial2_transitionAppdelegate.h and add the following code:

Now go and Run

When you click on “ Fresa menu” it should transition to:

Notice the back button at the top with the text “Fresa”.

Tags: 3D Game, Abha Anjan, Array, cellForRowAtIndexPath, dremsus, IPhone, iphone Array class, iphone Fresa, iphone Interface Builder, iphone NextViewController, iPhone publishing, iphone simulator, Nested loops, numberOfRowsInSection, View, View Based, View Controller, viewController, Windows Based Application, XCode